ホーム > Expression Blend > Expression Blend Tips

ConverterにPropertyはやしてみた

Expression Blend Tips
蜜葉 優@Silverlight Square[著], わにちゃん@ExpressionTech.jp[編集]
2013年12月4日 from Atelier:Mitsuba

はじめに

Parameterだけじゃ限界があったので、ConverterにPropertyはやしてみた。

例えばToggleButtonがOnの時、TextBlockの文字の色を緑に、Offの時は白に、なんていうシチュエーション。
f:id:c-mitsuba:20131204023037p:plain

実装方法

普通にコンバータを書けばこんなかんじになりますね。

#region

using System;
using System.Globalization;
using System.Windows.Data;
using System.Windows.Media;

#endregion

namespace PhoneApp1
{
    public class BoolToColorConverter : IValueConverter
    {

        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return (bool?)value == true ? new SolidColorBrush(Colors.Green) : new SolidColorBrush(Colors.White);
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }
}

このコンバータをちょっとprop tab tabして、Trueの時とFalseの時の色をプロパティで設定できるようにしてみました。

#region

using System;
using System.Globalization;
using System.Windows.Data;
using System.Windows.Media;

#endregion

namespace PhoneApp1
{
    public class BoolToColorConverter2 : IValueConverter
    {
        public Color TrueColor { get; set; }
        public Color FalseColor { get; set; }

        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return (bool?)value == true ? new SolidColorBrush(TrueColor) : new SolidColorBrush(FalseColor);
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }
}

PhoneのBlendの場合、型に合わせて候補も出してくれます。
さすが電話!!!インテリセンス素敵ですね。
f:id:c-mitsuba:20131204023527p:plain
f:id:c-mitsuba:20131204023534p:plain

もちろん1ページに挙動の同じコンバータで挙動のちがうものを用意することも可能です。
f:id:c-mitsuba:20131204024113p:plain

まとめ

Store AppsとかだとBehaviorが貧弱すぎて、Converterは必須になってきてる。
Converterはオブジェクトパネルに見えないので、手書きでプロパティ設定してあげないといけない
こんなかんじにプロパティで設定してやれば、ベタにかくより使い回しが効いていいんじゃないかなー。
作ったConverterはまとめて、自分のライブラリにしてしまえばいいと思います。


『Expression Blend Tips』最新記事

コメント

▲このページのトップへ