选中时更改切换按钮的背景颜色 [英] changing background color of togglebutton when checked

查看:40
本文介绍了选中时更改切换按钮的背景颜色的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试区分单击时切换按钮的状态.我有下面的片段

I am trying the distinguish the state of the toggle button when clicked. I have the snippet below

<Window x:Class="WpfApplication2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <Style x:Key="OnOffToggleImageStyle" TargetType="ToggleButton">
            <Style.Triggers>
                <Trigger Property="IsChecked" Value="True">
                    <Setter Property="Background" Value="DimGray"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <Grid>
        <ToggleButton Height="60" Content="Text" Style="{StaticResource OnOffToggleImageStyle}">
        </ToggleButton>
    </Grid>
</Window>

但是,当样式中的 IsChecked 值设置为True"时,这不起作用.当设置为 false 时它会起作用.

However this does not work when IsChecked value is set to "True" in the style. When set to false it works.

我想知道为什么.任何答案!

I wonder why. Any answers!

推荐答案

在运行您的代码示例时,它的样式似乎与 ToggleButton 的 'chrome' 冲突(即按钮).

When running your code sample, it appears the style is conflicting with the 'chrome' of the ToggleButton (i.e. the original style of the button).

在这种情况下,覆盖 ToggleButton 的模板以按照您希望的方式运行可能会更好.一个丑陋的例子可以在下面找到:

It would probably be better in this situation to override the template of the ToggleButton to behave in the manner you desire. An ugly example can be found below:

<Style x:Key="myToggleButton" TargetType="{x:Type ToggleButton}">
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate>
        <Border x:Name="outer"
        BorderBrush="White"
        BorderThickness="2"
        Opacity=".9"
        Background="Transparent">
          <Border x:Name="inner"
          Margin="8"
          BorderThickness="0"
          Background="{
            Binding Background, 
            RelativeSource={RelativeSource TemplatedParent}}">
            <Grid x:Name="container">
              <Grid.RowDefinitions>
                <RowDefinition Height="2*"/>
                <RowDefinition/>
              </Grid.RowDefinitions>
              <TextBlock x:Name="display"
              Grid.Row="1"
              Text="{Binding Content, RelativeSource={
                RelativeSource TemplatedParent}}"
              Foreground="White"
              FontSize="11"
              FontFamily="Segoe UI"
              FontStyle="Normal"
              FontWeight="Normal"
              Margin="8,0,0,4"
              HorizontalAlignment="Left"
              VerticalAlignment="Bottom"/>
            </Grid>
          </Border>
        </Border>
        <ControlTemplate.Triggers>
          <Trigger Property="ToggleButton.IsChecked" Value="True">
            <Setter TargetName="outer" Property="Background" Value="LightBlue"/>
            <Setter TargetName="outer" Property="BorderBrush" Value="Transparent"/>
          </Trigger>
        </ControlTemplate.Triggers>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

这篇关于选中时更改切换按钮的背景颜色的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆