WPF 自定义ComboBox下拉颜色控件

WPF 自定义ComboBox下拉颜色控件
1.创建类

    public class DataItem
    {
        public DataItem()
        {

        }
        public string ColorName { get; set; }
        public DataItem(string itemName)
        {
            this.ColorName = itemName;
        }
    }

2.添加前端

                        <ComboBox Name="txtColor"  MinWidth="200" Height="30" SelectedValuePath="ColorName"  Margin="2" >
                            <ComboBox.ItemTemplate>
                                <DataTemplate>
                                    <StackPanel Orientation="Horizontal">
                                        <Rectangle Fill="{Binding ColorName}"  Width="30" Height="30"></Rectangle>
                                        <TextBlock Text="{Binding ColorName}"></TextBlock>
                                    </StackPanel>
                                </DataTemplate>
                            </ComboBox.ItemTemplate>
                        </ComboBox>

3.获取所有颜色名称

            var props = typeof(Brushes).GetProperties();

4.赋值给ComboBox

			List<DataItem> d1 = new List<DataItem>();
            foreach (var item in props)
            {
                d1.Add(new DataItem { Name = item.Name });
            }
            this.txtColor.ItemsSource = d1;

5.选中项的颜色

this.txtColor.SelectedValue.ToString();

6.字符串转换颜色类型

        BrushConverter brushConverter = new BrushConverter();
        Brush brush = (Brush)brushConverter.ConvertFromString("Red");
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
自定义 WPF ComboBox 的样式,步骤如下: 1. 创建一个新的 WPF 项目。 2. 在项目中打开 MainWindow.xaml 文件。 3. 在窗口中添加一个 ComboBox 控件。 4. 在 ComboBox 控件中添加一些项。 ```xml <ComboBox> <ComboBoxItem>Item 1</ComboBoxItem> <ComboBoxItem>Item 2</ComboBoxItem> <ComboBoxItem>Item 3</ComboBoxItem> </ComboBox> ``` 5. 现在我们将使用模板来自定义 ComboBox 的样式。右键单击 ComboBox 控件,选择“编辑模板”->“编辑复制的模板”->“创建”。 6. 在“对象和时间线”窗口中,找到名为“ComboBox”的控件模板。 7. 在模板中找到“Border”元素,并添加以下属性: ```xml <Border x:Name="border" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="3"> ``` 8. 在“ToggleButton”元素中添加以下属性: ```xml <ToggleButton x:Name="toggleButton" Grid.Column="2" Focusable="false" IsChecked="{Binding Path=IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" Template="{StaticResource ComboBoxToggleButton}"/> ``` 这将在 ComboBox 上添加一个箭头按钮。 9. 在“Popup”元素中添加以下属性,以更改下拉列表的背景颜色: ```xml <Popup x:Name="popup" Placement="Bottom" IsOpen="{TemplateBinding IsDropDownOpen}" AllowsTransparency="True" Focusable="False" PopupAnimation="Slide"> <Grid x:Name="DropDown" SnapsToDevicePixels="True" MinWidth="{TemplateBinding ActualWidth}" MaxHeight="{TemplateBinding MaxDropDownHeight}"> <Border x:Name="DropDownBorder" Background="White" BorderThickness="1" BorderBrush="Black" CornerRadius="3"/> <ScrollViewer Margin="4,6,4,6" SnapsToDevicePixels="True"> <StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained"/> </ScrollViewer> </Grid> </Popup> ``` 10. 最后,添加以下样式到项目中: ```xml <Style x:Key="ComboBoxToggleButton" TargetType="{x:Type ToggleButton}"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type ToggleButton}"> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition/> <ColumnDefinition Width="20"/> </Grid.ColumnDefinitions> <Border x:Name="Border" Grid.ColumnSpan="2" CornerRadius="3" BorderThickness="1,1,1,1" Background="White" BorderBrush="Black"/> <Border Grid.Column="0" CornerRadius="3" Margin="1" Background="{TemplateBinding Background}" BorderThickness="0,0,0,0"/> <Path x:Name="Arrow" Grid.Column="1" HorizontalAlignment="Center" VerticalAlignment="Center" Data="M 0 0 L 4 4 L 8 0 Z" Fill="Black"/> </Grid> <ControlTemplate.Triggers> <Trigger Property="ToggleButton.IsChecked" Value="True"> <Setter TargetName="Border" Property="Background" Value="#FFC1E0FF"/> <Setter TargetName="Border" Property="BorderBrush" Value="#FFA5CBE2"/> <Setter TargetName="Arrow" Property="Fill" Value="#FF000000"/> </Trigger> <Trigger Property="UIElement.IsEnabled" Value="False"> <Setter TargetName="Border" Property="Background" Value="#FFF4F4F4"/> <Setter TargetName="Border" Property="BorderBrush" Value="#FFADB2B5"/> <Setter TargetName="Arrow" Property="Fill" Value="#FF808080"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> ``` 11.运行程序,现在你将看到一个美丽的自定义 ComboBox 样式。 希望这能帮助到你!

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

LcVong

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值