WPF空心圆角combox

简介: WPF空心圆角combox

VS自带的控件总是觉得不够美观,而xaml语言提供了一个自己编写控件样式的可能性

效果图:

xaml代码:

<ComboBox.Resources>
                <Style  TargetType="{x:Type ComboBox}">
                    <Setter Property="Width" Value="120"/>
                    <Setter Property="HorizontalAlignment" Value="Stretch"/>
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type ComboBox}">
                                <Border  BorderBrush="White" BorderThickness="2" CornerRadius="22" Background="Transparent">
                                    <Grid>
                                        <!--下拉箭头-->
                                        <ToggleButton ClickMode="Press" Focusable="False" IsChecked="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" Margin="12" MinWidth="10" MinHeight="0" Width="Auto" Foreground="White">
                                            <ToggleButton.Style>
                                                <Style TargetType="{x:Type ToggleButton}">
                                                    <Setter Property="MinWidth" Value="0"/>
                                                    <Setter Property="MinHeight" Value="0"/>
                                                    <Setter Property="Width" Value="Auto"/>
                                                    <Setter Property="Height" Value="Auto"/>
                                                    <Setter Property="Background" Value="Transparent"/>
                                                    <Setter Property="BorderBrush" Value="#00000000"/>
                                                    <Setter Property="BorderThickness" Value="2"/>
                                                    <Setter Property="Template">
                                                        <Setter.Value>
                                                            <ControlTemplate TargetType="{x:Type ToggleButton}">
                                                                <DockPanel Background="{TemplateBinding Background}" LastChildFill="False" SnapsToDevicePixels="True">
                                                                    <Border x:Name="Border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"  DockPanel.Dock="Right" >
                                                                        <Path Data="M0,0L3.5,4 7,0z" Fill="{TemplateBinding Foreground}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                                                                    </Border>
                                                                </DockPanel>
                                                                <ControlTemplate.Triggers>
                                                                    <Trigger Property="IsChecked" Value="True"/>
                                                                </ControlTemplate.Triggers>
                                                            </ControlTemplate>
                                                        </Setter.Value>
                                                    </Setter>
                                                    <Style.Triggers>
                                                        <Trigger Property="IsEnabled" Value="False">
                                                            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}"/>
                                                        </Trigger>
                                                    </Style.Triggers>
                                                </Style>
                                            </ToggleButton.Style>
                                        </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="0,0,0,0" BorderBrush="White" HorizontalAlignment="Stretch" CornerRadius="0" Background="White"/>
                                                <ScrollViewer  SnapsToDevicePixels="True" HorizontalAlignment="Stretch" >
                                                    <StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained" HorizontalAlignment="Stretch" />
                                                </ScrollViewer>
                                            </Grid>
                                        </Popup>
                                    </Grid>
                                </Border>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </ComboBox.Resources>
            <ComboBox.Background>
                <LinearGradientBrush EndPoint="0,1" StartPoint="0,10">
                    <GradientStop Color="White" Offset="0"/>
                    <GradientStop Color="White" Offset="1"/>
                </LinearGradientBrush>
            </ComboBox.Background>
            <ComboBoxItem Content="管理员" Foreground="#FF505050" BorderThickness="0"/>
            <ComboBoxItem Content="操作员" Foreground="#FF505050" BorderThickness="0" BorderBrush="White" Background="White"/>
        </ComboBox>


相关文章
|
C#
WPF 创建无边框的圆角窗口
原文:WPF 创建无边框的圆角窗口 如题所述,在WPF中要创建一个没有边框且为圆角的窗体,有如下几步工作要进行: 第一步:去掉窗体默认样式的边框 首先将窗体的背景设为透明,将允许透明的属性设置为True,...
2718 0
|
C#
WPF 关于圆角的制作
原文:WPF 关于圆角的制作 1、使用Boder(一般情况): 设置CornerRadius属性   ...   2、创建ClippingBorder类: View Code using System; using System.
1409 0
|
C#
WPF 圆角textbox
原文:WPF 圆角textbox 版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/a771948524/article/details/9245965 ...
1281 0
|
C#
WPF圆角按钮与触发颜色变化
原文:WPF圆角按钮与触发颜色变化 ...
1599 0
|
C#
WPF 圆角输入框
原文:WPF 圆角输入框 今天打算来做一个圆角的输入框 默认输入框:   这个输入框不好看,并且在XP 跟 WIN 7  WIN10 效果 都不太一样   我们今天不用模板的方式,而是 最简单的方式 来实现 圆角 输入框;     ------------------------...
1379 0
|
C# 前端开发
[原译]WPF绘制圆角多边形
原文:[原译]WPF绘制圆角多边形 介绍 最近,我发现我需要个圆角多边形。而且是需要在运行时从用户界面来绘制。WPF有多边形。但是不支持圆角。我搜索了一下。也没找到可行的现成例子。于是就自己做吧。本文描述了圆角多边形的实现,也包括如何用在你的项目里。
1609 0
|
C#
WPF换肤之一:创建圆角窗体
原文:WPF换肤之一:创建圆角窗体     我们都期望自己的软件能够有一套看上去很吸引人眼球的外衣,使得别人看上去既专业又有美感。这个系列就带领着大家一步一步的讲解如何设计出一套自己的WPF的窗体皮肤,如果文中有任何错误或者不足,还请指出。
1405 0
|
7月前
|
C# 开发者 Windows
基于Material Design风格开源、易用、强大的WPF UI控件库
基于Material Design风格开源、易用、强大的WPF UI控件库
403 0
|
4月前
|
开发框架 缓存 前端开发
循序渐进介绍基于CommunityToolkit.Mvvm 和HandyControl的WPF应用端开发(11) -- 下拉列表的数据绑定以及自定义系统字典列表控件
循序渐进介绍基于CommunityToolkit.Mvvm 和HandyControl的WPF应用端开发(11) -- 下拉列表的数据绑定以及自定义系统字典列表控件