Изображение в заголовке первой вкладки в wpf TabHeader

Я хочу отобразить изображение в заголовке первой вкладки TabControl в полностью работающем в настоящее время приложении Prism MVVM WPF.

Полное описание выглядит следующим образом:

Когда пользователь выбирает элемент из списка категорий в левой области, он отображает «Подробнее» и «Сопутствующие товары» в правой области. Эта правая область содержит TabControl внутри UserControl. Первая вкладка показывает «Дополнительные сведения о категории», а вторая вкладка показывает «Сопутствующие товары». Данные отображаются корректно. Теперь я хочу отображать миниатюру категории и название категории только в заголовке первой вкладки.

Я попытался использовать HeaderTemplate на первой вкладке следующим образом.

<TabControl  VerticalContentAlignment="Stretch" HorizontalContentAlignment="Stretch" >
 <TabItem  Name="tabItemCategoryMoreInfo"  >
  <TabItem.HeaderTemplate>
    <DataTemplate>
      <StackPanel Orientation="Horizontal">
        <Image  x:Name="viewImage" Height="20" Width="20" Margin="0,0,2,0" 
                        Source="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type TabControl} }, Path=Content.DataContext.SelectedParent.PictureBinary}"/>
        <TextBlock Text="{Binding RelativeSource={RelativeSource AncestorType={x:Type TabItem} }, Path=Content.DataContext.SelectedParent.CategoryName}"
                           VerticalAlignment="Center" FontSize="14" FontWeight="SemiBold" />
      </StackPanel>
      <DataTemplate.Triggers>
        <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType={x:Type TabItem} }, Path=Content.DataContext.SelectedParent.PictureBinary}" Value="{x:Null}" >
          <Setter TargetName="viewImage" Property="Source" Value="/CatalogModule;component/Images/ItemIcon.png"  />
        </DataTrigger>
      </DataTemplate.Triggers>
     </DataTemplate>
  </TabItem.HeaderTemplate>

  <ContentControl prism:RegionManager.RegionName="CategoryMoreDetailsRegion" />
 </TabItem>
 <TabItem Header="Products" Name="tabItemCategoryProducts">
  <ContentControl prism:RegionManager.RegionName="CategoryProductsRegion" />
 </TabItem>

It didn’t show the product name or the product image. But it show only default image, so the Triggers looks working. Can some please help?

ИЗМЕНИТЬ:

Первоначально я использовал TabItem вместо TabControl в пути к данным изображения:

<Image  x:Name="viewImage" Height="20" Width="20" Margin="0,0,2,0" 
                    Source="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type TabItem} }, Path=Content.DataContext.SelectedParent.PictureBinary}"/>

mvvm tabitem wpf prism tabcontrol
person Dush    schedule 23.02.2015    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Path в ваших DataTemplate Binding отличаются... это может объяснить, почему это не работает. Если я вас правильно понял, вы говорите, что Binding Path в DataTrigger работает, так что, возможно, изменение Binding Path для свойств ImageSource и TextBlock.Text может сработать?:

<DataTemplate>
  <StackPanel Orientation="Horizontal">
    <Image  x:Name="viewImage" Height="20" Width="20" Margin="0,0,2,0" 
                    Source="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type TabItem}}, Path=Content.DataContext.SelectedParent.PictureBinary}"/>
    <TextBlock Text="{Binding RelativeSource={RelativeSource AncestorType={x:Type TabItem}}, Path=Content.DataContext.SelectedParent.CategoryName}"
                       VerticalAlignment="Center" FontSize="14" FontWeight="SemiBold" />
  </StackPanel>
  <DataTemplate.Triggers>
    <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType={x:Type TabItem}}, Path=Content.DataContext.SelectedParent.PictureBinary}" Value="{x:Null}" >
      <Setter TargetName="viewImage" Property="Source" Value="/CatalogModule;component/Images/ItemIcon.png"  />
    </DataTrigger>
  </DataTemplate.Triggers>
 </DataTemplate>

На всякий случай, если вы не видите разницы, вы использовали это в своем Image.Source Binding.Path:

AncestorType={x:Type TabControl}
person Community    schedule 23.02.2015
comment
Изначально я использовал TabItem вместо TabControl, забыл упомянуть, не работало. Извините, я не объяснил ясно. Под работой dataTrigger я подразумеваю то, что, поскольку ему не удалось найти правильное изображение из источника данных (поскольку мой код неверен), он показывает изображение по умолчанию ItemIcon.png из папки. - person Dush; 24.02.2015