WPF 控件 (九、Combox)

最新推荐文章于 2024-03-01 18:07:56 发布
最新推荐文章于 2024-03-01 18:07:56 发布
阅读量350 收藏 1
点赞数
文章标签： wpf ui c#
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/LyRics1996/article/details/130094360
版权

一、Style

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:theme="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero2">

    <Style TargetType="ToggleButton" x:Key="ComboBoxToggleButton">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ToggleButton">
                    
                        <Grid Width="{TemplateBinding Width}" Height="{TemplateBinding Height}" Margin="5">
                            <Path Data="{StaticResource UpGeometry}" x:Name="p1" Visibility="Collapsed" Fill="Black" Stretch="Uniform" Cursor="Hand"/>
                            <Path Data="{StaticResource DownGeometry}" x:Name="p2" Fill="Black" Stroke="Black" StrokeThickness="1" Stretch="Uniform" Cursor="Hand"/>
                        </Grid>
                   
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsChecked" Value="True">
                            <Setter Property="Visibility" Value="Collapsed" TargetName="p2"/>
                            <Setter Property="Visibility" Value="Visible" TargetName="p1"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Style x:Key="ComboBoxStyle1" TargetType="{x:Type ComboBox}">
        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.WindowTextBrushKey}}"/>
        <Setter Property="BorderBrush" Value="Black"/>
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
        <Setter Property="Padding" Value="6,3,5,3"/>
        <Setter Property="ScrollViewer.CanContentScroll" Value="true"/>
        <Setter Property="ScrollViewer.PanningMode" Value="Both"/>
        <Setter Property="Stylus.IsFlicksEnabled" Value="False"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ComboBox">
                    <Grid x:Name="templateRoot" SnapsToDevicePixels="true">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition MinWidth="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}" Width="0"/>
                        </Grid.ColumnDefinitions>
                        <Popup x:Name="PART_Popup" AllowsTransparency="true" Grid.ColumnSpan="2" IsOpen="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" Margin="1" Placement="Bottom" PopupAnimation="{DynamicResource {x:Static SystemParameters.ComboBoxPopupAnimationKey}}">
                            <theme:SystemDropShadowChrome x:Name="shadow" Color="Transparent" MinWidth="{Binding ActualWidth, ElementName=templateRoot}" MaxHeight="{TemplateBinding MaxDropDownHeight}">
                                <Border x:Name="dropDownBorder" Background="{DynamicResource {x:Static SystemColors.WindowBrushKey}}" BorderBrush="{TemplateBinding Background}" BorderThickness="1">
                                    <ScrollViewer x:Name="DropDownScrollViewer">
                                        <Grid x:Name="grid" RenderOptions.ClearTypeHint="Enabled">
                                            <Canvas x:Name="canvas" HorizontalAlignment="Left" Height="0" VerticalAlignment="Top" Width="0">
                                                <Rectangle x:Name="opaqueRect" Fill="{Binding Background, ElementName=dropDownBorder}" Height="{Binding ActualHeight, ElementName=dropDownBorder}" Width="{Binding ActualWidth, ElementName=dropDownBorder}"/>
                                            </Canvas>
                                            <ItemsPresenter x:Name="ItemsPresenter" KeyboardNavigation.DirectionalNavigation="Contained" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                                        </Grid>
                                    </ScrollViewer>
                                </Border>
                            </theme:SystemDropShadowChrome>
                        </Popup>
                        <ToggleButton x:Name="toggleButton" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Grid.ColumnSpan="2" IsChecked="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" Style="{StaticResource             ComboBoxToggleButton}"/>
                        <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}"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="ComboBoxReadonlyToggleButton" TargetType="ToggleButton">
        <Setter Property="IsTabStop" Value="false" />
        <Setter Property="ClickMode" Value="Press" />
        <Setter Property="MinHeight" Value="22"></Setter>
        <Setter Property="MinWidth" Value="80"></Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ToggleButton">
                    <Grid>
                        <Border x:Name="Background" BorderBrush="#787878"
                                BorderThickness="1"  Background="#198B53">
                            <Path x:Name="Path" Height="Auto" Margin="0,0.082,0,8.859" Width="Auto"
                                    Stretch="Fill" Stroke="{x:Null}" StrokeLineJoin="Round"
                                    StrokeThickness="1"
                                    Data="M0,3 C0,1.3431457 1.3431457,0 3,0 L129,0 C130.65686,0 132,1.3431457 132,3 L132,13.853975 C86.718803,0.055481441 26.160202,27.400364 0,11.585506 z">
                                <Path.Fill>
                                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                        <!--combox背景色#198B53-->
                                        <GradientStop Color="#198B53" Offset="0.113" />
                                        <GradientStop Color="#198B53" Offset="1" />
                                    </LinearGradientBrush>
                                </Path.Fill>
                            </Path>
                        </Border>
                        <!--倒三角的颜色#0099ff-->
                        <Path Height="10" x:Name="Path1" HorizontalAlignment="Right"
                                VerticalAlignment="Center" Margin="5,0,7,0" Width="10"
                                Fill="#0099ff" Stretch="Fill" Stroke="#0099ff"
                                Data="M0.5,0.5 L9.5,0.5 L5.0625,9.5 L5.0625,9.5 z" />
                    </Grid>

                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <!--移入时按钮颜色 图案颜色 背景颜色 锯齿颜色-->
                            <Setter TargetName="Path1" Property="Fill" Value="#198B53"></Setter>
                            <Setter TargetName="Background" Property="Background" Value="#198B53"></Setter>
                            <Setter TargetName="Background" Property="BorderBrush" Value="#198B53"></Setter>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="ComboBoxStyle2" TargetType="ComboBox">
        <Setter Property="Foreground" Value="#FFFFFFFF" />
        <Setter Property="Width" Value="100"></Setter>
        <Setter Property="Height" Value="30"></Setter>
        <Setter Property="VerticalAlignment" Value="Center"></Setter>
        <Setter Property="HorizontalContentAlignment" Value="Left"></Setter>
        <Setter Property="BorderBrush" Value="#FFFFFFFF" />
        <Setter Property="BorderThickness" Value="1" />
        <Setter Property="VerticalContentAlignment" Value="Center" />
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
        <Setter Property="Padding" Value="4,3" />
        <Setter Property="ItemContainerStyle">
            <Setter.Value>
                <!--这个是下拉框的属性设置-->
                <Style TargetType="ComboBoxItem">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="ComboBoxItem">
                                <Border Name="Back"  Background="#525252"  BorderThickness="0,0,0,0" BorderBrush="#525252" >
                                    <ContentPresenter ContentSource="{Binding Source}"  VerticalAlignment="Center" HorizontalAlignment="Left" Margin="10,0,0,0" ></ContentPresenter>
                                </Border>
                                <ControlTemplate.Triggers>
                                    <Trigger Property="IsMouseOver" Value="True">
                                        <Setter TargetName="Back" Property="Background" Value="#484848"></Setter>
                                    </Trigger>
                                    <!--下拉框背景色-->
                                    <Trigger Property="IsHighlighted" Value="True">
                                        <Setter TargetName="Back" Property="Background" Value="#3A99FF"></Setter>
                                    </Trigger>
                                </ControlTemplate.Triggers>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </Setter.Value>
        </Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ComboBox">
                    <Grid x:Name="MainGrid">
                        <Popup x:Name="PART_Popup" Margin="1" Grid.Row="1" 
                                IsOpen="{Binding Path=IsDropDownOpen, RelativeSource={RelativeSource TemplatedParent}}">
                            <Grid x:Name="Shdw" MaxHeight="{TemplateBinding MaxDropDownHeight}"
                                    MinWidth="{Binding Path=ActualWidth, ElementName=MainGrid}" >
                                <!--下拉框的属性设置-->
                                <!--Background -->
                                <Border x:Name="Bordertop"   Width="100" CornerRadius="0" BorderThickness="0"  Background="#525252">
                                    <Border.Effect>
                                        <DropShadowEffect Color="Black"  BlurRadius="2" ShadowDepth="0" Opacity="1"/>
                                    </Border.Effect>
                                    <ScrollViewer Width="150">
                                        <ItemsPresenter />
                                    </ScrollViewer>
                                </Border>
                            </Grid>
                        </Popup>
                        <ToggleButton Style="{StaticResource ComboBoxReadonlyToggleButton}"
                                BorderThickness="3" BorderBrush="#03ffea"   Background="{TemplateBinding Background}"
                                IsChecked="{Binding Path=IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" />
                        <!--combox字体的间距-->
                        <TextBlock Margin="10 0 0 0" 
                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                IsHitTestVisible="false"
                                Text="{TemplateBinding Text}"
                               />
                    </Grid>

                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

</ResourceDictionary>

二、Demo

 <WrapPanel>
     <StackPanel Orientation="Horizontal">
          <TextBlock Text="默认:"/>
          <ComboBox ItemsSource="{Binding UserNames}" SelectedIndex="0" Width="80" />
      </StackPanel>
      <StackPanel Orientation="Horizontal">
          <TextBlock Text="修改图标:"/>
          <ComboBox Style="{DynamicResource ComboBoxStyle1}" ItemsSource="{Binding UserNames}" SelectedIndex="0" Width="80" Height="20"/>
      </StackPanel>
      <StackPanel Orientation="Horizontal">
          <TextBlock Text="修改背景:"/>
          <ComboBox Style="{DynamicResource ComboBoxStyle2}" ItemsSource="{Binding UserNames}" SelectedIndex="0" Width="80" Height="20"/>
      </StackPanel>
  </WrapPanel>

三、效果

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

LyRics1996
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
WPF中带combox的listview简单使用
01-11
增加了combox的默认选中值的读取和显示。
WPF —— ComboBox控件详解
最新发布
lu2023_8_6的博客
03-12 1671
ItemsSource="{Binding}" 使用dataContext进行数据绑定时候 ，需要加上 也就是第二中添加下拉项的写法。ComboBox 是 ItemsControl ，这意味着它可以包含任何类型的对象的集合 (例如字符串、图像或面板)。表示带有下拉列表的选择控件，通过单击控件上的箭头可显示或隐藏下拉列表。// 大部分加ed都是过去式，代表...完成了，loaded:加载完成。// 大部分加un的 一般都是否定意思，unchecked:未选中。1 shiyongitems属性进行添加。
MultiSelectComboBox(一)
weixin_30648587的博客
11-18 702
1. MultiSelectComboBox.xaml <UserControl x:Class="MultiSelectComboBox.MultiSelectComboBox" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:...
wpf中ComBox控件的相关的绑定
Ru_Tesla的博客
01-03 551
SelectedValuePath: 字面意思是所选择值的路径，与SelectedValue是一对，他们俩成对使用，例如上图，id是list 对象里的一个属性，那么你选择了id这个属性，SelectedValue所绑定的值就是id的值，后台就能拿到header所在的这个对象里的id这个值，SelectIndex：显而易见指的是选择的索引，设置为0指的就是第一项，这个属性绑定到后台一般后台会获取这个属性的值去做其他逻辑操作，例如你选择了第一项，后台数据就可以知道你选择了第一个。
C# WPF如何自定义控件ComboBox
AI知识分享，技术知识分享
03-01 824
在WPF开发中，经常遇到需要修改原生ComboBox的控件样式。你可以利用如下代码模板，修改为你自己想要的样式。对于新手来说，修改控件样式比较麻烦。
WPF 简单的ComboBox自定义样式。
chulijun3107的博客
09-28 4525
ComboBox样式显示效果
WPF 中Combox的使用
热门推荐
sinat_31608641的博客
03-15 1万+
Combox继承于ItemsControl控件，它有自己的条目容器ComBoxItem，举个例子： &lt;ComboBox Height="21" &gt; &lt;ComboBoxItem&gt; &lt;TextBlock Text="HAHAHA"/&gt; &lt;/ComboBoxItem&gt; ...
22、wpf之Combobox使用小记
roujian0985的博客
07-22 8894
wpf combobox 中属性小记
WPF 控件专题 ComboBox 自定义样式
^@^lemon tea^@^
09-07 2973
WPF 控件专题 ComboBox 控件详解
WPF基于ComboBox实现（花里胡哨）搜索功能与占位符提示
qq_29881799的博客
05-10 2770
WPF实现可搜索的ComboBox，支持添加占位符/提示语，等等
WPF Combox+treeview以及 datagried+treeview控件
01-07
自定义WPF控件 Combox+treeview以及 datagried+treeview控件支持百万级别数据量，包含源码
WPF MulitCheckComboBox 多选下拉控件
06-23
项目中经常需要使用多选下拉交互的控件，于是自己封装了一个helper，用于选择状态的读取，当然还包括多选框样式，仅供参考学习
C# wpf combobox带treeview的自定义控件示例
03-16
摘要:C#源码,控件类库,treeview,combobox,自定义控件 C# wpf combobox带treeview的自定义控件示例源码，树控菜单和下拉框的自定义源码，希望对你有所帮助。 运行环境：Visual Studio2010
WPF 下拉列表框ComboBox扩展控件
04-26
对WPF的ComboBox进行了扩展，现在可以在下拉列表中嵌入DataGrid/ListView/ListBox等数据控件，实现了展开后列表的自动选择，自动滚屏，并完全支持数据的绑定操作
WPF ComboBox控件使用记录
weixin_48611710的博客
09-04 311
技巧：使用单向绑定级联CheckBox的IsChecked属性,现实自动关联勾选，也可以自主取消。达到勾选主键的CheckBox后自动关联子CheckBox选项，这样可以避免重复添加勾选操作，用于子选项默认继承主选项的需求，不勾选子选项为低频操作，提供良好用户体验。需求：下拉框选项带若干个勾选功能。
wpfcomboxmvvm
qq_40098572的博客
12-22 893
开始之前先了解一些基础知识: Combox DisplayMemberPath属性，这个属性就是用于界面显示的数据类型，可以将集合元素中的一个属性类型赋值给DisplayMemberPath属性。 SelectedValuePath属性，用于指定在集合元素中被选中的值的类型，对应的SelectedValue属性的值就是就是这个指定的类型的值。 触发器 CommandParameter 传参 ElementName 绑定元素的名称 上代码： 一、事件 public class Delete
wpf 自定义combox控件
cangqiongxiaoye的博客
02-10 1497
关键步骤 1、新建usercontrol使用基本的控件进行设计 2、依赖属性的定义，目的：外部调用时候能够使用属性进行控件样式的控制 例如 Width="200" DisplayMemberPath="Name" SelectedItem="{Binding SelectedItem,Mode=TwoWay}" SelectionChanged="{Binding ProjectSelectCommand}" CommandParameter="{Binding ElementName =
WPF下拉框回填
Zhuxxxxx的博客
11-28 692
这样一个下拉框的回填就成功了！
wpf 枚举类型 combox
06-10
在WPF中，我们可以使用ComboBox控件来显示枚举类型的值。以下是实现方法： 1. 定义一个枚举类型。 ``` public enum Gender { Male, Female, Unknown } ``` 2. 在XAML中定义ComboBox控件。 ``` ``` 3. 在代码...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值