WPF ComboBox 多列 [英] WPF ComboBox Multiple Columns

问题描述

我只是想知道是否有可以包含多列的 wpf 组合框控件?

I am just wondering if there is a wpf combobox control that can contain multiple columns?

如果没有，我需要使用什么 XAML 来实现这一点?

And if not, what XAML I need to use to achieve this?

如果可能的话，我只是在寻找一个基本的两列组合框，

I am just looking for a basic two column combobox if is possible,

谢谢

推荐答案

Multiple Column Combobox 请参考这些链接，通过编辑combox和comboboxitem默认模板/样式实现.

Please Refer these links for Multiple Column Combobox which is implemented by editing combox and comboboxitem Default template/style.

1)链接1

2)Link2

Xaml 代码:请查看 ComboboxItem 样式中注释的 Trigger IsHighlighted

Xaml code : Please take a look at commented Trigger IsHighlighted in ComboboxItem style

 <Grid>
    <ComboBox Height="30" Margin="5" ItemsSource="{Binding}" HorizontalContentAlignment="Stretch">
        <ComboBox.ItemTemplate>
            <DataTemplate>
                <TextBlock Margin="2" Text="{Binding Name}"/>
            </DataTemplate>
        </ComboBox.ItemTemplate>
        <ComboBox.ItemContainerStyle>
            <Style TargetType="{x:Type ComboBoxItem}">                
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate>
                            <Grid x:Name="gd" TextElement.Foreground="Black">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition/>
                                    <ColumnDefinition/>
                                    <ColumnDefinition/>
                                </Grid.ColumnDefinitions>
                                <TextBlock Margin="5" Grid.Column="0" Text="{Binding Name}"/>
                                <TextBlock Margin="5" Grid.Column="1" Text="{Binding State}"/>
                                <TextBlock Margin="5" Grid.Column="2" Text="{Binding Population}"/>
                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="ComboBoxItem.IsSelected" Value="True">
                                    <Setter TargetName="gd"  Property="Background" Value="Gray"></Setter>
                                    <Setter TargetName="gd"  Property="TextElement.Foreground" Value="White"></Setter>
                                </Trigger>
                                <Trigger Property="ComboBoxItem.IsMouseOver" Value="True">
                                    <Setter TargetName="gd"  Property="Background" Value="Blue"></Setter>
                                    <Setter TargetName="gd"  Property="TextElement.Foreground" Value="White"></Setter>
                                </Trigger>

                                <!--IsHighlighted and IsMouseOver is showing same effect but IsHighlighted is used for showing logical focus( for understanding check using tab key)-->

                                <!--<Trigger Property="ComboBoxItem.IsHighlighted" Value="True">
                                    <Setter TargetName="gd"  Property="Background" Value="Yellow"></Setter>
                                    <Setter TargetName="gd"  Property="TextElement.Foreground" Value="Black"></Setter>
                                </Trigger>-->
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </ComboBox.ItemContainerStyle>
    </ComboBox>
</Grid>

c# 代码

public partial class MainWindow : Window

{

    private ObservableCollection<City> cities = new ObservableCollection<City>();

    public MainWindow()
    {
        InitializeComponent();
        cities.Add(new City() { Name = "Mumbai", State = "Maharashtra", Population = 3000000 });
        cities.Add(new City() { Name = "Pune", State = "Maharashtra", Population = 7000000 });
        cities.Add(new City() { Name = "Nashik", State = "Maharashtra", Population = 65000 });
        cities.Add(new City() { Name = "Aurangabad", State = "Maharashtra", Population = 5000000 });
        DataContext = cities;
    }
}

class City
{
    public string State { get; set; }
    public string Name { get; set; }
    public int Population { get; set; }
}

输出

这篇关于WPF ComboBox 多列的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！