根据条件显示 XAML

Question

上下文是我有一个列表框，它输出具有相当多样式的项目（比我在这里放置的更多）...我去使用 DataTemplateSelector 根据条件显示一个图像或另一个图像，但它是愚蠢的是必须重写整个模板，只有这一点差异。

我放置了一些伪代码来演示我想要实现的目标：

<ListBox Grid.Row="1"
            ItemsSource="{Binding TestCases}"
            BorderThickness="0"
            HorizontalAlignment="Stretch"
            HorizontalContentAlignment="Stretch">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <Grid HorizontalAlignment="Stretch">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"></ColumnDefinition>
                    <ColumnDefinition Width="auto"></ColumnDefinition>
                    <ColumnDefinition Width="10"></ColumnDefinition>
                </Grid.ColumnDefinitions>

                <TextBlock Grid.Column="0"
                            Padding="0,5,0,5">
                    <Run Text="{Binding Class}"></Run>
                </TextBlock>

                <TextBlock Grid.Column="1"
                            Padding="5">
                    <Run Text="{Binding Assertions}"></Run>
                </TextBlock>

if {Binding Failures} > 0 {

    <Image HorizontalAlignment="Center"
            Width="10"
            Height="10"
            Grid.Column="2"
            Source="/Content/Images/Cross.png">
    </Image>

}
else
{

    <Image HorizontalAlignment="Center"
            Width="10"
            Height="10"
            Grid.Column="2"
            Source="/Content/Images/Tick.png">
    </Image>

}

            </Grid>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

关于我如何做到这一点有什么想法吗？

-------------编辑------------

到目前为止，我已将转换器类的命名空间添加到 XAML 文件中：

xmlns:converters="clr-namespace:Blah.Blah.Converters"

然后添加窗口资源：

<Window.Resources>
    <converters:FailuresTickConverter x:Key="failuresTickConverter" />
    <converters:FailuresCrossConverter x:Key="failuresCrossConverter" />
</Window.Resources>

然后我自己上课：

namespace Blah.Blah.Converters
{
    public class FailuresTickConverter : IValueConverter
    {
        public object Convert( object value, Type targetType,
            object parameter, CultureInfo culture )
        {
            int failures = (int)value;

            if( failures > 0 )
                return Visibility.Hidden;
            return Visibility.Visible;
        }

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

    public class FailuresCrossConverter : IValueConverter
    {
        public object Convert( object value, Type targetType,
            object parameter, CultureInfo culture )
        {
            int failures = ( int )value;

            if( failures > 0 )
                return Visibility.Visible;
            return Visibility.Hidden;
        }

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

然后在我的 XAML 图像中我已经这样做了：

<Image Visibility="{Binding Failures, Converter=failuresTickConverter}"
        HorizontalAlignment="Center"
        Width="10"
        Height="10"
        Grid.Column="2"
        Grid.Row="0"
        Source="/Content/Images/Tick.png">
</Image>

<Image Visibility="{Binding Failures, Converter=failuresCrossConverter}"
        HorizontalAlignment="Center"
        Width="10"
        Height="10"
        Grid.Column="2"
        Grid.Row="0"
        Source="/Content/Images/Cross.png">
</Image>

我在绑定上遇到错误：

IValueConverter 不支持字符串转换

Answer 1

详细阐述我的评论，这是一种简单的（当然不是唯一的）方法：

创建一个转换器将数字转换为可见性：

public class PositiveToVisibilityConverter: IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        return (int)value > 0 ? Visibility.Visible : Visibility.Collapsed;
    }

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

将转换器的命名空间添加到您的xaml中，将转换器添加到资源中（当然使用您自己的命名空间）：

<Window ...
        xmlns:converters="clr-namespace:WpfApplication1.Converters"
        ...>
    <Window.Resources>
        <converters:PositiveToVisibilityConverter x:Key="PositiveConverter"/>
    </Window.Resources>

然后将两个图像放入其中，先放入“成功”图像，然后使用转换器将属性绑定到“失败”图像：

<Image HorizontalAlignment="Center"
        Width="10"
        Height="10"
        Grid.Column="2"
        Source="/Content/Images/Tick.png"
        Visibility="{Binding Failures, Converter={StaticResource PositiveConverter}}">
</Image>
<Image HorizontalAlignment="Center"
        Width="10"
        Height="10"
        Grid.Column="2"
        Source="/Content/Images/Cross.png">
</Image>

由于这些图像位于网格中（我假设）并且具有相同的位置和大小，因此它们将重叠，通常最后定义的图像将最后绘制，因此第一个图像将不可见。也就是说，除非绑定使第二个图像不可见。

Answer 2

实现 MVVM 模式的另一种简单方法是在视图模型中简单地具有可见性属性。

XAML：

<Image Visibilty="{Binding SomeVisibilty}"></Image>

查看模型：

public Visibility SomeVisibilty{ get { return someCondition ? Visibility.Visible : Visibility.Collapsed; }}