ダウンロード サンプルファイル (12.5 MB)
ビヘイビアー
Expression BlendでSilverlightのデザインをしているときに、マウスがあるコントロールに入ったときにアニメーションを動かしたいとします。Silverlight 2まではC#やVisual Basicのコードを記述してアニメーションを再生する必要がありました。
Silverlight 3からは簡単な命令であれば、事前に設定された命令の集まり（ビヘイビアー）を指定することでC#やVisual Basicなどのコーディングをすることなく画面の動きを定義することができます。
例えば前回の記事で使用したで作成したTreeViewのサンプルで、TreeViewにマウスカーソルが入った時に色を変え、外れたときに色を元に戻したい場合は、ChangePropertyActionビヘイビアーをTreeViewに追加してビヘイビアーのプロパティを変更するだけです。コーディングは必要ありません。
Expression Blendでの操作を図5に示します。
1. ビヘイビアーの追加
アセットパネルのビヘイビアーからChangePropertyActionビヘイビアーを選択し、ビヘイビアーを適応させたいコントロールにドロップします。
2. トリガーを設定 ※括弧の中は設定値です。
SourceNameにトリガーの発生元のコントロールを、EventNameに発生元のイベント名を設定します。
3. 変更先を設定
TargetNameに変更対象のコントロールを、PropertyNameに変更するプロパティ名を設定し、プロパティに応じた値を設定します。
マウスがTreeViewに入った際にChangePropertyActionビヘイビアーを使って背景色を変更する設定を表2に示します。
| 分類 | プロパティー名 | 設定値 | 備考 |
| トリガー | SourceName | treeView | イベントの発生元コントロール |
| EventName | MouseEnter | トリガーとするイベント | |
| 共通プロパティ | TragetName | treeView | 変更対象のコントロール |
| PropertyName | Background | 変更するプロパティ | |
| Value | SolidColorBrush（#FFCCFF66） | 設定するブラシ |
同様にマウスがTreeViewを抜ける際のChangePropertyActionビヘイビアーの設定値を表3に示します。
| 分類 | プロパティー名 | 設定値 | 備考 |
| トリガー | SourceName | treeView | イベントの発生元コントロール |
| EventName | MouseLeave | トリガーとするイベント | |
| 共通プロパティ | TragetName | treeView | 変更対象のコントロール |
| PropertyName | Background | 変更するプロパティ | |
| Value | No Brush | 設定するブラシ |
実行結果を図6に示します。実行してみると、実際にこれだけでマウスの動作に合わせて背景色が変更されるアニメーションが行われていることを確認できると思います。単純なことではありますが、コードを書かないということは簡単に画面を作成できるだけでなく、コーディングによるバグが入り込む余地を少なくし製品の品質向上につながります。
カスタムビヘイビアー
もともと用意されているビヘイビアーはアニメーションを実行したり、あるプロパティが変更されたときにターゲットのプロパティを変更するといった単純なものだけです。
Expression BlendではExpression SDKを利用することでカスタムのビヘイビアーを定義できます。また、MicrosoftのExpression Galleryにはすぐに利用できるビヘイビアーが用意されています。
ここではテキストボックスが空の際に、ボタンが押されたときに特定のメッセージを表示するビヘイビアーを作成します。
プロジェクトの作成
まずはカスタムビヘイビアー用のプロジェクトを作成します。Silverlight向けのカスタムビヘイビアーを作成するためには、Silverlight向けのクラスライブラリを作成し、次のアセンブリを参照に加える必要があります。
1. 新規プロジェクトを作成する
Visual Studioメニューの［ファイル］-［新規作成］-［プロジェクト］を選択し、Silverlightクラスライブラリを作成します。ここではプロジェクト名を「SampleBehaviors」とします（図7）。
2. 参照を追加する
Visual Studioメニューの［プロジェクト］-［参照の追加］から「System.Windows.Interactivity」を追加します（図8）。
- 修正履歴
-
- 2009/12/16 15:05 PSD互換→PDF互換
- 2009/12/16 15:02 PSD互換→PDF互換
この記事は参考になりましたか？
- Silverlight 3徹底入門連載記事一覧
- この記事の著者
-
山田 祥寛（ヤマダ ヨシヒロ）
静岡県榛原町生まれ。一橋大学経済学部卒業後、NECにてシステム企画業務に携わるが、2003年4月に念願かなってフリーライターに転身。Microsoft MVP for Visual Studio and Development Technologies。執筆コミュニティ「WINGSプロジェクト」代表。主な著書に「独習シリーズ（Java・C#・Python・PHP・Ruby・JSP＆サーブレットなど）」「速習シリーズ（ASP.NET Core・Vue.js・React・TypeScript・ECMAScript、Laravelなど）」「改訂3版JavaScript本格入門」「これからはじめるLaravel実践入門」「はじめてのAndroidアプリ開発 Kotlin編 」他、著書多数。
※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です
-
WINGSプロジェクト かるあ （杉山 洋一)（カルア(スギヤマ ヨウイチ)）
＜WINGSプロジェクトについて＞有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ（代表 山田祥寛）。主にWeb開発分野の書籍／記事執筆、翻訳、講演等を幅広く手がける。 2026年時点での登録メンバは約50名で、現在も執筆メンバを募集中。興味のある方は、どしどし応募頂きたい。著書、記事多数。 RSS X: @WingsPro_info（公式）、@WingsPro_info/wings（メンバーリスト） Facebook
※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です
この記事は参考になりましたか？
この記事をシェア
