c# wpf 调整combobox下拉框样式

通过Blend复制原有样式后修改

<Style x:Key="ComboBoxToggleButton" TargetType="{x:Type ToggleButton}">
    <Setter Property="OverridesDefaultStyle" Value="true"/>
    <Setter Property="IsTabStop" Value="false"/>
    <Setter Property="Focusable" Value="false"/>
    <Setter Property="ClickMode" Value="Press"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ToggleButton}">
                <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{Binding (hc:BorderElement.CornerRadius), RelativeSource={RelativeSource Mode=TemplatedParent}}" SnapsToDevicePixels="true">
                    <Border BorderBrush="Transparent" BorderThickness="1" HorizontalAlignment="Right" Margin="0,0,6,0" SnapsToDevicePixels="true" Width="{StaticResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}">
                        <Path x:Name="arrow" Data="{StaticResource DownGeometry}" Fill="{TemplateBinding BorderBrush}" HorizontalAlignment="Center" Height="9" Stretch="Uniform" VerticalAlignment="Center" Width="16"/>
                    </Border>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsChecked" Value="True">
                        <Setter Property="Data" TargetName="arrow" Value="{StaticResource UpGeometry}"/>
                    </Trigger>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter Property="Opacity" Value=".4"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
<ControlTemplate x:Key="ComboBoxTemplate" TargetType="{x:Type ComboBox}">
    <Grid x:Name="templateRoot" SnapsToDevicePixels="true">
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition Width="30"/>
        </Grid.ColumnDefinitions>
        <Popup x:Name="PART_Popup" AllowsTransparency="true" Grid.ColumnSpan="2" IsOpen="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource Mode=TemplatedParent}}" Margin="1" Placement="Bottom" PopupAnimation="{StaticResource {x:Static SystemParameters.ComboBoxPopupAnimationKey}}" PlacementTarget="{Binding ElementName=toggleButton}">
            <Decorator Margin="8 0">
                <Border x:Name="dropDownBorder" Background="#2D3036" BorderBrush="#2D3036" BorderThickness="0,1,0,0" CornerRadius="{Binding (hc:BorderElement.CornerRadius), RelativeSource={RelativeSource Mode=TemplatedParent}}" Effect="{StaticResource EffectShadow2}" Margin="0,0,0,8" MinWidth="{Binding ActualWidth, ElementName=toggleButton}" MaxHeight="{TemplateBinding MaxDropDownHeight}">
                    <hc:ToggleBlock HorizontalContentAlignment="Stretch" IsChecked="{Binding HasItems, Mode=OneWay, RelativeSource={RelativeSource Mode=TemplatedParent}}" VerticalContentAlignment="Stretch">
                        <hc:ToggleBlock.CheckedContent>
                            <ScrollViewer Margin="2">
                                <ItemsPresenter x:Name="ItemsPresenter" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                            </ScrollViewer>
                        </hc:ToggleBlock.CheckedContent>
                        <hc:ToggleBlock.UnCheckedContent>
                            <hc:Empty />
                        </hc:ToggleBlock.UnCheckedContent>
                    </hc:ToggleBlock>
                </Border>
            </Decorator>
        </Popup>
        <ToggleButton x:Name="toggleButton" Background="#2D3036" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Grid.Column="0" Grid.ColumnSpan="2" IsChecked="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource Mode=TemplatedParent}}" Style="{StaticResource ComboBoxToggleButton}"/>
        <Border Grid.Column="0" Margin="1,0">
            <ContentPresenter x:Name="contentPresenter" ContentStringFormat="{TemplateBinding SelectionBoxItemStringFormat}" ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" Content="{TemplateBinding SelectionBoxItem}" ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" IsHitTestVisible="false" Margin="{TemplateBinding Padding}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
        </Border>
    </Grid>
    <ControlTemplate.Triggers>
        <Trigger Property="HasItems" Value="false">
            <Setter Property="Height" TargetName="dropDownBorder" Value="95"/>
        </Trigger>
        <Trigger Property="hc:DropDownElement.ConsistentWidth" Value="True">
            <Setter Property="MaxWidth" TargetName="dropDownBorder" Value="{Binding ActualWidth, ElementName=toggleButton}"/>
            <Setter Property="MinWidth" TargetName="dropDownBorder" Value="{Binding ActualWidth, ElementName=toggleButton}"/>
        </Trigger>
        <Trigger Property="hc:DropDownElement.AutoWidth" Value="True">
            <Setter Property="MaxWidth" TargetName="dropDownBorder" Value="{x:Static system:Double.MaxValue}"/>
            <Setter Property="MinWidth" TargetName="dropDownBorder" Value="{Binding ActualHeight, ElementName=toggleButton}"/>
        </Trigger>
        <MultiTrigger>
            <MultiTrigger.Conditions>
                <Condition Property="IsGrouping" Value="true"/>
                <Condition Property="VirtualizingPanel.IsVirtualizingWhenGrouping" Value="false"/>
            </MultiTrigger.Conditions>
            <Setter Property="ScrollViewer.CanContentScroll" Value="false"/>
        </MultiTrigger>
        <MultiTrigger>
            <MultiTrigger.Conditions>
                <Condition Property="IsMouseOver" SourceName="toggleButton" Value="true"/>
                <Condition Property="IsOpen" SourceName="PART_Popup" Value="false"/>
            </MultiTrigger.Conditions>
            <Setter Property="BorderBrush" Value="{DynamicResource SecondaryBorderBrush}"/>
        </MultiTrigger>
        <Trigger Property="IsOpen" SourceName="PART_Popup" Value="True">
            <Setter Property="BorderBrush" Value="{DynamicResource PrimaryBrush}"/>
        </Trigger>
        <Trigger Property="IsFocused" Value="True">
            <Setter Property="BorderBrush" Value="{DynamicResource PrimaryBrush}"/>
        </Trigger>
        <Trigger Property="IsEnabled" Value="false">
            <Setter Property="Opacity" Value="0.4"/>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>
<Style x:Key="ComboBoxEditableTextBox" TargetType="{x:Type TextBox}">
    <Setter Property="OverridesDefaultStyle" Value="true"/>
    <Setter Property="AllowDrop" Value="true"/>
    <Setter Property="MinWidth" Value="0"/>
    <Setter Property="MinHeight" Value="0"/>
    <Setter Property="Padding" Value="{StaticResource DefaultControlPadding}"/>
    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    <Setter Property="ScrollViewer.PanningMode" Value="VerticalFirst"/>
    <Setter Property="Stylus.IsFlicksEnabled" Value="False"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type TextBox}">
                <ScrollViewer x:Name="PART_ContentHost" Background="Transparent" Focusable="false" ScrollViewer.HorizontalScrollBarVisibility="Hidden" Padding="{TemplateBinding Padding}" ScrollViewer.VerticalScrollBarVisibility="Hidden"/>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
<ControlTemplate x:Key="ComboBoxEditableTemplate" TargetType="{x:Type ComboBox}">
    <Grid x:Name="templateRoot" SnapsToDevicePixels="true">
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition Width="30"/>
        </Grid.ColumnDefinitions>
        <Popup x:Name="PART_Popup" AllowsTransparency="true" Grid.ColumnSpan="2" IsOpen="{Binding IsDropDownOpen, RelativeSource={RelativeSource Mode=TemplatedParent}}" Placement="Bottom" PopupAnimation="{StaticResource {x:Static SystemParameters.ComboBoxPopupAnimationKey}}" PlacementTarget="{Binding ElementName=toggleButton}">
            <Decorator Margin="8 0">
                <Border x:Name="dropDownBorder" Background="{DynamicResource RegionBrush}" BorderBrush="{DynamicResource BorderBrush}" BorderThickness="0,1,0,0" CornerRadius="{Binding (hc:BorderElement.CornerRadius), RelativeSource={RelativeSource Mode=TemplatedParent}}" Effect="{StaticResource EffectShadow2}" Margin="0,0,0,8" MinWidth="{Binding ActualWidth, ElementName=toggleButton}" MaxHeight="{TemplateBinding MaxDropDownHeight}">
                    <hc:ToggleBlock HorizontalContentAlignment="Stretch" IsChecked="{Binding HasItems, Mode=OneWay, RelativeSource={RelativeSource Mode=TemplatedParent}}" VerticalContentAlignment="Stretch">
                        <hc:ToggleBlock.CheckedContent>
                            <ScrollViewer Margin="2">
                                <ItemsPresenter x:Name="ItemsPresenter" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                            </ScrollViewer>
                        </hc:ToggleBlock.CheckedContent>
                        <hc:ToggleBlock.UnCheckedContent>
                            <hc:Empty/>
                        </hc:ToggleBlock.UnCheckedContent>
                    </hc:ToggleBlock>
                </Border>
            </Decorator>
        </Popup>
        <ToggleButton x:Name="toggleButton" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Grid.Column="0" Grid.ColumnSpan="2" IsChecked="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource Mode=TemplatedParent}}" Style="{StaticResource ComboBoxToggleButton}"/>
        <Border Grid.Column="0" Margin="-1,1">
            <TextBox x:Name="PART_EditableTextBox" Background="{TemplateBinding Background}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" IsReadOnly="{Binding IsReadOnly, RelativeSource={RelativeSource Mode=TemplatedParent}}" Padding="{TemplateBinding Padding}" Style="{StaticResource ComboBoxEditableTextBox}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
        </Border>
    </Grid>
    <ControlTemplate.Triggers>
        <Trigger Property="HasItems" Value="false">
            <Setter Property="Height" TargetName="dropDownBorder" Value="95"/>
        </Trigger>
        <Trigger Property="hc:DropDownElement.ConsistentWidth" Value="True">
            <Setter Property="MaxWidth" TargetName="dropDownBorder" Value="{Binding ActualWidth, ElementName=toggleButton}"/>
            <Setter Property="MinWidth" TargetName="dropDownBorder" Value="{Binding ActualWidth, ElementName=toggleButton}"/>
        </Trigger>
        <Trigger Property="hc:DropDownElement.AutoWidth" Value="True">
            <Setter Property="MaxWidth" TargetName="dropDownBorder" Value="{x:Static system:Double.MaxValue}"/>
            <Setter Property="MinWidth" TargetName="dropDownBorder" Value="{Binding ActualHeight, ElementName=toggleButton}"/>
        </Trigger>
        <MultiTrigger>
            <MultiTrigger.Conditions>
                <Condition Property="IsGrouping" Value="true"/>
                <Condition Property="VirtualizingPanel.IsVirtualizingWhenGrouping" Value="false"/>
            </MultiTrigger.Conditions>
            <Setter Property="ScrollViewer.CanContentScroll" Value="false"/>
        </MultiTrigger>
        <Trigger Property="IsMouseOver" SourceName="PART_EditableTextBox" Value="true">
            <Setter Property="BorderBrush" Value="{DynamicResource SecondaryBorderBrush}"/>
        </Trigger>
        <MultiTrigger>
            <MultiTrigger.Conditions>
                <Condition Property="IsMouseOver" SourceName="toggleButton" Value="true"/>
                <Condition Property="IsFocused" SourceName="PART_EditableTextBox" Value="false"/>
            </MultiTrigger.Conditions>
            <Setter Property="BorderBrush" Value="{DynamicResource SecondaryBorderBrush}"/>
        </MultiTrigger>
        <Trigger Property="IsFocused" SourceName="PART_EditableTextBox" Value="True">
            <Setter Property="BorderBrush" Value="{DynamicResource PrimaryBrush}"/>
        </Trigger>
        <Trigger Property="IsEnabled" Value="false">
            <Setter Property="Opacity" Value="0.4"/>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>
<Style x:Key="ComboBoxItemBaseStyle" TargetType="{x:Type ComboBoxItem}">
    <Setter Property="SnapsToDevicePixels" Value="True"/>
    <Setter Property="Padding" Value="{StaticResource DefaultControlPadding}"/>
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="BorderBrush" Value="Transparent"/>
    <Setter Property="BorderThickness" Value="0"/>
    <Setter Property="MinHeight" Value="{StaticResource DefaultControlHeight}"/>
    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ComboBoxItem}">
                <Border x:Name="Bd" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{Binding (hc:BorderElement.CornerRadius), RelativeSource={RelativeSource Mode=TemplatedParent}}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true">
                    <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                </Border>
                <ControlTemplate.Triggers>
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="IsSelected" Value="False"/>
                            <Condition Property="IsMouseOver" Value="True"/>
                        </MultiTrigger.Conditions>
                        <Setter Property="Background" TargetName="Bd" Value="#2B84FA"/>
                    </MultiTrigger>
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="IsSelected" Value="True"/>
                        </MultiTrigger.Conditions>
                        <Setter Property="Background" TargetName="Bd" Value="#2B84FA"/>
                        <Setter Property="Foreground" Value="White"/>
                    </MultiTrigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
<Style x:Key="ComboBoxStyleEx" TargetType="{x:Type ComboBox}">
    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    <Setter Property="Background" Value="{DynamicResource RegionBrush}"/>
    <Setter Property="ItemContainerStyle" Value="{StaticResource ComboBoxItemBaseStyle}"/>
    <Setter Property="hc:BorderElement.CornerRadius" Value="{StaticResource DefaultCornerRadius}"/>
    <Setter Property="BorderBrush" Value="{DynamicResource BorderBrush}"/>
    <Setter Property="Foreground" Value="{DynamicResource PrimaryTextBrush}"/>
    <Setter Property="BorderThickness" Value="1"/>
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
    <Setter Property="MinHeight" Value="{StaticResource DefaultControlHeight}"/>
    <Setter Property="ScrollViewer.CanContentScroll" Value="true"/>
    <Setter Property="ScrollViewer.PanningMode" Value="Both"/>
    <Setter Property="Stylus.IsFlicksEnabled" Value="False"/>
    <Setter Property="Padding" Value="{StaticResource DefaultInputPadding}"/>
    <Setter Property="hc:TitleElement.MarginOnTheLeft" Value="0,8,6,8"/>
    <Setter Property="Template" Value="{StaticResource ComboBoxTemplate}"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="Validation.ErrorTemplate" Value="{x:Null}"/>
    <Style.Triggers>
        <Trigger Property="IsEditable" Value="true">
            <Setter Property="IsTabStop" Value="false"/>
            <Setter Property="Template" Value="{StaticResource ComboBoxEditableTemplate}"/>
        </Trigger>
    </Style.Triggers>
</Style>

引用

                <ComboBox Style="{DynamicResource ComboBoxStyleEx}" Background="#2D3036" Foreground="White"  ItemsSource="{Binding DeviceList}" SelectedItem="{Binding SelectDevice}"/>

posted @ 2025-03-02 16:00  Hey,Coder!  阅读(25)  评论(0编辑  收藏  举报