データへのオブジェクトのバインド
データは、データのアイテムをアートボードのオブジェクトにバインドすることにより表示します。
データのバインドは、次の 2 つの部分で構成されています。
データ コンテキスト データの取得元のデータ ソースを識別する手段です。データ コンテキストは継承できるので、親オブジェクトにデータ コンテキストを割り当てて、すべての子オブジェクトが同じデータにアクセスできるようにします。これは、同じデータ ソースにあるデータに複数のオブジェクトをバインドする場合や、マスターと詳細が結び付いたデザインを作成する場合に便利です。
詳細については、「マスター詳細データ バインドの作成」を参照してください。
プロパティのバインド プロパティをバインドする特定のアイテムを識別する方法です。たとえば、TextBlock オブジェクトの Text プロパティをデータ ソースの文字列アイテムにバインドしたり、ListBox オブジェクトの ItemsSource プロパティをデータ ソースにあるコレクションにバインドしたりします。プロパティのバインドは、必ずしもデータ コンテキストと同じオブジェクトに設定する必要はありません。ツリーの上位にあるオブジェクトにデータ コンテキストが設定されている限り、プロパティのバインドも機能します。
データ バインドを作成するには、[データ] パネルからアイテムをドラッグするか、[プロパティ] パネルで、データ コンテキストとプロパティのバインドを手動で設定します。
[データ] パネルからアイテムをドラッグしてデータをバインドするには
[データ] パネルで、次のいずれかの操作を行います。
[リスト モード]
.png "Cc294574.9ad55afc-08ac-4f9a-ab3a-d55d0cf184d3(JA-JP,Expression.30).png")
をクリックして、アイテム コントロール (ListBox、DataGrid、TreeView、ComboBox など) のデータを表示します。[リスト モード] は、コレクションにあるデータの一覧を作成するときに使用します。[詳細モード]
.png "Cc294574.7786ee28-da1d-41b2-93fd-b4caeb75ab98(JA-JP,Expression.30).png")
をクリックして、コレクション内の 1 つのレコード、またはデータの 1 つのアイテムを表示します。
[データ] パネル で、データのアイテムを 1 つまたは複数選択して、アートボードにドラッグします。アートボードの空白の部分と、既存のオブジェクトのどちらにでもドラッグできます。
ドラッグしているデータの種類によって、Microsoft Expression Blend で行われる処理が異なります。次の表に、Expression Blend がデータをどのように取り扱うかをモード別に示します。
アクション
リスト モード
詳細モード
コレクション、またはコレクション内のアイテムをアートボードの空白の部分にドラッグします。
1 行に 1 レコードずつデータを表示する ListBox オブジェクトが作成されます。ListBox の ItemsSource プロパティが、コレクションの名前になります。親のレイアウト パネルに、DataContext プロパティが設定されます。
例については、「マスター詳細データ バインドの作成」を参照してください。
データコレクションにある 1 つのレコードの選択されたすべてのアイテムを表示するオブジェクトが作成されます。
リスト モードで同じコレクションからアイテムをドラッグした後で、詳細モードでこの操作を行うと、マスターと詳細データの関係が自動的に設定されます。
詳細については、「マスター詳細データ バインドの作成」を参照してください。
リスト モードでバインドを作成していない場合は、コレクションにある最初のレコードのデータだけが表示されます。
階層構造のコレクション、または階層構造のコレクション内のアイテムをアートボードの空白の部分にドラッグします。
1 行に 1 レコードずつデータを表示する TreeView オブジェクトが作成されます。TreeView の ItemsSource プロパティが、コレクションの名前になります。親のレイアウト パネルに、DataContext プロパティが設定されます。
例については、「TreeView コントロールを使用する」を参照してください。
データコレクションにある 1 つのレコードの選択されたすべてのアイテムを表示するオブジェクトが作成されます。
リスト モードで同じコレクションからアイテムをドラッグした後で、詳細モードでこの操作を行うと、マスターと詳細データの関係が自動的に設定されます。
詳細については、「マスター詳細データ バインドの作成」を参照してください。
リスト モードでバインドを作成していない場合は、コレクションにある最初のレコードのデータだけが表示されます。
コレクションまたはコレクション内のアイテムを既存のアイテム コントロール (ListBox、DataGrid、TreeView、ComboBox など) にドラッグします。
アイテム コントロールの 1 行に 1 レコードずつデータが表示されます。アイテム コントロール の ItemsSource プロパティが、コレクションの名前になります。親のレイアウト パネルに、DataContext プロパティが設定されます。
例については、「DataGrid コントロールの使用」を参照してください。
データコレクションにある 1 つのレコードの選択されたすべてのアイテムを表示するオブジェクトが作成されます。
リスト モードで同じコレクションからアイテムをドラッグした後で、詳細モードでこの操作を行うと、マスターと詳細データの関係が自動的に設定されます。
詳細については、「マスター詳細データ バインドの作成」を参照してください。
リスト モードでバインドを作成していない場合は、コレクションにある最初のレコードのデータだけが表示されます。
コレクションに含まれていないデータのアイテムを 1 つだけアートボードの空白の部分にドラッグします。
そのデータを表示するオブジェクトが作成されます。たとえば、文字列または数値のデータの場合は、TextBlock が作成されます。ブール型の値の場合は、CheckBox が作成されます。パスかイメージ ファイルの場合は、イメージが Image オブジェクトに表示されます。
リスト モードと同じ。
コレクションに含まれていないデータのアイテムを 1 つだけ既存のオブジェクトにドラッグします。
Expression Blend によって、オブジェクトのどのプロパティにデータをバインドすればよいかが決められます。たとえば、文字列や数値のデータの場合は、Content プロパティか Text プロパティにバインドされます。ブール型の値の場合は、IsEnabled や IsChecked などのブール型のプロパティにバインドされます。パスかイメージ ファイルの場合は、Source プロパティにバインドされます。
バインド先の適切なプロパティが見つからない場合は、[データ バインドの作成] ダイアログ ボックスが表示されます。
[データ バインドの作成] ダイアログ ボックスの [<オブジェクト名> のプロパティ] ドロップダウン リストで、データのバインド先のプロパティを選択します。たとえば、データが色を表す 16 進数値の文字列の場合に、ドキュメントの背景色を変更するには、ドキュメントのルート オブジェクトに、Shift キーを押しながらデータ アイテムをドラッグし、[データ バインドの作成] ダイアログ ボックスで [Background] プロパティを選択します。
バインドするデータの型がプロパティの型と合わない場合は、データが変換されます。変換できないと、データが表示されません。この場合は、値コンバーターを自分で作成して、そのコンバーターを [データ バインドの作成] ダイアログ ボックスで選択する必要があります。
詳細については、「試してみよう: データのタイプ変更」を参照してください。
リスト モードと同じ。
[プロパティ] パネルを使用してデータをバインドするには
[オブジェクトとタイムライン] パネルで、データをバインドするオブジェクト、データを表示させるオブジェクト、またはツリーの上位にあるオブジェクト (レイアウト パネルなど) を選択します。
ここが、データ コンテキストを設定する場所になります。
[プロパティ] パネルで [DataContext] プロパティの横にある[詳細プロパティ オプション]
.png "Cc294574.12e06962-5d8a-480d-a837-e06b84c545bb(JA-JP,Expression.30).png")
をクリックし、[データ バインド] をクリックします。[データ バインドの作成] ダイアログ ボックスの [データ フィールド] タブをクリックします。
[データ ソース] で、データのバインド元のデータ ソースを選択します。
[OK] をクリックして、[データ バインドの作成]ダイアログ ボックスを閉じます。
これで、このオブジェクトや子オブジェクトのプロパティに、選択したデータ ソースのデータ アイテムをバインドできるようになります。
データを表示させるオブジェクト、またはデータをバインドするオブジェクトを選択します。
[プロパティ] パネルで、データをバインドするプロパティを見つけます。プロパティの型が、バインドするデータ アイテムの型と合っていることを確認します。たとえば、コレクションにあるデータ アイテムをバインドする場合は、[ItemsSource] プロパティ ([ListBox]、[DataGrid]、[TreeView]、[ComboBox] などのオブジェクトの下にあります) を選択します。文字列や数値のデータ アイテムをバインドする場合は、文字列型のプロパティを選択します。
選択したプロパティの横にある[詳細プロパティ オプション]
をクリックして、[データ バインド] をクリックします。[データ バインドの作成] ダイアログ ボックスの [明示的なデータ コンテキスト] タブをクリックします。
[フィールド] で、プロパティにバインドするデータ アイテムを選択します。
.gif "ヒント")
ヒント :型が一致したデータ アイテムだけが表示されます。すべてのアイテムを表示するには、[表示] ドロップダウン リストで [すべてのプロパティ] を選択します。
必要に応じて、[データ バインドの作成] ダイアログ ボックスで別の設定を行います。たとえば、バインドするデータの型が、プロパティのデータ型と同じでない場合は、値コンバーターを選択する必要があります。Expression Blend でデータの変換が行われますが、変換できなかった場合は、データが表示されません。この場合は、値コンバーターを自分で作成して、そのコンバーターを [データ バインドの作成] ダイアログ ボックスで選択する必要があります。
詳細については、「試してみよう: データのタイプ変更」を参照してください。
[OK] をクリックして、[データ バインドの作成]ダイアログ ボックスを閉じます。
サンプル データを使用している場合は、そのデータがアートボードに表示されます。ライブ データを使用している場合は、F5 キーを押してデータを表示します。
ヒント :同じデータを複数のオブジェクトにバインドできます。また、マスターと詳細が結びついたデザイン、つまり一覧のアイテムを選択すると、そのアイテムの詳細が別のオブジェクト表示されるデザインを作成することもできます。
詳細については、「マスター詳細データ バインドの作成」を参照してください。