0

さまざまなユーザー インターフェイスについて、ViewModel オブジェクトの状態に応じて画像を表示したいと考えています。

例えば：

データベース接続があります。接続されている場合は緑のデータベース イメージを表示し、接続されていない場合は赤のデータベース イメージを表示します。

ViewModel にはbool、状態を表す があります。

可能性は次のとおりです。

  • ビューに 2 つの画像があり (赤い画像のコンバーター InverseBooleanToVisibilityConverter を使用)、同じ場所にあり、実際にはそのうちの 1 つを表示しています。

  • バインディングImage source(ただし、ViewModel でこれを設定したくありません)

  • セレクターの一種？

TreeViewこの状態依存イメージは、 asなどでより頻繁に使用できますItemImage。

それを達成するためのより賢い方法はありますか？

4

3 に答える 3

2

データ トリガーのみを使用して実行することもできます。フォームが編集モードかどうかに応じて画像を変更するボタンの私のプロジェクトの 1 つのサンプルを次に示します。

<Button x:Name="EditOrSaveJob"
                    Width="32"
                    Height="32"
                    Margin="10,0,0,0"
                    HorizontalAlignment="Stretch"
                    VerticalAlignment="Stretch">
                <Image>
                    <Image.Style>
                        <Style TargetType="Image">
                            <Setter Property="Source" Value="/AAAA;component/Resources/Images/edit.png" />
                            <Setter Property="ToolTip" Value="Edit Order" />
                            <Style.Triggers>
                                <DataTrigger Binding="{Binding IsEditing}" Value="True">
                                    <Setter Property="Source" Value="/AAAA;component/Resources/Images/32_save.png" />
                                    <Setter Property="ToolTip" Value="Save Order" />
                                </DataTrigger>
                            </Style.Triggers>
                        </Style>
                    </Image.Style>
                </Image>
</Button>
于 2013-05-14T20:34:33.720 に答える
1

解決策は、コンバーター (IValueConverter を実装するクラス) を使用することです。

class ImageStateConverter : IValueConverter
{
    public Object Convert(  Object value, Type targetType, Object parameter,    CultureInfo culture)    
    {
        bool state = (bool) value;
        return state ? "img1.png" : "img2.png";
    }
}

次に、XAML で次のようにバインディングを記述します。

<Image Source="{Binding Path=State, Converter={StaticResource myConverter}}" />

オブジェクト myConverter は Resources セクションのどこかで宣言されています。

于 2013-05-14T20:15:35.180 に答える
1

次のように値コンバーターを使用します。

public class BoolToImageConverter: DependencyObject, IValueConverter
{

    public BitmapImage TrueImage
    {
        get { return (BitmapImage)GetValue(TrueImageProperty); }
        set { SetValue(TrueImageProperty, value); }
    }
    public static DependencyProperty TrueImageProperty = DependencyProperty.Register("TrueImage", typeof(BitmapImage), typeof(BoolToImageConverter), null);


    public BitmapImage FalseImage
    {
        get { return (BitmapImage)GetValue(FalseImageProperty); }
        set { SetValue(FalseImageProperty, value); }
    }
    public static DependencyProperty FalseImageProperty = DependencyProperty.Register("FalseImage", typeof(BitmapImage), typeof(BoolToImageConverter), null);

    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        return (bool)value ? TrueImage : FalseImage;
    }

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        var img = (BitmapImage)value;
        return img.UriSource.AbsoluteUri == TrueImage.UriSource.AbsoluteUri;
    }

}

そしてXAMLで

<my:BoolToImageConverter x:Key="converterName" FalseImage="{StaticResource falseImage}" TrueImage="{StaticResource trueImage}"/>
于 2013-05-14T20:17:57.830 に答える