如何突出显示 ItemsControl WPF 中的特定内容元素项？答案

【问题标题】：How to Highlight the particular Content element item in ItemsControl WPF?如何突出显示 ItemsControl WPF 中的特定内容元素项？
【发布时间】：2020-12-10 12:59:07
【问题描述】：

我有显示切换按钮列表的 ItemControl，按钮名称通过绑定内容名称以数字显示。我需要什么假设我想突出显示数字 24 的切换按钮。有什么方法可以通过索引位置获取 Itemscontrol 并突出显示 XAML 触发器中的背景。例如：当单击按钮时，我想突出显示 id=9 的切换按钮。

<itemsControl>
<datatemplate>
<radtoggleButton content={binding id} ischecked={binding enabled}>
</datatemplate>
</itemsControl>

有没有办法像下面这样动态命名数据模板控件项？

【问题讨论】：

按钮的索引从何而来？它是视图模型上的属性，还是代码隐藏中的属性？ “按钮名称”、x:Name 或按钮上的标签是什么意思？您如何通过绑定ItemsSource 或只是将ToggleButtons 放入控件中？
我正在通过 itemsource 绑定数据，该 itemsource 具有 ****Class 的集合，该集合具有类似 1)Enable（选中或取消选中）2)Label -->Id。
那么这些项目是否包含索引属性，或者您如何确定应该突出显示哪个项目？它们是否包含任何标识符？您是否有单独的属性来突出显示项目？
我想要 itemsControl.[label]=>高亮背景色为黄色
是的！我有一个单独的属性需要突出显示

标签： wpf data-binding wpf-controls prism

【解决方案1】：

假设您的视图模型中的项目集合是MyItemsCollection，并且您的项目类型是MyItem。将属性 TargetItem 属性添加到您的视图模型以标识要突出显示的项目。

private MyItem _highlightedItem;
public MyItem HighlightedItem
{
   get => _highlightedItem;
   set
   {
      if (_highlightedItem!= value)
      {
         _highlightedItem = value;
         OnPropertyChanged();
      }
   }
}

创建一个简单的多值转换器，它比较对象是否相等并返回bool。

public class EqualityToBooleanConverter : IMultiValueConverter
{
   public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture)
   {
      return values[0] == values[1];
   }

   public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture)
   {
      throw new InvalidOperationException("This is a one-way conversion.");
   }
}

您可以将其添加到您的ItemsControl 的资源字典中。

<ItemsControl ItemsSource="{Binding MyItemsCollection}" ...>
   <ItemsControl.Resources>
      <local:EqualityToBooleanConverter x:Key="EqualityToBooleanConverter"/>
   </ItemsControl.Resources>
   <!-- ...your other code. -->
</ItemsControl>

根据您的视图模型中的HighlightedItem 属性，在您的DataTemplate 中创建一个DataTrigger 以突出显示ToggleButton。

<DataTemplate DataType="{x:Type local:MyItem}">
   <ToggleButton Content="{Binding Id}"
                 IsChecked="{Binding Enabled">
      <ToggleButton.Style>
         <Style TargetType="{x:Type ToggleButton}"
                BasedOn="{StaticResource {x:Type ToggleButton}}">
            <Style.Triggers>
               <DataTrigger Value="True">
                  <DataTrigger.Binding>
                     <MultiBinding Converter="{StaticResource EqualityToBooleanConverter}">
                        <Binding/>
                        <Binding Path="DataContext.HighlightItem" RelativeSource="{RelativeSource FindAncestor, AncestorType={x:Type ItemsControl}}"/>
                     </MultiBinding>
                  </DataTrigger.Binding>
                  <Setter Property="Background" Value="Yellow"/>
                </DataTrigger>
            </Style.Triggers>
         </Style>
      </ToggleButton.Style>
   </ToggleButton>
</DataTemplate>

现在您只需将HighlightedItem 设置为您通过其在视图模型中的MyItemsCollection 中的索引访问的目标项。

HighlightedItem = MyItemsCollection[24];

请注意，如果要突出显示的项目实际上是选定的项目，那么请考虑使用Selector 控件，例如ListBox。然后你可以使用它的容器的IsSelected 属性。

【讨论】：

感谢您的帮助，但我在这里有一个问题，假设我点击了 24，然后切换按钮 24 突出显示。但是当我点击另一个按钮时，现在 24 和其他按钮一次都突出显示，只有一个按钮应该突出显示。
@Nikhil 请在您的问题中明确说明这些细节。我已经修改了答案。