wpf 自定义RadioButton控件样式

时间:2022-09-14 09:03:21

实现的效果为:

wpf 自定义RadioButton控件样式

我感觉来自定义RadioButton样式和定义button空间的样式差不多,只是类型不同而已。

接下来分析一下样式代码:

<!--自定义单选按钮样式-->
        <Style TargetType="RadioButton">

<Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="RadioButton">
                        <Grid Width="100"
                              Height="22">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="30" />
                                <ColumnDefinition />
                            </Grid.ColumnDefinitions>
                            <Image Source="Images/radio01.png"  //这里的图片为灰色是的图片
                                   Width="12"
                                   Height="4"
                                   x:Name="radioImage"></Image>
                            <TextBlock  x:Name="radioContent"
                                Grid.Column="1"
                                        FontFamily="Microsoft YaHei"
                                        FontWeight="Bold"
                                        FontSize="12"
                                        VerticalAlignment="Center"
                                        Foreground="#FFFFFF"
                                        Text="{TemplateBinding Content}"></TextBlock> //这里让它显示的文本内容直接绑定到RadioButton的Content属性上
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsKeyboardFocused"  //当控件获取焦点时要执行的内容
                                     Value="true">
                                <Setter TargetName="radioImage"
                                        Property="Width"
                                        Value="22" />
                                <Setter TargetName="radioImage"
                                        Property="Height"
                                        Value="14" />
                                <Setter TargetName="radioImage"
                                        Property="Source"
                                        Value="Images/radio02.png" /> //这是当被选中时的黄色图片
                                <Setter TargetName="radioContent"
                                        Property="Foreground"
                                        Value="#F1DC21" />
                            </Trigger>
                            <Trigger Property="IsMouseOver"  //当鼠标放上去时要设置的内容
                                     Value="true">
                                <Setter TargetName="radioImage"
                                        Property="Width"
                                        Value="22" />
                                <Setter TargetName="radioImage"
                                        Property="Height"
                                        Value="14" />
                                <Setter TargetName="radioImage"
                                        Property="Source"
                                        Value="Images/radio02.png" />
                                <Setter TargetName="radioContent"
                                        Property="Foreground"
                                        Value="#F1DC21" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>

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

XAML中代码为:

<StackPanel Grid.Row="1" Orientation="Horizontal" Margin="50,0,0,0">
            <RadioButton Content="实景模式"  //在这里当给RadioButton的Content属性赋值时直接对应的就是样式中的radioContent
                         VerticalAlignment="Center"
                         Grid.Row="1"
                         Margin="3,0,0,7"
                          />
            <RadioButton Content="走线模式"
                         VerticalAlignment="Center"
                         Margin="3,0,0,7" />
            <RadioButton Content="拓扑模式"
                         VerticalAlignment="Center"
                         Margin="3,0,0,7"/>
        </StackPanel>

wpf 自定义RadioButton控件样式的更多相关文章

  1. WPF自定义分页控件&comma;样式自定义&comma;简单易用

    WPF自定义分页控件 做了许久伸手党,终于有机会贡献一波,搜索一下WPF分页控件,还是多,但是不太通用,主要就是样式问题,这个WPF很好解决,还有一个就是分页控件嘛,只关心几个数字的变动就行了,把页码 ...

  2. WPF 自定义TabControl控件样式

    一.前言 程序中经常会用到TabControl控件,默认的控件样式很普通.而且样式或功能不一定符合我们的要求.比如:我们需要TabControl的标题能够居中.或平均分布:或者我们希望TabContr ...

  3. WPF 自定义DataGrid控件样式

    内容转自https://www.cnblogs.com/xiaogangqq123/archive/2012/05/07/2487166.html 一.DataGrid基本样式(一) 小刚已经把Dat ...

  4. WPF 自定义TreeView控件样式,仿QQ联系人列表

    一.前言 TreeView控件在项目中使用比较频繁,普通的TreeView并不能满足我们的需求.因此我们需要滴对TreeView进行改造.下面的内容将介绍仿QQ联系人TreeView样式及TreeVi ...

  5. WPF Calendar 日历控件 样式自定义

    原文:WPF Calendar 日历控件 样式自定义 粗略的在代码上做了些注释 blend 生成出来的模版 有的时候 会生成 跟 vs ui界面不兼容的代码 会导致可视化设计界面 报错崩溃掉 但是确不 ...

  6. arcgis api for js共享干货系列之二自定义Navigation控件样式风格

    arcgis api for js默认的Navigation控件样式风格如下图: 这样的风格不能说不好,各有各的爱好,审美观,这里也不是重点,这里的重点是如何自定义一套自己喜欢的样式风格呢:自己自定义 ...

  7. arcgis api 3&period;x for js 共享干货系列之二自定义 Navigation 控件样式风格(附源码下载)

    0.内容概览 自定义 Navigation 控件样式风格 源码下载 1.内容讲解 arcgis api 3.x for js 默认的Navigation控件样式风格如下图:这样的风格不能说不好,各有各 ...

  8. WPF设置全局控件样式

    原文:WPF设置全局控件样式 方法: 在资源文件APP.XAML中添加如下资源 <Application x:Class="_360UI.App" xmlns="h ...

  9. WPF 自定义Button控件及样式

    这次通过最近做的小例子说明一下自定义Button控件和样式. 实现的效果为:

随机推荐

  1. 登录时的&quot&semi;记住我&quot&semi;

    当我们在做各个系统的登录界面时,喜欢在加上一个功能就是“记住我”, 我用js来实现一下看看 function SetCookie(name, value, expires, path, domain, ...

  2. c 语言结构体的三种定义方式

    struct 结构体名{   成员列表:   ..... }结构体变量: 结构体类型变量的定义 结构体类型变量的定义与其它类型的变量的定义是一样的,但由于结构体类型需要针对问题事先自行定义,所以结构体 ...

  3. uva 10652 Board Wrapping

    主要是凸包的应用: #include <cstdio> #include <cmath> #include <cstring> #include <algor ...

  4. &lbrack;基础&rsqb; Loss function(一)

    Loss function = Loss term(误差项) + Regularization term(正则项),我们先来研究误差项:首先,所谓误差项,当然是误差的越少越好,由于不存在负误差,所以为 ...

  5. angularjs——module

    1.创建module //第一个参数是模块的名称 var head=angular.module('headApp',[]); head.controller("User",[&q ...

  6. 同步linux服务器的时间

    1:看系统时间的时候发现有点儿误差,大概在2分钟左右. 于是想自动同步系统的时间. 2:找到ntpdate命令,没有就安装.debian(apt-get install ntpdate) 3:获取时间 ...

  7. MapReduce 规划 六系列 MultipleOutputs采用

    在前面的示例,输出文件名是默认: _logs part-r-00001 part-r-00003 part-r-00005 part-r-00007 part-r-00009 part-r-00011 ...

  8. 使用Numpy将数据集中的data和target同时shuffle

    假设现在有图像数据imgs和对应标签targets.数据维度分别如下 imgs.shape = (num, channel, width, height) targets.shape = (num, ...

  9. A start job is running for Raise network interface(5min 13s )问题解决方法

    命令:sudo vim /etc/systemd/system/network-online.target.wants/networking.service将里面的TimeoutStartSec=5m ...

  10. Pytoch 抽取中间层特征方法

    定义一个特征提取的类: 参考pytorch论坛:How to extract features of an image from a trained model from torchvision.mo ...