XAML デザイナー でコントロールを挿入し、そのビヘイビアーを変更するInsert controls and modify their behavior in XAML Designer

コントロールは、ユーザーとアプリとの対話を可能にします。Controls enable users to interact with your app. コントロールを使用すると、情報を収集できるとともに、オブジェクトのアニメーション化や、データ ソースのクエリなどのアクションを実行できます。You can use them to collect information and to perform actions such as animate an object or query a data source.

このトピックの内容In this topic:

アートボードにコントロールを追加するAdd controls to the artboard

コントロールは、 [アセット] パネルから アートボードにドラッグし、 [プロパティ] ウィンドウで修正できます。You can drag controls from the Assets panel onto the artboard, and then modify them in the Properties window.

Blend - Assets - FlipViewBlend - Assets - FlipView

次のビデオは、いくつかの一般的なコントロールの使用方法を示しています。These videos show you how to use some of the more common controls.

コントロールControl 短いビデオを見るWatch a short video
Menu Menu インストール済みフィーチャーの構成 コントロールを追加するConfigure Installed Features Add the controls
Button Button インストール済みフィーチャーの構成 ボタンをデザインするConfigure Installed Features Design a button
Textblock Textblock インストール済みフィーチャーの構成 textblock に画像を追加するConfigure Installed Features Add images to a textblock
Slider Slider インストール済みフィーチャーの構成 ツールヒント付きのスライダーをビルドするConfigure Installed Features Build a Slider with a ToolTip
GridSplitter GridSplitter インストール済みフィーチャーの構成 GridSplitter を使用するConfigure Installed Features Work with a GridSplitter

イメージ、図形、またはパスからコントロールを作成するMake a control out of an image, shape, or path

あらゆるオブジェクトをコントロールにすることができます。You can make any object into a control.

Blend の [コントロールの作成] ダイアログ ボックスBlend Make Into Control dialog box

たとえば、ページの中央にテレビの画像があるところを想像してください。For example, imagine a picture of a television in the center of a page. テレビのボタンのような小さいイメージからコントロールを作成できます。You could make controls out of small images that look like television buttons. 次に、このボタンをクリックしてチャンネルを変更します。Then, users could click those buttons to change the channel.

これが可能なのは、ボタンがコントロールになったためです。This is possible because the buttons are now controls. コントロールを使用すると;、ユーザーの操作に応答することができます。この場合は、ユーザーがボタンをクリックしたときです。With controls, you can respond to user interactions; in this case, when the user clicks a button.

コントロールを作成するには、オブジェクトを選択します。To make a control, select an object. [ツール] メニューで [コントロールの作成]をクリックします。Then, on the Tools menu, click Make Control.

コントロールの操作を行うMake controls do things

コントロールは、ユーザーが操作したときにアクションを実行します。Controls can perform actions when users interact with them. たとえば、アニメーションの開始、データ ソースの更新、またはビデオの再生を行えます。For example, they can start an animation, update a data source or play a video.

トリガービヘイビアーイベント を使用して、コントロールの操作を実行します。Use triggers, behaviors, and events to make controls do things.


トリガー は、プロパティを変更したり、イベントまたは別のプロパティの変更に応じてタスクを実行できます。A trigger changes a property or performs a task in response to an event or a change in another property. たとえば、ユーザーがボタンの上にマウスのポインタを置くとボタンの色が変化するなどです。For example, you can change the color of a button when users hover over it.

[トリガー] パネルThe "Triggers" panel

短いビデオを見る: インストール済みフィーチャーの構成 プロパティ トリガーを追加するWatch a short video: Configure Installed Features Add a property trigger.


ビヘイビアー は再利用可能なコードのパッケージです。A behavior is a reusable package of code. ビヘイビアーは、プロパティの変更より少し多くのことができます。It can do a bit more than change properties. データ サービスのクエリなどのアクションを実行できます。It can perform actions such as query a data service. Blend には小さなアクションのコレクションが付属していますが、さらに追加することができます。Blend comes with a small collection of them, but you can add more. ビヘイビアーをアートボード内のオブジェクトにドラッグしてから、プロパティを設定してビヘイビアーをカスタマイズします。Drag a behavior onto any object in your artboard, and then customize the behavior by setting properties.

[プロパティ] パネルの FluidMoveBehaviorFluidMoveBehavior in the Properties panel

短いビデオを見る: インストール済みフィーチャーの構成 Blend のヒント: ビヘイビアーの使用の概要パート 1Watch a short video: Configure Installed Features Blend tips: Intro to using behaviors Part 1.


柔軟性を最大にするため、 イベントを処理します。For ultimate flexibility, handle an event. いくつかのコードを記述する必要があります。You'll have to write some code.

短いビデオを見る: インストール済みフィーチャーの構成 マウス イベントを追加するWatch a short video: Configure Installed Features Add a Mouse event.