試してみよう: データのタイプ変更

値コンバーターは、データ型を変換するのに便利です。Microsoft Expression Blend でオブジェクトのプロパティの値を、データや別のプロパティの値にバインドする場合は、その値の型が同じでなければなりません。たとえば、テキスト ボックスの "123" などの文字列をスライダー バーの対応する整数値に変換したり、[Visibility.Hidden] などのプロパティの値を false などのブール値に変換しなければならない場合があります。

値コンバーターは、Microsoft .NET Framework クラスのコードに IValueConverter インターフェイスを実装します。Convert メソッドと ConvertBack メソッドの両方が実装されます。これは、データ バインド エンジンが、バインド元とバインド先の間で値を移動するときにこれらのメソッドを呼び出すからです。詳細については、MSDN の「IValueConverter インターフェイス」を参照してください。

値コンバーターを使用するには、データをプロパティにバインドするときに、[データ バインドの作成] ダイアログ ボックスの [値コンバーター] に入力します。

値コンバーター クラスを作成するには

ここでは、C# の分離コード ファイルを使用するプロジェクトだけに追加できる .NET クラスを C# で記述する手順を説明します。ただし、プロジェクトにコードを追加する方法が他にもあります。Microsoft Visual Studio でクラスを .dll にコンパイルしてから、その .dll ファイルの参照をプロジェクトに追加します。

詳細については、「参照の追加と削除」を参照してください。

1. [プロジェクト] パネルで目的のプロジェクトを右クリックして、[新しいアイテムの追加] をクリックします。

2. [新しいアイテム] ダイアログ ボックスで [Class] をクリックし、[名前] フィールドに「DoubleValueConverter.cs」と入力して [OK] をクリックします。

   ソリューションで使用している言語の新しいコード ファイルが作成されます。この手順では、C# です。コード ファイルがプロジェクトに追加され、アートボードで開きます。

3. DoubleValueConverter.cs ファイルにある次のクラスの宣言を削除します。

   public class DoubleValueConverter
   {
       public DoubleValueConverter()
       {
           // Insert code required on object creation below this point.
       }
   }
   

4. 下に示すコードを追加します。このコードには、次のようなコンバーターのクラスが 2 つ含まれています。

   • DoubleToIntegerValueConverter   倍精度 (Double) 値と整数 (Integer) 値を双方向に変換するクラス。

   • DoubleToRomanNumeralValueConverter   倍精度 (Double) 値から ローマ数字の文字列 (String) への一方向だけの変換を行うクラス。

       /// <summary>
       /// DoubleToIntegerValueConverter provides a two-way conversion between
       /// a double value and an integer.
       /// </summary>
       public class DoubleToIntegerValueConverter : IValueConverter
       {
           public object Convert(object value, Type targetType, object parameter,
                 System.Globalization.CultureInfo culture)
           {
               return System.Convert.ToInt32(value);
           }
   
           public object ConvertBack(object value, Type targetType,
               object parameter, System.Globalization.CultureInfo culture)
           {
               return System.Convert.ToDouble(value);
           }
   
       }
   
       /// <summary>
       /// DoubleToRomanNumeralValueConverter provides a one-way conversion from
       /// a double value to a string representation of a Roman numeral.
       /// </summary>
       public class DoubleToRomanNumeralValueConverter : IValueConverter
       {
           public object Convert(object value, Type targetType, object parameter,
               System.Globalization.CultureInfo culture)
           {
               return this.ConvertToRomanNumeral(System.Convert.ToInt32(value));
           }
   
           public object ConvertBack(object value, Type targetType,
               object parameter, System.Globalization.CultureInfo culture)
           {
               return null;
           }
   
           private List<IntegerStringPair> romanStrings = null;
   
           private string ConvertToRomanNumeral(int input)
           {
               StringBuilder myBuilder = new StringBuilder();
   
               foreach (IntegerStringPair thisPair in this.PairSet)
               {
                   while (input >= thisPair.Value)
                   {
                       myBuilder.Append(thisPair.StringValue);
                       input -= thisPair.Value;
                   }
               }
   
               return myBuilder.ToString();
           }
   
           private List<IntegerStringPair> PairSet
           {
               get
               {
                   if (this.romanStrings == null)
                   {
                       this.romanStrings = new List<IntegerStringPair>();
                       this.romanStrings.Add(new IntegerStringPair(1000, "M"));
                       this.romanStrings.Add(new IntegerStringPair(900, "CM"));
                       this.romanStrings.Add(new IntegerStringPair(500, "D"));
                       this.romanStrings.Add(new IntegerStringPair(400, "CD"));
                       this.romanStrings.Add(new IntegerStringPair(100, "C"));
                       this.romanStrings.Add(new IntegerStringPair(90, "XC"));
                       this.romanStrings.Add(new IntegerStringPair(50, "L"));
                       this.romanStrings.Add(new IntegerStringPair(40, "XL"));
                       this.romanStrings.Add(new IntegerStringPair(10, "X"));
                       this.romanStrings.Add(new IntegerStringPair(9, "IX"));
                       this.romanStrings.Add(new IntegerStringPair(5, "V"));
                       this.romanStrings.Add(new IntegerStringPair(4, "IV"));
                       this.romanStrings.Add(new IntegerStringPair(1, "I"));
                   }
   
                   return this.romanStrings;
               }
           }
       }
   
       /// <summary>
       /// IntegerStringPair provides an easy way to store integer and string pairs.
       /// </summary>
       public class IntegerStringPair
       {
           private int value;
           private string stringValue;
           public int Value
           {
               get
               {
                   return this.value;
               }
           }
           public string StringValue
           {
               get
               {
                   return this.stringValue;
               }
           }
           public IntegerStringPair(int value, string stringValue)
           {
               this.value = value;
               this.stringValue = stringValue;
           }
       }
   

5. Ctrl + Shift + B キーを押してソリューションをビルドし、エラーが発生するかどうかを確認します。

   ヒント :
   ソリューションをビルドするとコード ファイルがコンパイルされて、Expression Blend で、これらのクラスを使えるようになります。たとえば、[データ バインドの作成] ダイアログ ボックスで使用できます。コード ファイルに新しいクラスを追加するたびに、Expression Blend でそのクラスを使用できるようにソリューションをリビルドする必要があります。

値コンバーターをプロパティに適用するには

ここでは、[Slider] オブジェクトの 2 つ値を [TextBox] オブジェクトに値をバインドするときに、上の手順で作成した値コンバーターを使用して値を変換する手順を示します。その結果、[Slider] オブジェクトの値が、テキスト ボックスに整数とローマ数字で表示されます。

1. [ツール] パネルでボタン ツール グループを右クリックし、表示された一覧から [Slider] コントロールを選択します。

2. アートボードにマウスで Slider オブジェクトを描きます。

3. 新しい Slider オブジェクトを選択し、[プロパティ] パネルの [共通プロパティ] にあるプロパティを次のように設定します。

   • [LargeChange] を 10 に設定します。これは、スライダ バーを 1 回クリックするたびに、値が 10 だけ変わるという意味です。

   • [Maximum] を 2001 に設定します。これで、スライダ バーの値の範囲が 0 ～ 2001 になります。

   • [SmallChange] を 1 に設定します。これは、矢印キーを 1 回押すたびにスライダーの値が 1 だけ変わるという意味です。

4. [ツール] パネルでボタン ツールのグループを右クリックし、表示された一覧から [TextBox] コントロールを選択します。

5. アートボードの Slider オブジェクトの左右に、TextBox を1 つずつ描きます。

6. 1 つ目の TextBox オブジェクトを選択し、[プロパティ] パネルの [共通プロパティ] にある [Text] プロパティを見つけます。この [Text] プロパティを Slider コントロールの値にバインドします。

7. [詳細プロパティ オプション] をクリックし、表示された一覧の [データ バインド] をクリックします。

8. [データ バインドの作成] ダイアログ ボックスの [要素プロパティ] タブをクリックします。ここが、内部の値をプロパティにバインドする場所になります。

9. [シーン要素] の下の要素ツリーを展開して、[Slider] オブジェクトを選択します。

10. [プロパティ] の下にある [Value : (Double) ] を選択します。

    テキスト ボックスのコンテンツがスライダーの値にバインドされます。

11. [値コンバーター] の横にある [詳細プロパティの表示] をクリックして、[新しい値コンバーターの追加] をクリックします。

12. [値コンバーターの追加] ダイアログ ボックスで、[DoubleToIntegerValueConverter] を選択して [OK] をクリックします。

    ヒント :
    値コンバーターが表示されない場合は、前の手順で作成したソース ファイル (DoubleValueConverter.cs) をプロジェクトに追加したことと、Ctrl + Shift + B キーを押してプロジェクトをビルドしたことを確認してください。

13. [データ バインドの作成] ダイアログ ボックスで、[OK] をクリックします。

    1 つ目の TextBox オブジェクトに、スライダーの値が整数で表示されます。

    メモ :
    Slider オブジェクトには、slider という名前が付いていることに注意してください。アプリケーションのオブジェクトには、別の場所から参照 (データをバインドするときなど) できるように名前が付いている必要があるので、Expression Blend によって自動的に名前が設定されます。

14. 2 つ目の TextBox オブジェクトで手順 6 ～ 13 を繰り返します。ただし、[値コンバーターの追加] ダイアログ ボックスで、[DoubleToRomanNumeralValueConverter] を選択してください。

15. F5 キーを押して、プロジェクトを実行します。スライダーを動かして、2 つのテキスト ボックスの値が変わることを確認します。

    

    値コンバーターで値を変換していないと、これらのテキスト ボックスには、小数桁の多い数値が表示されるはずです。

    

関連項目

タスク

ユーザー入力またはその他の内部値へのオブジェクトのバインド

概念

データを表示するコントロールのスタイルを設定する

データの表示