WPF界面设计RadioButton选中如何设置整个控件背景变色，Background只改变圆圈

qq_42254981 2020-02-02 01:25:15

现在是点击后只更改圆圈里面的颜色，如何更改整个控件背景色？
下面是我写的触发器和 界面代码


 <Page.Resources>

        <Style x:Key="Rbt_1" TargetType="RadioButton">

            <Style.Triggers>

                <Trigger Property="IsChecked" Value="True">

                    <Setter Property="Background" Value="Aqua"></Setter>

                </Trigger>

            </Style.Triggers>

        </Style>

    </Page.Resources>






<Grid>

        <Grid.ColumnDefinitions>

            <ColumnDefinition Width="200"></ColumnDefinition>

            <ColumnDefinition></ColumnDefinition>

        </Grid.ColumnDefinitions>

        <Grid Column="0"  Background="White">

            <StackPanel>

                <RadioButton  MinHeight="40" VerticalContentAlignment="Center" Style="{StaticResource Rbt_1 }">

                    <StackPanel Orientation="Horizontal">

                        <TextBlock Text="星星" FontSize="20" VerticalAlignment="Center"></TextBlock>

                        <TextBlock Text="测试1" FontSize="20" VerticalAlignment="Center" Margin="5,0,0,0"></TextBlock>

                    </StackPanel>

                </RadioButton>

                <RadioButton MinHeight="40" VerticalContentAlignment="Center" Style="{StaticResource Rbt_1 }">

                    <StackPanel Orientation="Horizontal" VerticalAlignment="Center" HorizontalAlignment="Center" >

                        <TextBlock Text="三角" FontSize="20" VerticalAlignment="Center" HorizontalAlignment="Center"></TextBlock>

                        <TextBlock Text="测试2" FontSize="20" Margin="5,0,0,0" VerticalAlignment="Center" HorizontalAlignment="Center"></TextBlock>

                    </StackPanel>

                </RadioButton>

            </StackPanel>



        </Grid>

    </Grid>
...全文
1438 5 打赏 收藏 转发到动态 举报
AI 作业
写回复
用AI写文章
5 条回复
切换为时间正序
请发表友善的回复…
发表回复
github_36000833 2020-02-04
  • 打赏
  • 举报
 回复
引用 4 楼 qq_42254981 的回复:
... 再询问下您，如果我想给图标和文字设置 不一样的颜色，如果还是用TemplateBinding 把Foreground开放出来，那么修改一个会同时两个都会改动。请教下有更好方法吗？ ...
Foreground是依赖属性，也就是说如果没有显性设置，它会使用‘父控件’的设置。 你的代码出错在于<TextBlock Name="TB1">'继承了'RadioButtong的Foreground设置。 解决方法就是隔断’继承‘： <TextBlock Text="{TemplateBinding Tag}" FontSize="20" VerticalAlignment="Center" Background="Black" /> <ContentPresenter VerticalAlignment="Center" TextBlock.FontSize="20" Margin="5,0,0,0" /> <!-- 无需设置TextBlock.Background--!>
qq_42254981 2020-02-03
  • 打赏
  • 举报
 回复
引用 3 楼 github_36000833 的回复:
你要自定义RadioButton的展示，即它的模板Template。 ControlTemplate的Trigger允许你设置模板下的元素，包括它的背景，比如： 

    <Style x:Key="Rbt_1" TargetType="RadioButton">
      <Setter Property="Template">
        <Setter.Value>
          <ControlTemplate TargetType="RadioButton">
            <StackPanel x:Name="frame" Orientation="Horizontal" Background="Transparent">
              <Image x:Name="tick" Width="24" Height="24" Margin="2" Visibility="Hidden" Source="https://icon-library.net/images/small-check-mark-icon/small-check-mark-icon-0.jpg" />
              <TextBlock Text="{TemplateBinding Tag}" FontSize="20" VerticalAlignment="Center" />
              <ContentPresenter VerticalAlignment="Center" TextBlock.FontSize="20" Margin="5,0,0,0" />
            </StackPanel>
            <ControlTemplate.Triggers>
              <Trigger Property="IsChecked" Value="true" >
                <Setter TargetName="frame" Property="Background" Value="Aqua" />
                <Setter TargetName="tick" Property="Visibility" Value="Visible" />
              </Trigger>
            </ControlTemplate.Triggers>
          </ControlTemplate>
        </Setter.Value>
      </Setter>
      <Setter Property="MinHeight" Value="40" />
      <Setter Property="VerticalAlignment" Value="Center" />
    </Style>
这样使用样式： 
    <Grid Column="0">
      <StackPanel>
        <RadioButton Style="{StaticResource Rbt_1 }" Tag="▲" Content="测试1" />
        <RadioButton Style="{StaticResource Rbt_1 }" Tag="☆"  Content="测试2" />
      </StackPanel>
    </Grid>
要模拟原生的RadioButton不是太容易，你可以参考微软的RadioButton styling话题： https://docs.microsoft.com/zh-cn/dotnet/framework/wpf/controls/radiobutton-styles-and-templates 另，不是很清楚你的实际需求，不过我怀疑自定义RadioButton不见得是你的最佳选择，比如展现多行数据用GridView更容易。

  <TextBlock Name="TB1" Text="{TemplateBinding  Tag}" FontSize="{TemplateBinding FontSize}" VerticalAlignment="Center"  Foreground="{TemplateBinding Foreground}"  />
   <ContentPresenter VerticalAlignment="Center" TextBlock.FontSize="{TemplateBinding FontSize}" Margin="5,0,0,0" TextBlock.Foreground="{TemplateBinding Foreground}" />
再询问下您，如果我想给图标和文字设置 不一样的颜色，如果还是用TemplateBinding 把Foreground开放出来，那么修改一个会同时两个都会改动。请教下有更好方法吗？ 

 <RadioButton Style="{StaticResource Rbt_1 }" Tag="▲" Content="测试1" FontSize="20" Foreground="Aqua" />
                <RadioButton Style="{StaticResource Rbt_1 }" Tag="☆"  Content="测试2" FontSize="20" Foreground="Red" />
github_36000833 2020-02-03
  • 打赏
  • 举报
 回复
你要自定义RadioButton的展示，即它的模板Template。 ControlTemplate的Trigger允许你设置模板下的元素，包括它的背景，比如： 

    <Style x:Key="Rbt_1" TargetType="RadioButton">
      <Setter Property="Template">
        <Setter.Value>
          <ControlTemplate TargetType="RadioButton">
            <StackPanel x:Name="frame" Orientation="Horizontal" Background="Transparent">
              <Image x:Name="tick" Width="24" Height="24" Margin="2" Visibility="Hidden" Source="https://icon-library.net/images/small-check-mark-icon/small-check-mark-icon-0.jpg" />
              <TextBlock Text="{TemplateBinding Tag}" FontSize="20" VerticalAlignment="Center" />
              <ContentPresenter VerticalAlignment="Center" TextBlock.FontSize="20" Margin="5,0,0,0" />
            </StackPanel>
            <ControlTemplate.Triggers>
              <Trigger Property="IsChecked" Value="true" >
                <Setter TargetName="frame" Property="Background" Value="Aqua" />
                <Setter TargetName="tick" Property="Visibility" Value="Visible" />
              </Trigger>
            </ControlTemplate.Triggers>
          </ControlTemplate>
        </Setter.Value>
      </Setter>
      <Setter Property="MinHeight" Value="40" />
      <Setter Property="VerticalAlignment" Value="Center" />
    </Style>
这样使用样式： 
    <Grid Column="0">
      <StackPanel>
        <RadioButton Style="{StaticResource Rbt_1 }" Tag="▲" Content="测试1" />
        <RadioButton Style="{StaticResource Rbt_1 }" Tag="☆"  Content="测试2" />
      </StackPanel>
    </Grid>
要模拟原生的RadioButton不是太容易，你可以参考微软的RadioButton styling话题： https://docs.microsoft.com/zh-cn/dotnet/framework/wpf/controls/radiobutton-styles-and-templates 另，不是很清楚你的实际需求，不过我怀疑自定义RadioButton不见得是你的最佳选择，比如展现多行数据用GridView更容易。
qq_42254981 2020-02-02
  • 打赏
  • 举报
 回复
引用 1 楼 github_36000833 的回复:
RadioButton的样式，可以管理自己的样式，不管自己有多复杂。但是，它不应该伸手太长，出界管理不属于自己的样式。 正常的做法是，由你说的那个“整个控件”来管理自己的背景色。它可以选择绑定到某个数据，也可以绑定到选定的子控件上。 比如说，使用测试1的背景可以这样做： <Grid Column="0" Background="{Binding Background, Mode=OneWay, ElementName=测试1}"> <StackPanel> <RadioButton x:Name="测试1" MinHeight="40" VerticalContentAlignment="Center" Style="{StaticResource Rbt_1 }"> <StackPanel Orientation="Horizontal"> <TextBlock Text="星星" FontSize="20" VerticalAlignment="Center"></TextBlock> <TextBlock Text="测试1" FontSize="20" VerticalAlignment="Center" Margin="5,0,0,0"></TextBlock> </StackPanel> </RadioButton> <RadioButton MinHeight="40" VerticalContentAlignment="Center" Style="{StaticResource Rbt_1 }"> <StackPanel Orientation="Horizontal" VerticalAlignment="Center" HorizontalAlignment="Center" > <TextBlock Text="三角" FontSize="20" VerticalAlignment="Center" HorizontalAlignment="Center"></TextBlock> <TextBlock Text="测试2" FontSize="20" Margin="5,0,0,0" VerticalAlignment="Center" HorizontalAlignment="Center"></TextBlock> </StackPanel> </RadioButton> </StackPanel> </Grid>
可能是我表达不清，想要实现这样的功能，测试1里面的StackPanel是在RadioButton包含里面的。
github_36000833 2020-02-02
  • 打赏
  • 举报
 回复
RadioButton的样式，可以管理自己的样式，不管自己有多复杂。但是，它不应该伸手太长，出界管理不属于自己的样式。 正常的做法是，由你说的那个“整个控件”来管理自己的背景色。它可以选择绑定到某个数据，也可以绑定到选定的子控件上。 比如说，使用测试1的背景可以这样做： <Grid Column="0" Background="{Binding Background, Mode=OneWay, ElementName=测试1}"> <StackPanel> <RadioButton x:Name="测试1" MinHeight="40" VerticalContentAlignment="Center" Style="{StaticResource Rbt_1 }"> <StackPanel Orientation="Horizontal"> <TextBlock Text="星星" FontSize="20" VerticalAlignment="Center"></TextBlock> <TextBlock Text="测试1" FontSize="20" VerticalAlignment="Center" Margin="5,0,0,0"></TextBlock> </StackPanel> </RadioButton> <RadioButton MinHeight="40" VerticalContentAlignment="Center" Style="{StaticResource Rbt_1 }"> <StackPanel Orientation="Horizontal" VerticalAlignment="Center" HorizontalAlignment="Center" > <TextBlock Text="三角" FontSize="20" VerticalAlignment="Center" HorizontalAlignment="Center"></TextBlock> <TextBlock Text="测试2" FontSize="20" Margin="5,0,0,0" VerticalAlignment="Center" HorizontalAlignment="Center"></TextBlock> </StackPanel> </RadioButton> </StackPanel> </Grid>
C#WPF如何设置整个RadioButton选中控件背景变色界面设计
现在是点击后只更改圆圈里面的颜色，如何更改整个控件背景色？ 下面是我写的触发器和界面代码 <Page.Resources> <Style x:Key="Rbt_1" TargetType="RadioButton"> <Style.Triggers> <Trigger Prope...
WPF-控件简介
控件：能与用户交互的元素所有控件都继承自System.Windows.Control类，所以都具备以下几种能力设置控件内容对齐方式设置Tab键顺序支持绘制背景、前景和边框支持格式化文本内容的尺寸和字体。
QRadioButton样式设置（渐变）
文章目录前言一、先看效果二、样式表 前言 前段使用QRadioButton控件，发现修改样式之后，默认勾选的同心圆样式没了，变成实心圆了，网上搜索了一圈，发现大家都是贴图，然后自己研究了一下，使用渐变颜色可以实现这个效果，现在有空就记录一下 一、先看效果 废话不多说，先看效果 二、样式表 样式表示例如下，关键还是看渐变样式qradialgradient，渐变样式不理解的自己多拿几组数据测试一下看看效果； 根据需要自己调整颜色和白色圆环面积，如果勾选框变方了，尝试调整一下border-radius的大小
基于PLC的彩灯控制组态王报告.doc
基于PLC的彩灯控制组态王报告.doc
UC3842/3/4/5系列电流模式PWM控制器的应用笔记：低成本高效电源转换器设计
内容概要：本文档详细介绍了UC3842/3/4/5系列集成电路的应用，旨在解决电源设计中电气性能和成本之间的矛盾。UC3842系列是一种集成脉宽调制器(PWM)，专为低成本电流模式控制设计。文中阐述了电流模式控制的优势，如输入电压前馈特性、优秀的线路调节性能、简化的大信号动态响应和电流限制机制。此外，文档还涵盖了UC3842系列的具体功能，如欠压锁定(UVLO)、振荡器配置、最大占空比、电流检测与限制、误差放大器补偿、图腾柱输出、噪声抑制和同步技术。最后，提供了多个基于UC3842系列的实际电路设计案例，包括隔离反激式稳压器和推挽式DC-DC转换器。 适合人群：从事电源设计的技术人员，特别是对电流模式控制和PWM技术感兴趣的工程师。 使用场景及目标：①理解和掌握UC3842系列IC的工作原理和应用场景；②学习如何设计和优化基于电流模式控制的电源系统；③提高电源系统的性能指标，如效率、稳定性、响应速度等。 其他说明：文档不仅提供了理论和技术细节，还包括具体的设计实例和参数规格，有助于读者将理论应用于实际项目中。此外，文档强调了在设计过程中需要注意的常见问题和解决方案，如噪声抑制、同步技术和元件选择等。
C#

111,096

社区成员

642,554

社区内容

发帖
与我相关
我的任务
社区描述
.NET技术 C#
社区管理员
  • C#
  • AIGC Browser
  • by_封爱
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告

让您成为最强悍的C#开发者

试试用AI创作助手写篇文章吧

+ 用AI写文章