Как заменить изображение в сетке WPF другим элементом управления в зависимости от исходных данных?
У меня сетка выложена вот так;
+---------+---------+
| Image | Details |
| is | pane |
| here | for data|
| | entry |
+---------+---------+
| ListView here to |
| select data item |
| for top two panes |
+---------+---------+
Все это работает хорошо, но теперь я хотел бы изменить изображение на другой набор элементов управления, говорящих «Извините, изображение недоступно», когда у выбранного элемента в списке нет изображения.
Я пробовал обернуть изображение в DockPanel и установить там DataTemplate (чтобы я мог использовать DataTriggers), но IntelliSense говорит нет!
ListView использует DataTrigger для выполнения аналогичных действий, но, как я уже сказал, я не могу понять, как это сделать для одного изображения, которое, похоже, не имеет доступа к DataTemplate.
Ниже приведен упрощенный XAML;
<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.
Райан
Обновление: оба ответа ниже (Абэ и Джоби) были правильными, спасибо.
Ответы 2
Чтобы использовать DataTemplate, у вас должен быть элемент управления, который использует шаблон для визуализации объекта. Если вы используете ContentPresenter, вы можете установить для его ContentTemplate значение DataTemplate, которое вам нравится.
Вот как бы я это сделал:
<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. Просто поместите элемент управления изображением поверх элемента управления «Недоступно», чтобы в любой момент, когда загрузка изображения не удалась, вы могли видеть сообщение ниже. Если управление изображением прошло успешно, сообщение «Недоступно» перекрывается изображением.