WPF Multicolumn Combobox

Question

我有以下用于多列组合框的数据模板：

<DataTemplate x:Key="ShipViaKey">
    <Grid Height="23" Width="Auto" ShowGridLines="False">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="100"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

        <TextBlock Grid.Column="0" Text="{Binding Code}"/>
        <TextBlock Grid.Column="1" Text="{Binding Carrier}"/>
    </Grid>
</DataTemplate>

组合框的定义如下：

<ComboBox Grid.Row="0" Grid.Column="1" x:Name="CboShipVia" SelectedValue="{Binding FkCarrier, Mode=TwoWay}" SelectedValuePath="PkCarrier" IsEnabled="{Binding HasData}" ItemTemplate="{StaticResource ShipViaKey}"/>

这一切都很好;除了我只想显示＆＃34; Code＆＃34;组合框中所选项目的值，而不是两个值。有没有办法做到这一点？

Answer 1

而不是ItemTemplate，请使用ItemContainerStyle：

<ComboBox.ItemContainerStyle>
    <Style TargetType="ComboBoxItem">
        <Setter Property="ContentTemplate">
            <Setter.Value>
                <DataTemplate>
                    <Grid Height="23" Width="Auto" ShowGridLines="False">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="100"/>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>

                        <TextBlock Grid.Column="0" Text="{Binding Code}"/>
                        <TextBlock Grid.Column="1" Text="{Binding Carrier}"/>
                    </Grid>
                </DataTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ComboBox.ItemContainerStyle>

另外，将DisplayMemberPath设置为Code属性。

Answer 2

由于SharedSizeGroup功能，我提出了这个提供列垂直对齐的解决方案。

资源：

<DataTemplate x:Key="advancedComboxItemDataTemplate">
    <Grid Width="Auto">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" SharedSizeGroup="A"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <TextBlock Text="{Binding Caption}" Margin="5" Grid.Column="0" TextAlignment="Left"/>
        <TextBlock Text="{Binding Description}" Margin="5" Grid.Column="1" TextAlignment="Left">
            <TextBlock.Style>
                <Style TargetType="TextBlock">
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=ComboBoxItem}, Path=IsSelected}" Value="{x:Null}">
                            <Setter Property="Visibility" Value="Collapsed"/>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </TextBlock.Style>
        </TextBlock>
    </Grid>
</DataTemplate>

<ItemsPanelTemplate x:Key="advancedComboxItemsPanelTemplate">
    <StackPanel Grid.IsSharedSizeScope="True" IsItemsHost="True"/>
</ItemsPanelTemplate>

用法：

<ComboBox Width="300"
          ItemsSource="{Binding ReferentialData.BankReferences}" 
          SelectedItem="{Binding SelectedObject.PayTermBankReference}"
          ItemTemplate="{StaticResource advancedComboxItemDataTemplate}"
          ItemsPanel="{StaticResource advancedComboxItemsPanelTemplate}"/>