c# WPF Telerik combobox 多选自定义显示值

Posted 2023-04-01

【中文标题】c# WPF Telerik combobox 多选自定义显示值

【英文标题】：c# WPF Telerik combobox multiselect custom display value

【发布时间】：2021-07-31 21:52:14

【问题描述】：

我想用 Telerik 创建多选组合框控件。我找到的示例在下一个链接中： https://docs.telerik.com/devtools/wpf/controls/radcombobox/features/multiple-selection

所以，我是这样创建的：

<telerik:RadComboBox x:Name="radComboBox" AllowMultipleSelection="True" Height="30" Width="300" MultipleSelectionBoxTemplate="StaticResource EmptyTemplate">
        <telerik:RadComboBoxItem Content="Alapattah" />
        <telerik:RadComboBoxItem Content="Brickell Avenue" />
        <telerik:RadComboBoxItem Content="Downtown Miami" />
        <telerik:RadComboBoxItem Content="El Portal" />
</telerik:RadComboBox>

结果就像它应该的那样。但是我想在组合框的“结果”部分显示较短的文本，当它关闭时。现在如果我选择 Alapattah 和 El Portal，组合框的值将是 Alapattah, El Portal，我想让它看起来像 AL, EP。

所以我创建了新模型，在组合框中设置了 2 个属性 ID 和名称，DisplayMemberPath="Name" SelectedValuePath="ID"，但结果仍然相同，它只从 DisplayMemberPath 中获取值。

这个多选有一个DataTemplate：

<DataTemplate x:Key="EmptyTemplate">
<TextBlock FontWeight="Bold" FontFamily="Comic Sans" FontStyle="Italic" Text="Binding" />
</DataTemplate>

这样我可以得到 WpfApp1.Item、WpfApp1.Item 等组合框结果...

如果我设置 Text="Binding Name" 我什么也得不到。

这是完整的代码预览：

<Window x:Class="WpfApp10.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
        xmlns:local="clr-namespace:WpfApp10"
        mc:Ignorable="d"
        Title="MainWindow" 
        Height="450" 
        Width="800">
    <Grid>
        <Grid.Resources>
            <DataTemplate x:Key="EmptyTemplate">
                <TextBlock FontWeight="Bold" FontFamily="Arial" FontStyle="Italic" Text="Binding Name" />
            </DataTemplate>
        </Grid.Resources>
        <telerik:RadComboBox x:Name="radComboBox"
                             AllowMultipleSelection="True" 
                             Height="30" 
                             Width="300"
                             MultipleSelectionBoxTemplate="StaticResource EmptyTemplate">
        </telerik:RadComboBox>
    </Grid>
</Window>

那么，有什么方法可以实现这一点，也许是一些自定义模板？

【问题讨论】：

MultipleSelectionBoxTemplate 属性有什么问题？

我已经编辑了我的问题，抱歉我没有写下所有信息。

如果您将Binding 更改为Binding YourProperty 会怎样，其中YourProperty 是返回您想要显示的任何内容的项目的属性？

当我改变它时，我什么也得不到。我什至创建了一个转换器，它得到的值是字符串“WpfApp1.Item”，它不是一个对象。

你应该可以在MultipleSelectionBoxTemplate中绑定到SelectedItems。

【参考方案1】：

在多选场景中，组合框中显示的选中值实际上是单个字符串，表示串联的选中项。您可以在 RadComboBox 的 SelectionBoxItem 或 Text 属性中找到该值。

根据具体情况，字符串将包含不同的值。例如，如果您像在第一个代码 sn-p 中那样直接使用 RadComboBoxItems 填充控件，则将使用每个项目的 Content 属性。如果您使用 ItemsSource，则字符串将来自 DisplayMemberPath 指向的属性。如果未定义 DisplayMemberPath，则使用相应类（来自 ItemsSource）的 .ToString() 实现。这就是为什么你会在最后一种情况下得到“WpfApp1.Item, WpfApp1.Item...”。

要实现您的要求，您可以使用 MultipleSelectionBoxTemplate、SelectionBoxItem 和 IValueConverter。

<FrameworkElement.Resources>
    <local:SelectionToCustomStringCoverter x:Key="SelectionToCustomStringCoverter" />
</FrameworkElement.Resources>

<!-- -->

<telerik:RadComboBox x:Name="radComboBox" AllowMultipleSelection="True">
    <telerik:RadComboBox.MultipleSelectionBoxTemplate>
        <DataTemplate>
            <TextBlock Text="Binding ElementName=radComboBox, Path=SelectionBoxItem, Converter=StaticResource SelectionToCustomStringCoverter" />
        </DataTemplate>
    </telerik:RadComboBox.MultipleSelectionBoxTemplate>
</telerik:RadComboBox>

IValueConverter 应该如下所示：

public class SelectionToCustomStringCoverter : IValueConverter

    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    
        string originalData = (string)value;
        string newData = // modify the original string
        return newData;
    

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    
        throw new NotImplementedException();