cafe. Blend

Expression Blend 勉強会

cafe. Blend #4杯目

Blend勉強会やるよー cafe. Blendとは(http://cafe-blend.hatenablog.com/entry/2013/05/15/014837) 4杯目はストアアプリ特有のUIの勉強です。 セマンティックズームやアプリバー、縦対応などをみんなで試してみましょう。 参加希望者はこの記事に コメン…

cafe.Blend #3杯目 セッション資料

Cafe Blend 3杯目 from mitsuba まだまだ参加できますよー

cafe.Blend #2杯目 成果物

第二回の成果物です。 今回はStoryboardとVSMの勉強にカードフリップアニメーションのサンプルを作成しました。 http://c-mitsuba.com/files/cafeblend/CardFlip.zip ポイントは、連打クリックするとぱたぱたしてしまうのを、Storyboardの中にIsHitVisibleTe…

cafe. Blend #3杯目

Blend勉強会やるよー cafe. Blendとは(http://cafe-blend.hatenablog.com/entry/2013/05/15/014837) 3杯目はItemsTemplateとSampleDataの勉強です。 ファイルは前回のものを利用します。 新規参加の方はこちらからファイルをどうぞ。 http://cafe-blend.h…

cafe.Blend #2杯目 セッション資料

第2回のセッション資料! あしただけど、まだまだいけるよー

cafe.Blend #2杯目

Blend勉強会やるよー cafe. Blendとは(http://cafe-blend.hatenablog.com/entry/2013/05/15/014837) 2杯目はStyleとVSM (Storyboard)の勉強です。 ファイルは前回のものを利用します。 新規参加の方はこちらからファイルをどうぞ。 http://cafe-blend.hate…

cafe.Blend #1杯目 成果物

1杯目の成果物です。 セッション通りやるだけじゃなく、脱線しながらやるのはいいですね。 フォント問題とみつば的おすすめとか、普段使わないパネルの使い方とか、テンプレートの良し悪しとか、ガイドラインと必須要件とかとか。。。 普段なら5分で終わる…

cafe.Blend #1杯目 セッション資料

第一回のセッション資料!

その45:BlendからStyleのSetter Propertyを変更する。

例えば、ボタンがあるとして、このテンプレートを変更したいとき、右クリックして編集しますよね。 するとバインディングで予め定義されたプロパティがあることがわかります。 これらはテンプレートのより上のStyleで定義されていて、StyleのSetter Property…

cafe. Blend #1杯目

Blend勉強会やるよー cafe. Blendとは(http://cafe-blend.hatenablog.com/entry/2013/05/15/014837) 1杯目はGridパネルを使ってGridレイアウトの勉強です。 てきとーなGridレイアウトの例を持ってくるので、みんなで同じのをトレースしてみましょう。 参加…

cafe. Blendはじめました。

Expression Blendのハンズオンをまったりすすめる勉強会です。 使い方からパネルレイアウト、StyleやBehavior、SampleDatasetなどなどExpression Blendの範疇すべてを、基礎から取り上げます。 月1平日夜に、大阪、梅田近郊で開催します。 開催日の告知や募…

その44:Behaviorで変更する値の間を補間する

経緯 とっても簡単です。 プロパティの値を変えるには、このブログで何度も扱ったChangePropertyActionがありますね。 Rectangleのwidthを500pxの変えるビヘイビアをボタンがクリックしたら実行するようにしました。 ボタンをおすとー 一瞬で変わってしまい…

その43:Gridの使い方

このエントリはExpression Blendアドベントカレンダー20121日目です。 ちょっと京都にお泊りしていて、手元にSurfaceしか無かったので一日遅れ。 (Surfaceのエントリも後でかくよぉ。。。)まず1回目はGridを使ってみましょう。 パネル系は多解像度に対応…

その43:Gridの使い方

このエントリはExpression Blendアドベントカレンダー20121日目です。 ちょっと京都にお泊りしていて、手元にSurfaceしか無かったので一日遅れ。 (Surfaceのエントリも後でかくよぉ。。。)まず1回目はGridを使ってみましょう。 パネル系は多解像度に対応…

その42:チェックボックスをカスタマイズして、on/offに画像を利用する

おでさんがチェックボックスよーわからへんってつぶやいた途端、 まわりのWPクラスタが「VSMでいいよ!あとはみつばたんにきけばおk!」って全力で丸投げされたのでやってみました。とっても簡単です。 例えば、以下の様なonとoffのイメージがあるとしまし…

その41:TextTrimmingプロパティを使ってみよう

これ知らなかったのですが、TextBlockにはTextTrimmingプロパティという便利なプロパティがあります。 TextTrimmingプロパティを設定すると、TextBlockのサイズからはみ出したTextを...に丸めてくれます。 早速使ってみましょう。まずは、SampleDataSetを使…

その40:DataStoreChangedTriggerを使ってみる

引き続き、アメリカ上空からお届けしております。蜜葉です。 いや、いんたぁねっとがないから暇とかそういうわけじゃないんですよ(今回はDataStoreChangedTriggerを試してみましょう。 前回のTimerTriggerのサンプルに追記します。 前回はボタンをタップす…

その39:TimerTriggerをつかってみる

ただいま0から始めるExpression Blend をシアトルからお届けしております!これまで、ビヘイビアの挙動や振る舞いについてはいくつかご紹介しましたが、そういえばTriggerについてはあんまり紹介してなかったですね。というわけで、しばらくはTrigger回でも…

その38:Expression BlendでDataStoreを作成する。

Expression Blendを使えばパネルからデータストアを作成することができます。 試しに利用してみましょう。1.データタブから新しいデータストアを作成します。 2.データストアに名前をつけます。 3.できたデータストアを編集します。 4.名前や初期値…

その37の補足:”Inkscapeから素材を作成して、Expression Blendで扱うまで”の罠って?

やまきさんにツッコミを頂いたので補足します。 結論からいうと、このxamlはBlendにインポート機能が無かった時代に作られたWPF向けのXAMLです。具体的に中を見てみましょう。Expression Blendにaiでインポートしたペンギンのxamlです。 <Canvas x:Name="penguin" HorizontalAlignment="Left" Height="365.6" UseLayoutRounding="False" VerticalAlignment="Top" Width="376.8"> </canvas>

その37:Inkscapeから素材を作成して、Expression Blendで扱うまで

「ねぇねぇ、みつばたん。みつばたん普段素材どやってつくってんのー?あたしアプリつくりたいんだけど素材作るのに苦労しちゃってー。。。」 「ほむほむ、普段はillustratorつかってますよー」 「えーでもあたしそんなお高いのもってないー。なんかフリーで…

その36:アクティブなコンテナーを固定する

このコーナーもだいぶニッチなところを扱うようになってきました。通常Expression Blendではオブジェクトパネルからコントロールを選択してアクティブな状態にし、その子要素にコントロールを配置します。 なにが言いたいかというと、例えばStackPanelを選択…

その35:コントロールにコメントをつける

Expression Blendではデザインプレビュー上でコントロールにコメントを付けることができます。 こんなかんじ。 付ける方法はとても簡単です。 1.オブジェクトパネルから、コメントを付けたいコントロールを選択します。 2.ツール→コメントを作成をクリッ…

その34:Expression Blendで扱う単位を変更する

Expression Blendではみなさんご存知の通り、WPF/Silverlight/Windows Phone/MetroStyleAppsのアプリケーション開発が可能です。 WPFやSilverlightでは、CSSやLayoutRootなどでアプリケーションのサイズを決めますが、Windows Phoneでは800px * 480pxとなっ…

その33:コントロールを円状に設置する

コントロールを縦や横にきれいにならべる方法はStackPanelを使えば簡単ですが、円状に並べるにはどうすればいいでしょうか。 マージンでそれっぽく並べるのはスマートじゃないですね。そんなときはPathListBoxを使えばとっても簡単にコントロールを並べるこ…

その32:コントロールを回転させる

「コントロールの回転ってどうやってやるの?」 そう言われて扱ってなかったことに気が付きました。 <Image HorizontalAlignment="Right" Margin="0,203,108,104" Source="/Background.png" Stretch="Fill" Width="173" RenderTransformOrigin="0.5,0.5"> <Image.RenderTransform> <CompositeTransform Rotation="47.526"/> </Image.RenderTransform> </Image> Expression …

その31:カードフリップアニメーション

こんなアニメーションです。 1.Expression BlendでWindows Phoneプロジェクトを作成します。 2.ContentPanel内にGridを作成し、Cardと名前を付けました。 3.さらにCardの中にGridを2つ重なるように作成し、BackとForwardと名付けます。 4.まずはカ…

その30:Expression BlendからEffectを利用する

Silverlight/WPFではHLSLを使ったEffectの適用が可能です。 Expression Blendを使えばとても簡単にEffectをかけることができます。 デフォルトではBlurEffectとDropShadowの2つが用意されています。試しに1つかけてみましょう。 サンプルピクチャを設置し…

その29:デザイナで切ったGridを編集する

「Expression Blendで切ったGridってどうやって編集すんのよー!」と昨日、さおさんに言われたので方法を。まず、Blendのデザイナ上で、Gridの枠の近くにマウスカーソルを持って行くと、黄色の線が出ます。 この状態でクリックすると、Grid.RowDefinitionsだ…

その28:ビヘイビアを使ったデータの表現

先日の勉強会の懇親会で、 「DataGridに表示した値の大きさによって、赤にしたり黒にしたりしたかったんだけど、いい方法がみつけられなくて、カスタムコントロール頑張って作ったの。。。」 なんてお話があったので、 「それビヘイビアで3分だよ!」ってデ…