wpf 在DataGridComboBoxColumn的组合框中显示图像和文本

1yjd4xko  于 2023-01-27  发布在  其他
关注(0)|答案(1)|浏览(242)

我有一个DataGrid,其中一列是DataGridComboBoxColumn。对于这些组合框中的项,我需要显示一个图像和一些文本。下面是我能够做的。但是初始绑定不起作用。一旦我在组合框中选择了一项,所有组合框中的图像都会消失。
我所做的是正确的吗?让它与我所缺少的某种触发器或绑定一起工作?或者有没有更好的方法在datagrid的组合框中同时显示图像和文本?

<DataGridComboBoxColumn Header="Status" SelectedValueBinding="{Binding Status}" SelectedItemBinding="{Binding Status}" SelectedValuePath="Tag" xmlns:s="clr-namespace:System;assembly=mscorlib"
                                                    >
                                <DataGridComboBoxColumn.ItemsSource>
                                    <x:Array Type="{x:Type StackPanel}">
                                        <StackPanel Orientation="Horizontal">
                                            <Image Source="{DynamicResource DispatchedImage}">
                                              
                                            </Image>
                                            <TextBlock Text="DISP"/>
                                            
                                            <StackPanel.Tag>
                                                <s:String>"1"</s:String>
                                            </StackPanel.Tag>
                                        </StackPanel>

                                        <StackPanel Orientation="Horizontal">
                                            <Image Source="{DynamicResource ConfirmedImage}">
                                            </Image>
                                            <TextBlock Text="CONF"/>
                                            <StackPanel.Tag>
                                                <s:String>"2"</s:String>
                                            </StackPanel.Tag>
                                        </StackPanel>

                                        <StackPanel Orientation="Horizontal">
                                            <Image Source="{DynamicResource PickedUpImage}">
                                                
                                            </Image>
                                            <TextBlock Text="P/U"/>
                                            <StackPanel.Tag>
                                                <s:String>"3"</s:String>
                                            </StackPanel.Tag>
                                        </StackPanel>

                                        <StackPanel Orientation="Horizontal">
                                            <Image Source="{DynamicResource DeliveredImage}">
                                           
                                            </Image>
                                            <TextBlock Text="DEL"/>
                                            <StackPanel.Tag>
                                                <s:String>"4"</s:String>
                                            </StackPanel.Tag>
                                        </StackPanel>
                                    </x:Array>
                                </DataGridComboBoxColumn.ItemsSource>
                            </DataGridComboBoxColumn>
erhoui1w

erhoui1w1#

您应该将ComboBoxItemsSource绑定到IEnumerable<T>,其中T是一个类型,它具有display值和id值的属性:

public class CustomerComboBoxItem
{
    public string Name { get; set; }
    public int Value { get; set; }
}

将以下属性添加到视图模型中:

public CustomerComboBoxItem[] Items { get; } = new CustomerComboBoxItem[]
{
    new CustomerComboBoxItem(){ Name ="DISP", Value = 1 },
    new CustomerComboBoxItem(){ Name ="CONF", Value = 2 },
    new CustomerComboBoxItem(){ Name ="P/U", Value = 3 },
    new CustomerComboBoxItem(){ Name ="DEL", Value = 4 }
};

...并使用ItemTemplate

<DataGrid ...>
    <DataGrid.Resources>
        <DataTemplate x:Key="template">
            <StackPanel Orientation="Horizontal">
                <Image>
                    <Image.Style>
                        <Style TargetType="Image">
                            <Style.Triggers>
                                <DataTrigger Binding="{Binding Text}" Value="DISP">
                                    <Setter Property="Source" Value="{DynamicResource DispatchedImage}" />
                                </DataTrigger>
                                <DataTrigger Binding="{Binding Text}" Value="CONF">
                                    <Setter Property="Source" Value="{DynamicResource ConfirmedImage}" />
                                </DataTrigger>
                                <DataTrigger Binding="{Binding Text}" Value="P/U">
                                    <Setter Property="Source" Value="{DynamicResource PickedUpImage}" />
                                </DataTrigger>
                                <DataTrigger Binding="{Binding Text}" Value="DEL">
                                    <Setter Property="Source" Value="{DynamicResource DeliveredImage}" />
                                </DataTrigger>
                            </Style.Triggers>
                        </Style>
                    </Image.Style>
                </Image>
                <TextBlock Text="{Binding Name}"/>
            </StackPanel>
        </DataTemplate>
    </DataGrid.Resources>
    <DataGrid.Columns>
        <DataGridComboBoxColumn Header="Status"
                                SelectedValueBinding="{Binding Status}" 
                                SelectedValuePath="Id">
            <DataGridComboBoxColumn.ElementStyle>
                <Style TargetType="{x:Type ComboBox}">
                    <Setter Property="ItemsSource" Value="{Binding Path=DataContext.Items, RelativeSource={RelativeSource AncestorType=DataGrid}}" />
                    <Setter Property="ItemTemplate" Value="{StaticResource template}" />
                </Style>
            </DataGridComboBoxColumn.ElementStyle>
            <DataGridComboBoxColumn.EditingElementStyle>
                <Style TargetType="{x:Type ComboBox}">
                    <Setter Property="ItemsSource" Value="{Binding Path=DataContext.Items, RelativeSource={RelativeSource AncestorType=DataGrid}}" />
                    <Setter Property="ItemTemplate" Value="{StaticResource template}" />
                </Style>
            </DataGridComboBoxColumn.EditingElementStyle>
        </DataGridComboBoxColumn>
        ...
    </DataGrid.Columns>
</DataGrid>

有关详细信息,请参阅docs中的数据模板部分。

相关问题