如何在WPF中使用XAML设置ComboBox标题

本文介绍了如何在WPF中使用XAML设置ComboBox标题的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！问题描述

我花了最近几天尝试为我的组合框创建一个标题，但我似乎找不到一种方法。我到目前为止发现的所有我无法在我的模型中实现。我不得不说，我对数据绑定有一个苗条的了解，我一直在做一些认真的阅读。我创建了一个comboBox并填充了来自不同数据库的数据。然后，我使用转换器来连接要显示的相关数据。现在我想添加一个头描述每个部分的名称。这是我的XAML：

I've spent the last few days trying to create a header for my comboBox but I can't seem find a way. All I've found so far couldn't be implemented in my model. I have to say that I have a slim understanding on databinding which I have been doing some serious reading on. I created a comboBox and filled it with data from different databases. Then, I used a converter to concatenate relevant data to be displayed. Now I would like to add a header describing the name of each section. Here is my XAML:

<Window.Resources> <local:ConcatenateFieldsMultiValueConverter x:Key="converter"/> </Window.Resources> <ComboBox Name="PersonComboBox" HorizontalAlignment="Left" Margin="104,64,0,0" VerticalAlignment="Top" Width="465"> <ComboBox.ItemTemplate> <DataTemplate> <StackPanel Orientation="Horizontal"> <CheckBox x:Name="ComboBoxCheckBox" IsChecked="{Binding IsSelected, Mode=TwoWay}"/> <TextBlock> <TextBlock.Text> <MultiBinding Converter="{StaticResource converter}" ConverterParameter=", "> <Binding Path="FirstName" /> <Binding Path="LastName"/> <Binding Path="Age"/> <Binding Path="Country"/> </MultiBinding> </TextBlock.Text> </TextBlock> </StackPanel> </DataTemplate> </ComboBox.ItemTemplate> </ComboBox>

这是我绑定到comboBox的位置：

Here is where I bound to the comboBox:

// Binds the comboBox to the personDataItems list this.PersonComboBox.ItemsSource = personDataItems;

这是标题应该如何：

This is how the header should look:

我想要能够使用XAML。非常感谢你的帮助。

I want to be able to do it using XAML. Thanks so much for your help.

推荐答案

Xaml代码

C＃代码

InitializeComponent(); List<ComboboxData> cmb = new List<ComboboxData>(); cmb.Add(new ComboboxData("oliver", "stone", "30", "USA")); cmb.Add(new ComboboxData("Joseph", "Truan", "35", "Canada")); Combobox1.ItemsSource = cmb; public class ComboboxData { public string Firstname { get; set; } public string LastName { get; set; } public string Age { get; set; } public string Country { get; set; } public ComboboxData(string Firstname, string LastName, string Age, string Country) { this.Firstname = Firstname; this.LastName = LastName; this.Age = Age; this.Country = Country; } public ComboboxData() { } }

输出

更新：我为togglebutton设计了两个tempale

Update : I have designed two tempale for togglebutton

1）当未选择combobox项目时ie.selectdeindex = -1（无项目选择）

1) When combobox item is not selected ie.selectdeindex=-1 (NoItemselected)

2）默认模板 ShowselectedItem ）

<TextBlock x:Key="header1" Text="FirstName"></TextBlock> <TextBlock x:Key="header2" Text="LastName"></TextBlock> <TextBlock x:Key="header3" Text="Age"></TextBlock> <TextBlock x:Key="header4" Text="Country"></TextBlock>  <ControlTemplate x:Key="NoItemselected" TargetType="ToggleButton"> <Grid x:Name="gd"> <Grid.ColumnDefinitions> <ColumnDefinition /> <ColumnDefinition Width="30" /> </Grid.ColumnDefinitions> <ContentPresenter Grid.Column="0"></ContentPresenter> <Grid Grid.Column="0"> <Grid.ColumnDefinitions> <ColumnDefinition></ColumnDefinition> <ColumnDefinition></ColumnDefinition> <ColumnDefinition></ColumnDefinition> <ColumnDefinition></ColumnDefinition> </Grid.ColumnDefinitions> <TextBlock Grid.Column="0" Text="{Binding Source={StaticResource header1},Path=Text}" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="Black" FontFamily="Segoe Ui Dark" FontSize="15" ></TextBlock> <TextBlock Grid.Column="1" Text="{Binding Source={StaticResource header2},Path=Text}" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="Black" FontFamily="Segoe Ui Dark" FontSize="15"></TextBlock> <TextBlock Grid.Column="2" Text="{Binding Source={StaticResource header3},Path=Text}" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="Black" FontFamily="Segoe Ui Dark" FontSize="15"></TextBlock> <TextBlock Grid.Column="3" Text="{Binding Source={StaticResource header4},Path=Text}" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="Black" FontFamily="Segoe Ui Dark" FontSize="15"></TextBlock> </Grid> <Border x:Name="Border" SnapsToDevicePixels="True" Grid.ColumnSpan="2" Background="Transparent" BorderBrush="LightGray" BorderThickness="1"/> <Border x:Name="Boredr1" SnapsToDevicePixels="True" Grid.Column="0" Margin="1" Background="Transparent" BorderBrush="LightGray" BorderThickness="0,0,1,0" /> <Path x:Name="Arrow" SnapsToDevicePixels="True" Grid.Column="1" Fill="Black" HorizontalAlignment="Center" VerticalAlignment="Center" Data="M 0 0 L 6 6 L 12 0 Z"/> </Grid> <ControlTemplate.Triggers> <Trigger Property="ToggleButton.IsMouseOver" Value="True"> <Setter TargetName="Border" Property="BorderBrush" Value="Black"/> <Setter TargetName="Boredr1" Property="BorderBrush" Value="Black"/> </Trigger> <Trigger Property="ToggleButton.IsChecked" Value="True"> <Setter TargetName="Arrow" Property="Data" Value="M 0 0 L 5 5 L 10 0"/> <Setter TargetName="Arrow" Property="Fill" Value="White"/> <Setter TargetName="Arrow" Property="Stroke" Value="Black"/> <Setter TargetName="Arrow" Property="StrokeThickness" Value="1.5"/> </Trigger> <Trigger Property="IsEnabled" Value="False"> <Setter TargetName="gd" Property="Visibility" Value="Visible"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate>  <ControlTemplate x:Key="ShowselectedItem" TargetType="ToggleButton"> <Grid x:Name="gd"> <Grid.ColumnDefinitions> <ColumnDefinition /> <ColumnDefinition Width="30" /> </Grid.ColumnDefinitions> <ContentPresenter Grid.Column="0"></ContentPresenter> <Border x:Name="Border" SnapsToDevicePixels="True" Grid.ColumnSpan="2" Background="Transparent" BorderBrush="LightGray" BorderThickness="1"/> <Border x:Name="Boredr1" SnapsToDevicePixels="True" Grid.Column="0" Margin="1" Background="Transparent" BorderBrush="LightGray" BorderThickness="0,0,1,0" /> <Path x:Name="Arrow" SnapsToDevicePixels="True" Grid.Column="1" Fill="Black" HorizontalAlignment="Center" VerticalAlignment="Center" Data="M 0 0 L 6 6 L 12 0 Z"/> </Grid> <ControlTemplate.Triggers> <Trigger Property="ToggleButton.IsMouseOver" Value="True"> <Setter TargetName="Border" Property="BorderBrush" Value="Black"/> <Setter TargetName="Boredr1" Property="BorderBrush" Value="Black"/> </Trigger> <Trigger Property="ToggleButton.IsChecked" Value="True"> <Setter TargetName="Arrow" Property="Data" Value="M 0 0 L 5 5 L 10 0"/> <Setter TargetName="Arrow" Property="Fill" Value="White"/> <Setter TargetName="Arrow" Property="Stroke" Value="Black"/> <Setter TargetName="Arrow" Property="StrokeThickness" Value="1.5"/> </Trigger> <Trigger Property="IsEnabled" Value="False"> <Setter TargetName="gd" Property="Visibility" Value="Visible"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate>  <ControlTemplate x:Key="ComboBoxTextBox" TargetType="TextBox"> <ScrollViewer x:Name="PART_ContentHost" Focusable="False" /> </ControlTemplate>  <Style x:Key="Multiple_Column_Cmb" TargetType="ComboBox"> <Setter Property="SnapsToDevicePixels" Value="true"/> <Setter Property="OverridesDefaultStyle" Value="true"/> <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/> <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Disabled"/> <Setter Property="Height" Value="40"/> <Setter Property="MinWidth" Value="120"/> <Setter Property="MinHeight" Value="20"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="ComboBox"> <Grid> <ToggleButton Name="ToggleButton" Template="{StaticResource ShowselectedItem}" Focusable="false" IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}" ClickMode="Press"/> <ContentPresenter Name="ContentSite" IsHitTestVisible="False" Content="{TemplateBinding SelectionBoxItem}" ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}" Margin="3,3,23,3" VerticalAlignment="Center" HorizontalAlignment="Left" /> <TextBox OverridesDefaultStyle="True" SelectionBrush="Gray" CaretBrush="Black" Margin="0,0,30,0" TextWrapping="NoWrap" x:Name="PART_EditableTextBox" FontFamily="Segoe UI Dark" Foreground="Black" Style="{x:Null}" Template="{StaticResource ComboBoxTextBox}" HorizontalAlignment="Left" Focusable="True" VerticalAlignment="Center" FontSize="15" Visibility="Hidden" IsReadOnly="{TemplateBinding IsReadOnly}"/> <Popup Name="Popup" Grid.ColumnSpan="2" Placement="Bottom" IsOpen="{TemplateBinding IsDropDownOpen}" AllowsTransparency="True" Focusable="False" PopupAnimation="Slide"> <ContentControl Name="DropDown" SnapsToDevicePixels="True" MaxWidth="{TemplateBinding ActualWidth}" MinWidth="{TemplateBinding ActualWidth}" MaxHeight="{TemplateBinding MaxDropDownHeight}"> <Grid Background="White" SnapsToDevicePixels="True" MaxWidth="{TemplateBinding ActualWidth}" MinWidth="{TemplateBinding ActualWidth}" MaxHeight="{TemplateBinding MaxDropDownHeight}"> <Border x:Name="DropDownBorder" SnapsToDevicePixels="True" Background="Transparent" MaxWidth="{TemplateBinding ActualWidth}" BorderThickness="1" BorderBrush="LightGray"/> <ScrollViewer ScrollViewer.CanContentScroll="False" Grid.Row="1" Margin="0,0,0,0" SnapsToDevicePixels="True"> <StackPanel IsItemsHost="True" Background="Transparent"> </StackPanel> </ScrollViewer> </Grid> </ContentControl> </Popup> </Grid> <ControlTemplate.Triggers> <Trigger Property="IsEditable" Value="true"> <Setter Property="IsTabStop" Value="false"/> <Setter TargetName="PART_EditableTextBox" Property="Background" Value="White"/> <Setter TargetName="PART_EditableTextBox" Property="Visibility" Value="Visible"/> <Setter TargetName="PART_EditableTextBox" Property="Foreground" Value="Black"/> <Setter TargetName="ContentSite" Property="Visibility" Value="Hidden"/> </Trigger> <Trigger Property="HasItems" Value="false"> <Setter TargetName="DropDownBorder" Property="MinHeight" Value="95"/> </Trigger> <Trigger Property="IsEnabled" Value="false"> <Setter Property="IsTabStop" Value="false"/> <Setter TargetName="PART_EditableTextBox" Property="Visibility" Value="Visible"/> <Setter TargetName="PART_EditableTextBox" Property="Foreground" Value="Black"/> <Setter TargetName="PART_EditableTextBox" Property="IsEnabled" Value="False"/> <Setter TargetName="PART_EditableTextBox" Property="Background" Value="White"/> <Setter TargetName="ContentSite" Property="Visibility" Value="Hidden"/> </Trigger> <Trigger Property="IsGrouping" Value="true"> <Setter Property="ScrollViewer.CanContentScroll" Value="false"/> </Trigger> <Trigger Property="SelectedIndex" Value="-1"> <Setter Property="Template" TargetName="ToggleButton" Value="{StaticResource NoItemselected}"></Setter> </Trigger> <Trigger SourceName="Popup" Property="Popup.AllowsTransparency" Value="true"> <Setter TargetName="DropDownBorder" Property="Margin" Value="0,2,0,0"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style>

更多推荐

如何在WPF中使用XAML设置ComboBox标题

如何在WPF中使用XAML设置ComboBox标题

发布评论取消回复

最近发表

热门文章

标签列表