RadComboBox 绑定显示类型而不是所需的字符串



我有一个带有两个模板的radcombobox,一个模板(nonEditableTemplate(工作正常并显示我想要的字符串,另一个只显示类型。当下拉列表打开时,两个组合框都显示正确的值,但可编辑的组合框选择框(显示(不正确且显示(程序集(。(类(。我浏览了堆栈溢出和谷歌,发现了很多使用DisplayMemberPath等的例子,但没有转换器。

用户控件中的 XAML

<telerik:RadComboBox
Width="200"
Height="50"
IsEditable="True"
ItemsSource="{Binding People, Mode=TwoWay, 
UpdateSourceTrigger=PropertyChanged}"
Style="{DynamicResource GcsComboBox}">
<telerik:RadComboBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Converter={StaticResource PersonToNameConverter}}" />
</DataTemplate>
</telerik:RadComboBox.ItemTemplate>
</telerik:RadComboBox>

组合框的全局样式

<Style x:Key="GcsComboBox" TargetType="telerik:RadComboBox">
<Setter Property="Padding" Value="5,3" />
<Setter Property="MinHeight" Value="22" />
<Setter Property="BorderThickness" Value="1" />
<Setter Property="Background" Value="{DynamicResource ControlBackgroundBrush}" />
<Setter Property="Foreground" Value="{DynamicResource LabelBrush}" />
<Setter Property="BorderBrush" Value="{DynamicResource BorderBrush}" />
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
<Setter Property="Template" Value="{StaticResource NonEditableComboBox}" />
<Setter Property="EditableTemplate" Value="{StaticResource EditableComboBox}" />
<Setter Property="NonEditableTemplate" Value="{StaticResource NonEditableComboBox}" />
<Setter Property="HorizontalContentAlignment" Value="Left" />
<Setter Property="SnapsToDevicePixels" Value="True" />
<Setter Property="FocusVisualStyle" Value="{x:Null}" />
<!--<Setter Property="Validation.ErrorTemplate" Value="{StaticResource ValidationTooltipTemplate}" />-->
<Setter Property="KeyboardNavigation.TabNavigation" Value="Continue" />
<Setter Property="ItemContainerStyle">
<Setter.Value>
<Style TargetType="telerik:RadComboBoxItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="telerik:RadComboBoxItem">
<Border
x:Name="Bd"
Padding="{TemplateBinding Padding}"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
SnapsToDevicePixels="true">
<ContentPresenter
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsHighlighted" Value="true">
<Setter Property="Background" Value="{DynamicResource HoverGradient}" />
<Setter Property="BorderThickness" Value="1" />
<Setter Property="BorderBrush" Value="{DynamicResource HoverGradient}" />
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Setter.Value>
</Setter>

可编辑组合框的全局样式

<ControlTemplate x:Key="EditableComboBox" TargetType="telerik:RadComboBox">
<Grid x:Name="VisualRoot">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Border
x:Name="Background"
Grid.ColumnSpan="2"
Background="{DynamicResource ControlBackgroundBrush}"
CornerRadius="3"
IsHitTestVisible="False" />
<Border
x:Name="Border"
Grid.ColumnSpan="2"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="3"
IsHitTestVisible="False" />
<Border
x:Name="MouseOverVisual"
Grid.ColumnSpan="2"
Background="{DynamicResource SelectedGradient}"
BorderBrush="{DynamicResource HoverGradient}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="3"
IsHitTestVisible="False"
Opacity="0" />
<Border
x:Name="DropDownOpenBorder"
Grid.ColumnSpan="2"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="3"
IsHitTestVisible="False"
Visibility="Collapsed" />
<TextBox
x:Name="PART_EditableTextBox"
Grid.Column="0"
Margin="1,1,0,1"
Padding="{TemplateBinding Padding}"
VerticalAlignment="Stretch"
HorizontalContentAlignment="{TemplateBinding 
HorizontalContentAlignment}"
VerticalContentAlignment="Center"
Background="{DynamicResource ControlBackgroundBrush}"
Foreground="{DynamicResource InputTextBrush}"
IsReadOnly="{TemplateBinding IsReadOnly}">
<TextBox.Template>
<ControlTemplate TargetType="TextBox">
<Grid>
<ScrollViewer
x:Name="PART_ContentHost"
Padding="{TemplateBinding Padding}"
VerticalContentAlignment="Stretch"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding 
BorderThickness}"
IsTabStop="False"
VerticalScrollBarVisibility="Auto" >
</ScrollViewer>
</Grid>
</ControlTemplate>
</TextBox.Template>
</TextBox>
<telerik:RadToggleButton
x:Name="PART_DropDownButton"
Grid.Column="1"
Background="{DynamicResource ControlBackgroundBrush}"
ClickMode="Press"
IsTabStop="False"
Style="{StaticResource NonEditableComboToggleButtonStyle}" 
/>
<Border
x:Name="Focus"
Grid.ColumnSpan="2"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="3"
IsHitTestVisible="False"
Visibility="Collapsed" />
<TextBlock
x:Name="Watermark"
Padding="{TemplateBinding Padding}"
HorizontalAlignment="Left"
VerticalAlignment="Center"
IsHitTestVisible="False"
Opacity=".5"
Text="{TemplateBinding EmptyText}"
Visibility="Collapsed" />
<Popup x:Name="PART_Popup">
<Border
x:Name="PART_ResizeBorder"
MinWidth="{TemplateBinding MinDropDownWidth}"
MaxHeight="{TemplateBinding MaxDropDownHeight}"
Background="{DynamicResource ControlBackgroundBrush}"
BorderBrush="{DynamicResource BorderBrush}"
BorderThickness="1">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<telerik:RadButton
x:Name="PART_ClearButton"
Grid.Row="0"
Content="{TemplateBinding 
ClearSelectionButtonContent}"
Visibility="{TemplateBinding 
ClearSelectionButtonVisibility}" />
<ScrollViewer
x:Name="PART_ScrollViewer"
Grid.Row="1"
Padding="1"
BorderThickness="0"
CanContentScroll="True"
Foreground="{TemplateBinding Foreground}"
HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
<ItemsPresenter />
</ScrollViewer>
</Grid>
</Border>
</Popup>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Disabled">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownOpenBorder" Storyboard.TargetProperty="(UIElement.Visibility)">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownOpenBorder" Storyboard.TargetProperty="BorderBrush">
<DiscreteObjectKeyFrame KeyTime="0" Value="{DynamicResource BorderBrush}" />
</ObjectAnimationUsingKeyFrames>
<DoubleAnimation
Storyboard.TargetName="PART_EditableTextBox"
Storyboard.TargetProperty="Opacity"
To="0.3"
Duration="0" />
</Storyboard>
</VisualState>
<VisualState x:Name="Normal" />
<VisualState x:Name="MouseOver">
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="MouseOverVisual"
Storyboard.TargetProperty="Opacity"
To="1"
Duration="0:0:0" />
</Storyboard>
</VisualState>
<VisualState x:Name="DropDownOpen">
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="Focus"
Storyboard.TargetProperty="(UIElement.Opacity)"
To="0"
Duration="0" />
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="(Border.BorderBrush)">
<DiscreteObjectKeyFrame KeyTime="0" Value="{DynamicResource BorderBrush}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="(UIElement.Visibility)">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Collapsed</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownOpenBorder" Storyboard.TargetProperty="(UIElement.Visibility)">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
<VisualStateGroup x:Name="FocusStates">
<VisualState x:Name="Focused">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Focus" Storyboard.TargetProperty="(UIElement.Visibility)">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Unfocused" />
</VisualStateGroup>
<VisualStateGroup x:Name="WatermarkStates">
<VisualState x:Name="WatermarkVisible">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Watermark" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0:0:0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="WatermarkInvisible" />
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</Grid>
</ControlTemplate>

这是提供所需效果的不可编辑模板。

<ControlTemplate x:Key="NonEditableComboBox" TargetType="telerik:RadComboBox">
<Grid x:Name="VisualRoot">
<Border
x:Name="Background"
Background="{DynamicResource ControlBackgroundBrush}"
CornerRadius="3"
IsHitTestVisible="False" />
<telerik:RadToggleButton
x:Name="PART_DropDownButton"
Padding="{TemplateBinding Padding}"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
ClickMode="Press"
Content="{TemplateBinding SelectionBoxItem}"
ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"
Foreground="{TemplateBinding Foreground}"
IsTabStop="False"
Style="{DynamicResource NonEditableComboToggleButtonStyle}" 
/>
<Border
x:Name="Focus"
Grid.ColumnSpan="2"
BorderBrush="{DynamicResource BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="3"
IsHitTestVisible="False"
Visibility="Collapsed" />
<Popup x:Name="PART_Popup">
<Border
x:Name="PART_ResizeBorder"
MinWidth="{TemplateBinding MinDropDownWidth}"
MaxHeight="{TemplateBinding MaxDropDownHeight}"
Background="{DynamicResource ControlBackgroundBrush}"
BorderBrush="{DynamicResource BorderBrush}"
BorderThickness="1">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<telerik:RadButton
x:Name="PART_ClearButton"
Grid.Row="0"
Content="{TemplateBinding 
ClearSelectionButtonContent}"
Visibility="{TemplateBinding 
ClearSelectionButtonVisibility}" />
<ScrollViewer
x:Name="PART_ScrollViewer"
Grid.Row="1"
Padding="1"
Background="{DynamicResource 
ControlBackgroundBrush}"
BorderThickness="0"
CanContentScroll="True"
Foreground="{TemplateBinding Foreground}"
HorizontalScrollBarVisibility="{TemplateBinding 
ScrollViewer.HorizontalScrollBarVisibility}"
VerticalScrollBarVisibility="{TemplateBinding 
ScrollViewer.VerticalScrollBarVisibility}">
<ItemsPresenter />
</ScrollViewer>
</Grid>
</Border>
</Popup>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Disabled" />
<VisualState x:Name="Normal" />
<VisualState x:Name="MouseOver" />
<VisualState x:Name="DropDownOpen">
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="Focus"
Storyboard.TargetProperty="
(UIElement.Opacity)"
To="0"
Duration="0" />
</Storyboard>
</VisualState>
</VisualStateGroup>
<VisualStateGroup x:Name="FocusStates">
<VisualState x:Name="Focused">
<Storyboard>
<ObjectAnimationUsingKeyFrames 
Storyboard.TargetName="Focus" Storyboard.TargetProperty="
(UIElement.Visibility)">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Unfocused" />
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</Grid>
</ControlTemplate>

Quoth Telerik:

。如果要自定义 Editable RadComboBox 的 TextBox 部分,可以使用 TextBoxStyle 属性。

这是他们的例子

<Style TargetType="TextBox" x:Key="CustomComboTextBoxStyle">
<Setter Property="Foreground" Value="Yellow" />
<!-- blah blah blah -->
</Style>

我建议为TextBoxStyle属性编写一个Style,该属性将Text设置为您的BindingPersonToNameConverter

<Style TargetType="TextBox" x:Key="CustomComboTextBoxStyle">
<Setter 
Property="Text" 
Value="{Binding Converter={StaticResource PersonToNameConverter}}" 
/>
</Style>

而且由于您正在自定义RadComboBox的整个模板,我也会注意确保您的版本不会干扰TextBoxStyle的使用。

最新更新