基于数据模板中的bool值设置图像模板

时间:2014-12-30 22:29:49

标签: c# wpf xaml .net-4.0 datatemplate

这是我要在页面中显示的Customer类及其集合。

public class Customer
{
    public string Name { get; set; }
    public bool Validated { get; set; }
    public string Details { get; set; }
}

List<Customer> Customers = new List<Customer>()
            {
                new Customer() { Validated = false, Name = "Dude", Details = "some details" },
                new Customer() { Validated = false, Name = "Person", Details = "some details" },
                new Customer() { Validated = true, Name = "Friend", Details = "some details" },
                new Customer() { Validated = false, Name = "Buddy", Details = "some details" },
            };

我正在尝试在列表控件中为此数据创建数据模板。对于图像,我想基于验证字段显示不同的图像。以下是我到目前为止所做的工作,但我不知道如何为图像设置模板。

<Page x:Class="MyTestPage"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
      mc:Ignorable="d" 
     d:DesignHeight="250" d:DesignWidth="500"
    Title="MyTestPage" >

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="5*" />
            <RowDefinition  />
        </Grid.RowDefinitions>

        <ListBox x:Name="lst1"  Grid.Row="0">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                            <StackPanel Orientation="Vertical">
                                <StackPanel Orientation="Horizontal">
                                    <Label FontFamily="Tahoma" FontSize="20" Content="Name" />
                                    <Label FontFamily="Tahoma" FontSize="18" Content="{Binding Name}" />
                                </StackPanel>
                                <StackPanel Orientation="Horizontal">
                                    <Label FontFamily="Tahoma" FontSize="14" Content="Details" />
                                    <Label FontFamily="Tahoma" FontSize="12" Content="{Binding Details}" />
                                </StackPanel>
                            </StackPanel>
                        <Image Source="{Binding Image}"  Height="100" Stretch="UniformToFill" />

                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>


        <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" Margin="5" Grid.Row="1" >
            <Button Content="Close" Margin="5" Width="60" Click="Close_Click" />
        </StackPanel>

    </Grid>
</Page>

有关如何在此数据模板中设置图像模板的任何想法?

1 个答案:

答案 0 :(得分:1)

创建一个实现IValueConverter接口的自定义转换器,它根据绑定值返回所需的BitmapImage,您可能只需要为Convert方法创建逻辑,这样就可以了按原样保留ConvertBack方法

将您的转换器添加到类似的资源

<Page.Resources> <myConverters:MyValueConverter x:Key="MyCustomValueConverter"/> <!-- dont forget to add the xmlns to the page --> </page.Resources>

并将其添加到图片的绑定

你的xaml图像看起来像这样:

<Image Source="{Binding Validated, Converter={StaticResource MyCustomValueConverter}" Height="100" Stretch="UniformToFill"/>