ユーザー入力またはその他の内部値へのオブジェクトのバインド
1 つのプロパティの値を別のプロパティの値にバインドすることによって、両者を同期させ、一方のプロパティを変更するともう一方も更新されるようにします。 これは、ユーザーの入力によってコントロールの表示方法が決まるようにする場合に便利です。 たとえば、メディア プレーヤーでは、音量スライダーをユーザーが動かすと、対応するテキスト ボックス内の値が変わるようにします。
スライダーの値をテキスト ボックスにバインドするには
[ツール] パネルでボタン ツール グループを右クリックし、表示された一覧から [Slider] コントロールを選択します。
メイン ドキュメントのアートボードに [Slider] コントロールを描きます。
新しい [Slider] オブジェクトを選択し、[プロパティ] パネルの [共通プロパティ] にあるプロパティを次のように設定します。
[LargeChange] を 10 に設定します。 これは、スライダー バーを 1 回クリックするたびに、値が 10 だけ変わるという意味です。
[Maximum] を 2001 に設定します。 スライダーは 0 から 2001 に移動します。
[SmallChange] を 1 に設定します。 これは、矢印キーを 1 回押すたびにスライダーの値が 1 だけ変わるという意味です。
[ツール] パネルで下から 2 番目にあるツール グループを右クリックし、表示された一覧から TextBox コントロール を選択します。
アートボードの [Slider] オブジェクトの横に、[TextBox] コントロールを描きます。
新しい [TextBox] オブジェクトが選択された状態で、[プロパティ] パネルの [共通プロパティ] にある Text プロパティを見つけます。 この Text プロパティを Slider コントロールの値にバインドします。
[詳細オプション] をクリックし、表示された一覧の [データ バインディング] をクリックします。
[データ バインディングの作成] ダイアログ ボックスの [要素プロパティ] タブをクリックします。 ここが、内部の値をプロパティにバインドする場所になります。
[シーン要素] の下の要素ツリーを展開して、[Slider] オブジェクトを選択します。
[プロパティ] の下にある Value : (Double) を選択します。
テキスト ボックスのコンテンツがスライダーの値にバインドされます。
ヒント
[Value] プロパティが表示されない場合は、[表示] ドロップダウン リストで [すべてのプロパティ] を選択します。[表示] ドロップダウン リストでは、既定で [一致する型のみ] が選択されています。[一致する型のみ] が選択されている状態で一覧に目的のプロパティが表示されない場合は、値コンバーターを使用して値を変換しなければならないことがあります。
詳細については、「試してみよう: データのタイプ変更」を参照してください。
[プロパティの表示] をクリックし、[バインドの方向] の横にある [TwoWay] を選択します。
この設定によって、テキスト ボックスが変更されるとスライダーも更新され、スライダーが変更されるとテキスト ボックスも更新されるようになります。
F5 キーを押してアプリケーションを実行します。
[Thumb] をドラッグし、テキスト ボックスの値が更新されるかどうか確認します。
ヒント
上の図のように、テキスト ボックスに小数桁の多い数値が表示されます。テキスト ボックスに値が渡される前に、値コンバーターを作成して、データ型を整数に変換しておくと、このような数値は表示されません。