带标题的多项目组合框?
是否可以在绑定到多个项目的组合框中设置“列标题”?例如,显示人名的组合框。组合框将显示 John Doe。但我想显示列标题:
First Last
John Doe
Jane Doe
Jimmy Doe
如果不使用数据网格,这可能吗? 包含使用数据网格的简单解决方案怎么样?我找到了一种将数据网格嵌入到组合框中的解决方案,但它看起来很困难并且需要 MS Blend。
如果我能将一些标题作为下拉列表中的第一行,我会很高兴。
G
这是我的 xaml 代码,HB 尝试产生了注释中提到的编译错误。
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:dg="http://schemas.microsoft.com/wpf/2008/toolkit"
<ComboBox Name="cboPlaceNames" Grid.IsSharedSizeScope="True" ItemsSource="{DynamicResource items}" Height="22" Width="285" Margin="0,6,165,0" SelectedIndex="0" HorizontalAlignment="Right" VerticalAlignment="Top" SelectionChanged="cboPlaceNames_SelectionChanged">
<ComboBox.Resources>
<CompositeCollection x:Key="items">
<ComboBoxItem IsEnabled="False">
<Grid TextElement.FontWeight="Bold">
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="A"/>
<ColumnDefinition Width="5"/>
<ColumnDefinition SharedSizeGroup="B"/>
<ColumnDefinition Width="5"/>
<ColumnDefinition SharedSizeGroup="C"/>
</Grid.ColumnDefinitions>
<Grid.Children>
<TextBlock Grid.Column="0" Text="Name"/>
<TextBlock Grid.Column="2" Text="CLLI"/>
<TextBlock Grid.Column="4" Text="Street"/>
</Grid.Children>
</Grid>
</ComboBoxItem>
<Separator/>
<CollectionContainer Collection="{Binding Source={x:Reference cboPlaceNames}, Path=DataContext.Data}"/>
</CompositeCollection>
<DataTemplate DataType="x:Type obj:PlaceName">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="A"/>
<ColumnDefinition Width="5"/>
<ColumnDefinition SharedSizeGroup="B"/>
<ColumnDefinition Width="5"/>
<ColumnDefinition SharedSizeGroup="C"/>
</Grid.ColumnDefinitions>
<Grid.Children>
<TextBlock Grid.Column="0" Text="{Binding Name}"/>
<TextBlock Grid.Column="2" Text="{Binding CLLI}"/>
<TextBlock Grid.Column="4" Text="{Binding Street}"/>
</Grid.Children>
</Grid>
</DataTemplate>
</ComboBox.Resources>
</ComboBox>
Is it possible to have "column headers" on a combo box bound to multiple items? For example a combo box that displays a persons name. The combo box would display John Doe. But I'd like to display column headers:
First Last
John Doe
Jane Doe
Jimmy Doe
Is this possible without the use of a data grid?
What about a simple solution that includes the use of a data grid? I found one solution for embedding a data grid into a combo box but it looks difficult and requires MS Blend.
I'd be happy if I could just get some headers as the first row in the drop down.
G
Here is my xaml code with HB's attempt that produces a compile error as mentioned in the comments.
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:dg="http://schemas.microsoft.com/wpf/2008/toolkit"
<ComboBox Name="cboPlaceNames" Grid.IsSharedSizeScope="True" ItemsSource="{DynamicResource items}" Height="22" Width="285" Margin="0,6,165,0" SelectedIndex="0" HorizontalAlignment="Right" VerticalAlignment="Top" SelectionChanged="cboPlaceNames_SelectionChanged">
<ComboBox.Resources>
<CompositeCollection x:Key="items">
<ComboBoxItem IsEnabled="False">
<Grid TextElement.FontWeight="Bold">
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="A"/>
<ColumnDefinition Width="5"/>
<ColumnDefinition SharedSizeGroup="B"/>
<ColumnDefinition Width="5"/>
<ColumnDefinition SharedSizeGroup="C"/>
</Grid.ColumnDefinitions>
<Grid.Children>
<TextBlock Grid.Column="0" Text="Name"/>
<TextBlock Grid.Column="2" Text="CLLI"/>
<TextBlock Grid.Column="4" Text="Street"/>
</Grid.Children>
</Grid>
</ComboBoxItem>
<Separator/>
<CollectionContainer Collection="{Binding Source={x:Reference cboPlaceNames}, Path=DataContext.Data}"/>
</CompositeCollection>
<DataTemplate DataType="x:Type obj:PlaceName">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="A"/>
<ColumnDefinition Width="5"/>
<ColumnDefinition SharedSizeGroup="B"/>
<ColumnDefinition Width="5"/>
<ColumnDefinition SharedSizeGroup="C"/>
</Grid.ColumnDefinitions>
<Grid.Children>
<TextBlock Grid.Column="0" Text="{Binding Name}"/>
<TextBlock Grid.Column="2" Text="{Binding CLLI}"/>
<TextBlock Grid.Column="4" Text="{Binding Street}"/>
</Grid.Children>
</Grid>
</DataTemplate>
</ComboBox.Resources>
</ComboBox>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(5)
示例:
请注意,获得正确的
Collection
绑定并不那么容易,因为既没有DataContext
也没有可以依赖的 VisualTree、ElementName
和RelativeSource
不起作用,这是因为CompositeCollection
只是一个集合,而不是 FrameworkElement。除此之外,完成此操作的方式是通过具有共享大小列的网格。 DataTemplate 通过
DataType
自动应用。编辑: 将 header-ComboBoxItem 的
IsHitTestVisible
属性设置为 < code>False 是不够的,因为仍然可以使用键盘选择它。我现在将其更改为IsEnabled="False"
,这会稍微淡出该项目。您可能可以重新模板化该项目以不这样做。或者,如果您找到另一种方法来禁用它的选择,那当然也可以。Example:
Note that getting the
Collection
-binding right is not that easy because there is neitherDataContext
nor VisualTree to rely on,ElementName
andRelativeSource
does not work, this is becauseCompositeCollection
is just a collection, not a FrameworkElement.Other than that the way this is done is via Grids that have shared size columns. The DataTemplate is applied automatically via the
DataType
.Edit: Setting the header-ComboBoxItem's
IsHitTestVisible
property toFalse
is not enough since it still can be selected using the keyboard. I now changed it toIsEnabled="False"
which fades out the item a bit. You could probably re-template that item to not do that. Or if you find another way of disabling it from selection that would of course work out too.向组合框中添加列标题的最简单方法是在组合框中使用列表视图。
下面的代码给出了它的解决方案。
The simplest way to add columns headers to combobox is to use listview in combobox.
The following code is give the solution to it.
我喜欢南达的回答,因为这就是我想要实现的目标。但是,组合框的文本字段将无法正常工作。
由于我很懒,为了解决这个问题,我创建了一个水平方向的 StackPanel,其中一个 TextBox 绑定到所选项目的字段,以及一个带有嵌入式 ListView 的组合框。组合框现在的宽度为 20,因此仅显示向下箭头(您可以调整宽度和边距以获得正确的外观。这使得文本框看起来像组合框,具有 ListView 的所有优点, 我希望这能帮助您减少编码。
在此处输入图像描述
I liked Nandha's answer because this was what I was trying to achieve. However, the text field of the combo box will not work correctly.
Since I am lazy, to get around this I created a StackPanel of Horizontal orientation, with a TextBox bound to a field from the selected item, and the Combo Box with the embedded ListView. The Combo Box now has a width of 20 so just the down arrow shows (you can play with the width and margins to get just the right look. This makes the text box look like a combo box, with all the benefits of the ListView, and much less coding.
I hope this helps.enter image description here
将以下样式应用到组合框。
将您想要的视图应用到 ComboBox 的 Tag 属性
这就是所有人。
Apply the following style to the ComboBox.
Apply the View you want to the Tag property of the ComboBox
Thats all folks.
我喜欢 HB 的答案,但不幸的是,当我使用它时,我在标题
ComboBoxItem< 的输出中看到数据绑定错误/code> 的
HorizontalContentAlignment
和VerticalContentAlignment
属性:这些不会使程序崩溃,但它们确实会使输出混乱,并在运行调试版本时导致明显的延迟。无论是什么原因导致它们似乎都在 ComboBox 或 ComboBoxItem 的内部深处;无论如何,我无法找到任何方法来阻止它们(手动设置这些属性或通过
Style
没有帮助)。所以我最终做了一些小小的改变。这比我想要的更长、更黑客,但它完成了工作:I like H.B.'s answer, but unfortunately when I use it I see databinding errors in the output for the header
ComboBoxItem
'sHorizontalContentAlignment
andVerticalContentAlignment
properties:These don't crash the program, but they do clutter up the output and cause perceptible delays when running debug builds. Whatever's causing them seems to be deep in the bowels of
ComboBox
orComboBoxItem
; in any case, I couldn't figure out any way to prevent them (setting these properties manually or via aStyle
didn't help). So I ended up going with a slight variation. This is longer and hackier than I like things to be, but it gets the job done: