如何给不同的图像网格视图项目，而不必创建不同的模板

本文关键字：不必 创建 网格 图像 视图 项目 | 更新日期: 2023-09-27 17:54:37

我在一个按钮的点击上添加项目到网格视图，我希望不同的项目有不同的图像。有6个项目，我不想创建6个不同的模板。是否有任何方法，我可以做到这一点与单一的模板?下面是我的数据模板的代码片段:

<StackPanel>

                <!-- Shadow -->
                <Image Source="{Binding Time, Converter={StaticResource ThemeImageConverterClockShadow}}" Stretch="None" HorizontalAlignment="Left" VerticalAlignment="Top" Canvas.Left="10"
                    Canvas.Top="25"/>

                <!-- Face -->
                <Image Source="{Binding Time, Converter={StaticResource FaceBackground}}" Stretch="None" HorizontalAlignment="Left" VerticalAlignment="Top" Canvas.Left="10"
                    Canvas.Top="10" />
<StackPanel/>

我只想更改每个项目的阴影图像。我尝试绑定属性并根据no返回不同的图像。显示的网格视图项。但是，每当gridview中添加新项时，所有网格视图项的图像都会发生变化

更新:Gridview，如果有帮助的话

<GridView              

         x:Name="ThemeGridView"                    
                ItemsSource="{Binding Clocks}" 
                ItemTemplate="{StaticResource WorldClockTemplate}"
                SelectionChanged="Clock_SelectionChanged"              
                ScrollViewer.HorizontalScrollBarVisibility="Disabled"
                HorizontalAlignment="Center"
                VerticalAlignment="Center" ItemContainerStyle="{StaticResource GridViewItemStyle1}">
            <GridView.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapGrid />
                </ItemsPanelTemplate>
            </GridView.ItemsPanel>
        </GridView>

如何给不同的图像网格视图项目，而不必创建不同的模板

我想我知道你的代码是怎么回事了。我猜您正在使用转换器ThemeImageConverterClockShadow中的GridView项计数来选择适当的图像。每当一个新的项目被添加到GridView所有绑定将最有可能被重新评估，这解释了为什么你得到相同的图像为所有的行。您应该做的是在您的数据项上有一个属性，该属性指示要使用哪个阴影图像，并且当您向ItemsSource添加新项时应该设置该值。

另一种选择是:

<StackPanel>
    <!-- Shadow -->
    <Image Source="{Binding ShadowImage}" Stretch="None" HorizontalAlignment="Left" VerticalAlignment="Top" Canvas.Left="10"
                Canvas.Top="25"/>
    <!-- Face -->
    <Image Source="{Binding Time, Converter={StaticResource FaceBackground}}" Stretch="None" HorizontalAlignment="Left" VerticalAlignment="Top" Canvas.Left="10"
                Canvas.Top="10" />
<StackPanel/>

在ItemsSource中的数据项上有一个属性ImageSource ShadowImage:

public class MyDataItem 
{
    ....
    public ... Time { get { ... } set { ... } }
    public ImageSource ShadowImage { get { ... } set { ... } }
}

然后在代码中创建数据项并向GridView添加一行时设置图像。或者，您可以添加一些ShadowType属性，然后仍然使用转换器，但绑定到整个数据项，然后使用Time和ShadowType来选择图像:

<StackPanel>
    <!-- Shadow -->
    <Image Source="{Binding Converter={StaticResource ThemeImageConverterClockShadow}}" Stretch="None" HorizontalAlignment="Left" VerticalAlignment="Top" Canvas.Left="10"
                Canvas.Top="25"/>
    <!-- Face -->
    <Image Source="{Binding Time, Converter={StaticResource FaceBackground}}" Stretch="None" HorizontalAlignment="Left" VerticalAlignment="Top" Canvas.Left="10"
                Canvas.Top="10" />
<StackPanel/>

与转换器沿行:

public class ThemeImageConverterClockShadow : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        var dataItem = value as MyDataItem;
        if (dataItem != null)
        {
           // Use dataItem.Time and dataItem.ShadowType to select an image
        }
    }
}
相关文章：