在 xceed 工具包 ColorPicker 中隐藏向下箭头

Question

我在 WPF 项目中使用 Xceed Toolkit ColorPicker。颜色选择器工作正常，但找不到隐藏组合框样式向下箭头的选项。

我正在寻找一种编辑模板并将其隐藏的方法。

  xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"

       <xctk:ColorPicker Name="cp" 
                       DisplayColorAndName="False" 
                       Height="25"
                       Width="70"
                       SelectedColorChanged="cp_SelectedColorChanged_1" 
                       AvailableColorsSortingMode="HueSaturationBrightness" >            
    </xctk:ColorPicker>

我只是想知道是否有人可以分享可用的 XAML 模板代码。

Answer 1

您不必编辑模板，您可以将 ShowDropDownButton 属性设置为 false。

<xctk:ColorPicker Name="cp" 
                  DisplayColorAndName="False" 
                  Height="25"
                  Width="70"
                  AvailableColorsSortingMode="HueSaturationBrightness"
                  ShowDropDownButton="False">
</xctk:ColorPicker>

这导致 ToggleButton 不显示箭头。

Answer 2

如果您使用的版本中没有 ShowDropDownButton 属性，创建一个自定义 ButtonStyle 应该可以解决问题：

您应该使用自定义 ButtonStyle:

<xctk:ColorPicker Name="cp" 
                  DisplayColorAndName="False" 
                  Height="25"
                  Width="70"
                  SelectedColorChanged="cp_SelectedColorChanged_1" 
                  AvailableColorsSortingMode="HueSaturationBrightness" >
    <xctk:ColorPicker.Resources>
        <BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />
    </xctk:ColorPicker.Resources>
    <xctk:ColorPicker.ButtonStyle>
        <Style TargetType="ToggleButton">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ToggleButton" xmlns:chrome="clr-namespace:Xceed.Wpf.Toolkit.Chromes;assembly=Xceed.Wpf.Toolkit">
                        <Grid SnapsToDevicePixels="True">
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="*" />
                                    <ColumnDefinition Width="Auto" />
                                </Grid.ColumnDefinitions>

                                <Border Background="{TemplateBinding Background}"
                                        BorderBrush="{TemplateBinding BorderBrush}"
                                        BorderThickness="{TemplateBinding BorderThickness}"
                                        Padding="{TemplateBinding Padding}"
                                        SnapsToDevicePixels="True">
                                    <ContentPresenter Content="{TemplateBinding Content}"
                                                    ContentTemplate="{TemplateBinding ContentTemplate}"
                                                    ContentTemplateSelector="{TemplateBinding ContentTemplateSelector}"
                                                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" />
                                </Border>
                                <chrome:ButtonChrome x:Name="ToggleButtonChrome"
                                                    Grid.Column="1"
                                                    CornerRadius="0,2.75,2.75,0"
                                                    Visibility="{Binding ShowDropDownButton, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=xctk:ColorPicker}, Converter={StaticResource BooleanToVisibilityConverter}}"
                                                    RenderChecked="{Binding IsOpen, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=xctk:ColorPicker}}"
                                                    RenderEnabled="{Binding IsEnabled, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=xctk:ColorPicker}}"
                                                    RenderMouseOver="{TemplateBinding IsMouseOver}"
                                                    RenderPressed="{TemplateBinding IsPressed}">
                                </chrome:ButtonChrome>
                            </Grid>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </xctk:ColorPicker.ButtonStyle>
</xctk:ColorPicker>

在 xceed 工具包 ColorPicker 中隐藏向下箭头

Hide Down Arrow in xceed toolkit ColorPicker

wpf

toolkit

color-picker

xceed