WPF下拉列表自定义样式

WPF中国自定义Combobox样式

<Window x:Class="ComboBoxDemo.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:local="clr-namespace:ComboBoxDemo"
    mc:Ignorable="d"
    Title="MainWindow" Height="350" Width="525">
<Window.Resources>
    <!--下拉列表中ToggleButton-->
    <Style TargetType="ToggleButton" x:Key="stlToggleButton">
        <Setter Property="Foreground" Value="White"></Setter>
        <Setter Property="Template" >
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ToggleButton}">
                    <Grid>
                        <Border Width="20" Height="25" HorizontalAlignment="Right" BorderBrush="White" BorderThickness="0.7,0.5,0,0.5">
                            <Border.Background>
                                <SolidColorBrush Color="LightGray"/>
                            </Border.Background>
                            <Path Data="M0,0L3.5,4 7,0z" Fill="Black" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                        </Border>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <!--ComboBoxStyle-->
    <Style TargetType="{x:Type ComboBox}">
        <Setter Property="SnapsToDevicePixels" Value="True"/>
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
        <Setter Property="ScrollViewer.CanContentScroll" Value="True"/>
        <Setter Property="HorizontalAlignment" Value="Stretch"></Setter>
        <Setter Property="Foreground" Value="Black"></Setter>
        <Setter Property="Height" Value="25"></Setter>
        <Setter Property="Margin" Value="2,5,2,5"></Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ComboBox}">
                    <Border  BorderBrush="WhiteSmoke" BorderThickness="1" Background="White">
                        <Grid>
                            <!--下拉箭头-->
                            <ToggleButton   Style="{StaticResource stlToggleButton}" Focusable="False" 
                                            IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}"
                                            ClickMode="Press">
                            </ToggleButton>
                            <!--项内容-->
                            <ContentPresenter  IsHitTestVisible="False" Content="{TemplateBinding SelectionBoxItem}" 
                                               ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" 
                                               ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}" 
                                               VerticalAlignment="Center" Margin="3" HorizontalAlignment="Stretch" />
                            <TextBox x:Name="PART_EditableTextBox" HorizontalAlignment="Stretch" Focusable="True" Visibility="Collapsed" IsReadOnly="False"/>
                            <!--下拉显示面板HorizontalOffset:设置下拉面板的相对位置-->
                            <Popup HorizontalOffset="-1" Width="{TemplateBinding ActualWidth}"  IsOpen="{TemplateBinding IsDropDownOpen}" Focusable="False"    PopupAnimation="Slide">
                                <Grid  SnapsToDevicePixels="True" HorizontalAlignment="Stretch"   >
                                    <Border  BorderThickness="1,1,1,1" BorderBrush="White" HorizontalAlignment="Stretch" >
                                        <Border.Background>
                                            <SolidColorBrush Color="White" />
                                        </Border.Background>
                                    </Border>
                                    <ScrollViewer  SnapsToDevicePixels="True" HorizontalAlignment="Stretch" >
                                        <StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained" HorizontalAlignment="Stretch" />
                                    </ScrollViewer>
                                </Grid>
                            </Popup>
                        </Grid>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <!--下拉列表项样式-->
    <Style TargetType="{x:Type ComboBoxItem}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate  TargetType="{x:Type ComboBoxItem}">
                    <Border x:Name="ItemBorder" Padding="2" Margin="1" HorizontalAlignment="Stretch">
                        <ContentPresenter HorizontalAlignment="Stretch"></ContentPresenter>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="Background" TargetName="ItemBorder" Value="SkyBlue"></Setter>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>
<Grid>
    <ComboBox Name="comboBox1" HorizontalAlignment="Left" Margin="60,60,0,0" VerticalAlignment="Top" Width="120"/>
</Grid>
</Window>

猜你喜欢

转载自blog.csdn.net/qq_43026206/article/details/84785737