DataBinding GridView C# windows store app

Question

我有一个如下定义的 DataTemplate

<DataTemplate x:Key="IconTextDataTemplate">
        <StackPanel Orientation="Horizontal" Width="220" Height="60">
            <Border Background="#66727272" Width="40" Height="40" Margin="10">
                <Image Source="/SampleImage.png" Height="32" Width="32" Stretch="UniformToFill"/>
            </Border>
            <StackPanel Orientation="Vertical" VerticalAlignment="Center">
                <TextBlock Text="{Binding Path=Title}" Margin="10,0,0,0" Width="170" Height="20" TextTrimming="WordEllipsis" />
                <TextBlock  Text="{Binding Path=NumberOfPhotos}" Margin="10,0,0,0" Width="170" Height="20" TextTrimming="WordEllipsis"/>
            </StackPanel>
        </StackPanel>
    </DataTemplate>

然后我有一个使用 DataTemplate 的 GridView

<GridView x:Name="gv" Grid.Row="0" HorizontalAlignment="Left" Margin="0" VerticalAlignment="Top" 
                  Width="Auto" Height="Auto" SelectionMode="Multiple" ItemTemplate="{StaticResource IconTextDataTemplate}" ItemsSource="{Binding}">
            <GridView.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapGrid MaximumRowsOrColumns="8" 
                  VerticalChildrenAlignment="Top" HorizontalChildrenAlignment="Center" />
                </ItemsPanelTemplate>
            </GridView.ItemsPanel>
        </GridView>

然后我将 GridViews dataContext 设置为一个集合

gv.DataContext = setCollection;

对象 setCollection 是对象的集合，具有 NumberOfPhotos 和 Title 属性所以绑定

<TextBlock Text="{Binding Path=Title}" Margin="10,0,0,0" Width="170" Height="20" TextTrimming="WordEllipsis" />
                <TextBlock  Text="{Binding Path=NumberOfPhotos}" Margin="10,0,0,0" Width="170" Height="20" TextTrimming="WordEllipsis"/>

有效。但是，该对象没有 ImageSource 的属性

<Image Source="/SampleImage.png" Height="32" Width="32" Stretch="UniformToFill"/>

我不想绑定到对象的属性，而是绑定到由两个字符串和对象的属性组成的复合结构，如下所示：

ImageSource = "/files/thumbnails/" + {Binding Path=Title} + fileType;

所以当评估时，ImageSource 变为

/files/thumbnails/titleOfObject.png

titleOfObject 在这里等于该值

<TextBlock Text="{Binding Path=Title}" Margin="10,0,0,0" Width="170" Height="20" TextTrimming="WordEllipsis" />  

我怎样才能做到这一点？

Answer 1

您最好将绑定的对象视为 ViewModel。从概念上讲，这意味着 ViewModel 对象的工作是准备数据以供查看。这包括诸如按摩要绑定到 Source 属性的标题之类的事情。因此，在您的对象（或派生对象，或对象的正式 ViewModel）上，创建一个为您执行该计算的属性。

public string TitleImageSource
{
    get
    {
        return string.Format(@"/files/thumbnails/{0}{1}", this.Title, fileType);
    }
}

然后绑定到你的图片中的那个属性。

另一种方法是为绑定创建一个转换器。转换器可能类似于：

public sealed class ImageConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {
        return string.Format(@"/files/thumbnails/{0}{1}", value, parameter);
    }

    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        return string.Empty;
    }
}

然后在 Image 标签的 Source 绑定上引用该转换器。