如何根据源数据替换WPF网格中的图像与另一个控件？ [英] How can I replace an image in a WPF grid with another control depending on the source data?

问题描述

我有一个如此布置的网格;

I have a grid laid out like so;

+---------+---------+
|  Image  | Details |
|    is   |  pane   |
|  here   | for data|
|         |  entry  |
+---------+---------+
| ListView here to  |
| select data item  |
| for top two panes |
+---------+---------+

$ b $这一切都很好，但是现在我想将图像更改为另一组控件，当列表视图中的所选项目没有图像时，抱歉，没有图像可用

This all works well, but I would now like to change the image to another set of controls saying 'Sorry, no image available' when the selected item in the listview does not have an image

我已经尝试在DockPanel中包装图像，并在其中设置DataTemplate（所以我可以使用DataTriggers），但是IntelliSense说没有！

I've tried wrapping the image in a DockPanel and setting a DataTemplate there (so I can use DataTriggers) but IntelliSense says no!

ListView使用DataTriggers来做一个类似的事情，但是据我所知，如果单个图像似乎没有访问DataTemplate，我将无法让我的头脑圆满完成。

The ListView uses DataTriggers to do a similar thing, but as I say I can't get my head round how to do it for a single image that does not seem to have access to a DataTemplate.

简化XAML在下面;

Simplified XAML is below;

<Grid DataContext="{Binding Source={StaticResource MyData}}">
   <!-- row 0 col 0 -->
   <Image x:Name="imgPhoto" Source="{Binding ElementName=MyListViewOfData, Path=SelectedItem.PathToImageOnDisk}" />

   <!-- row 0 col 1 -->
   <StackPanel DataContext="{Binding ElementName=MyListViewOfData, Path=SelectedItem}">
      <TextBox Name="NameTextBox" Text="{Binding Name}" />
      <TextBlock Name="DateCreatedTextBlock" Text="{Binding DateCreated}" />
   </StackPanel>

   <!-- row 1 cols 0,1 -->
   <ListView ItemsSource="{Binding}" ItemTemplate="{StaticResource MyListViewTemplate}" 
IsSynchronizedWithCurrentItem="True" Name="MyListViewOfData" />

</Grid>

提前感谢WPF大师。

Ryan

更新：以下两个答案（Abe和Jobi）都被发现了，谢谢。

Update: Both answers below (Abe and Jobi) were spot on, thanks.

推荐答案

为了使用DataTemplate，您必须有一个使用模板渲染对象的控件。如果您使用ContentPresenter，您可以将其ContentTemplate设置为任何您喜欢的DataTemplate。

In order to use a DataTemplate, you have to have a control that uses the template to render an object. If you use a ContentPresenter, you can set its ContentTemplate to be a DataTemplate to whatever you like.

我将如何做到这一点：

<Grid DataContext="...">
    <ContentPresenter Content="{Binding SelectedItem, ElementName=MyListViewOfData}">
        <ContentPresenter.ContentTemplate>
            <DataTemplate>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition />
                        <ColumnDefinition />      
                    </Grid.ColumnDefinitions>
                    <Image x:Name="imgPhoto" Source="{Binding PathToImageOnDisk}" />
                    <TextBlock x:Name="error" Visibility="Collapsed" Text="Sorry, no image available" />
                    <StackPanel Grid.Column="1">
                        <TextBox Name="NameTextBox" Text="{Binding Name}" />
                        <TextBlock Name="DateCreatedTextBlock" Text="{Binding DateCreated}" />
                    </StackPanel>
                </Grid>
            <DataTemplate.Triggers>
                <DataTrigger Binding="{Binding PathToImageOnDisk}" Value="{x:Null}">
                    <Setter TargetName="imgPhoto" Property="Visibility" Value="Collapsed" />
                    <Setter TargetName="error" Property="Visibility" Value="Visible" />
                </DataTrigger>
            </DataTemplate.Triggers>
            </DataTemplate>
        </ContentPresenter.ContentTemplate>
    </ContentPresenter>
    <ListView ItemsSource="{Binding}" ItemTemplate="{StaticResource MyListViewTemplate}" IsSynchronizedWithCurrentItem="True" Name="MyListViewOfData" />

</Grid>

这篇关于如何根据源数据替换WPF网格中的图像与另一个控件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！