如何通过ItemsControl为ComboBoxItem添加样式？WPF动态元素问题

我太懂你说的这个ComboBox空项的坑了！之前也被这个问题折腾过，用ItemsControl替代确实是个好办法，毕竟它只会老老实实显示你动态添加的内容，不会凭空给你加空项。咱们一步步来把功能实现：

ItemsControl本身只是个“容器架子”，不像ComboBox自带了下拉选择的UI模板，所以你得自己定义ItemTemplate来呈现ConnectorItemsY里的每一项，同时保留你需要的旋转布局：

<ItemsControl ItemsSource="{Binding ConnectorItemsY}">
    <!-- 保留你的旋转布局变换 -->
    <ItemsControl.LayoutTransform>
        <RotateTransform Angle="90"/> <!-- 补全你原来的旋转角度，比如90度 -->
    </ItemsControl.LayoutTransform>
    
    <!-- 关键：定义每个项的显示模板 -->
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <!-- 这里替换成你原来ComboBox项里的内容，比如绑定显示文本 -->
            <TextBlock Text="{Binding YourDisplayProperty}" Padding="5,2"/>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
    
    <!-- 如果需要调整项的排列方式，比如旋转后横向排列，配置ItemsPanel -->
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel Orientation="Horizontal"/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
</ItemsControl>

ItemsControl没有自带SelectedItem属性，所以得在ViewModel里手动维护选中状态：

第一步：给你的项模型加选中属性 #

public class ConnectorItem : INotifyPropertyChanged
{
    private bool _isSelected;
    public bool IsSelected
    {
        get => _isSelected;
        set
        {
            _isSelected = value;
            OnPropertyChanged();
        }
    }

    // 你的业务属性，比如要显示的文本
    public string DisplayText { get; set; }

    public event PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

第二步：在ViewModel里维护选中项 #

public class YourViewModel : INotifyPropertyChanged
{
    public ObservableCollection<ConnectorItem> ConnectorItemsY { get; set; }
        = new ObservableCollection<ConnectorItem>();

    private ConnectorItem _selectedItemY;
    public ConnectorItem SelectedItemY
    {
        get => _selectedItemY;
        set
        {
            // 取消之前选中项的状态
            if (_selectedItemY != null)
                _selectedItemY.IsSelected = false;
            
            _selectedItemY = value;
            
            // 设置新选中项的状态
            if (_selectedItemY != null)
                _selectedItemY.IsSelected = true;
            
            OnPropertyChanged();
        }
    }

    // INotifyPropertyChanged实现
    public event PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

第三步：给ItemsControl加选中样式和点击事件 #

回到XAML，给项容器加选中样式，并且绑定点击事件来触发选中：

<ItemsControl ItemsSource="{Binding ConnectorItemsY}">
    <!-- 之前的LayoutTransform、ItemTemplate、ItemsPanel保留 -->
    
    <!-- 配置项容器的选中样式 -->
    <ItemsControl.ItemContainerStyle>
        <Style TargetType="ContentPresenter">
            <Setter Property="Cursor" Value="Hand"/>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="#FFE0E0E0"/>
                </Trigger>
                <DataTrigger Binding="{Binding IsSelected}" Value="True">
                    <Setter Property="Background" Value="#FF007ACC"/>
                    <Setter Property="TextElement.Foreground" Value="White"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </ItemsControl.ItemContainerStyle>
    
    <!-- 修改ItemTemplate，添加点击事件 -->
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding DisplayText}" 
                       MouseLeftButtonUp="ItemTextBlock_MouseLeftButtonUp"/>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

然后在后台代码里处理点击事件：

private void ItemTextBlock_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
    var clickedItem = (ConnectorItem)((TextBlock)sender).DataContext;
    var viewModel = (YourViewModel)DataContext;
    viewModel.SelectedItemY = clickedItem;
}

这样配置后，ItemsControl只会渲染ConnectorItemsY集合里存在的项，完全不会像ComboBox那样自动生成空项——毕竟它没有“默认空选择”的逻辑，完全跟着你的数据源走。

内容的提问来源于stack exchange，提问作者programmerJavaPL