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

时间：2017-06-30 16:19:37

标签： wpf xaml combobox styles

我有一个带有两个模板的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>

这是给出所需效果的NonEditableTemplate。

<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>

1 个答案:

答案 0 :(得分：0)

Quoth Telerik：

  

...如果要自定义可编辑RadComboBox的TextBox部分，可以使用TextBoxStyle属性。

这是他们的例子

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

我建议为Style属性写一个TextBoxStyle，将Text设置为Binding PersonToNameConverter。

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

由于您要自定义RadComboBox的整个模板，因此我还要注意确保您的版本不会干扰TextBoxStyle的使用。

相关问题
最新问题