0

对于不同的用户界面，我想根据 ViewModel 对象的状态显示图像。

例如：

我有一个数据库连接，如果连接，我想显示一个绿色的数据库图像，如果没有连接我想显示一个红色的数据库图像。

在 ViewModel 中有一个bool表示状态的。

可能性是：

  • 视图中有两个图像（红色图像有一个转换器 InverseBooleanToVisibilityConverter），它们位于同一位置，实际上只显示其中一个。

  • 绑定Image source（但我不想在我的 ViewModel 中设置它）

  • 某种选择器？

这种取决于状态的图像可能更经常使用，例如在TreeViewas 中ItemImage。

有没有更聪明的方法来做到这一点？

4

3 回答 3

2

您也可以仅使用数据触发器来完成此操作。这是我的一个项目中的一个示例，该按钮根据表单是否处于编辑模式来更改其图像：

<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 在资源部分的某处声明。

于 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 回答