WPF切换按钮XAML样式
所以我有两个切换按钮,我试图结合-排序。所以第一个按钮根据它被检查的是真是假来切换图像,但是这个按钮周围有一个我无法摆脱的边框 第二个切换按钮没有边框,单击时不会闪烁,但也不会根据其状态更改图像 我想要的是两全其美。更改图像并去掉边框。我已经尝试了整整23种方法,但没有一种有效 以下是我正在使用的代码:WPF切换按钮XAML样式,wpf,xaml,togglebutton,wpf-style,Wpf,Xaml,Togglebutton,Wpf Style,所以我有两个切换按钮,我试图结合-排序。所以第一个按钮根据它被检查的是真是假来切换图像,但是这个按钮周围有一个我无法摆脱的边框 第二个切换按钮没有边框,单击时不会闪烁,但也不会根据其状态更改图像 我想要的是两全其美。更改图像并去掉边框。我已经尝试了整整23种方法,但没有一种有效 以下是我正在使用的代码: <ToggleButton x:Name="changeButBorderedBlinky" Margin="0,12,194,0" Width="82" Height="82" Back
<ToggleButton x:Name="changeButBorderedBlinky" Margin="0,12,194,0" Width="82" Height="82" Background="Transparent" Padding="-1" Focusable="false" VerticalAlignment="Top" HorizontalAlignment="Right">
<ToggleButton.Style>
<Style TargetType="{x:Type ToggleButton}">
<Setter Property="Content">
<Setter.Value>
<Border BorderThickness="0" >
<Image Source="images/buttonimages/back2.png" Stretch="Fill" />
</Border>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter Property="Content">
<Setter.Value>
<Border BorderThickness="0" >
<Image Source="images/buttonimages/back.png" Stretch="fill" />
</Border>
</Setter.Value>
</Setter>
</Trigger>
</Style.Triggers>
</Style>
</ToggleButton.Style>
</ToggleButton>
<ToggleButton x:Name="noChangeNoBorder" Margin="0,12,104,0" VerticalAlignment="Top" HorizontalAlignment="Right" Height="80" Width="80" >
<ToggleButton.Template>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<Border x:Name="border" >
<Image x:Name="img" Source="images/buttonimages/back2.png" />
</Border>
</ControlTemplate>
</ToggleButton.Template>
</ToggleButton>
谢谢你在这方面的帮助。它快把我逼疯了。尝试使用与第一个切换按钮相关的稍微修改过的XAML:
<ToggleButton x:Name="changeButBorderedBlinky"
Margin="0,12,194,0"
Width="82" Height="82"
Background="Transparent"
Padding="-1"
Focusable="false"
VerticalAlignment="Top" HorizontalAlignment="Right">
<ToggleButton.Style>
<Style TargetType="{x:Type ToggleButton}">
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="Content">
<Setter.Value>
<Image Source="images/buttonimages/back2.png" Stretch="Fill" />
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter Property="Content">
<Setter.Value>
<Image Source="images/buttonimages/back.png" Stretch="fill" />
</Setter.Value>
</Setter>
</Trigger>
</Style.Triggers>
</Style>
</ToggleButton.Style>
</ToggleButton>
您还可以尝试自定义其他属性,例如:
<Setter Property="Background" Value="#FF1F3B53"/>
<Setter Property="Foreground" Value="#FF000000"/>
<Setter Property="BorderBrush" Value="Transparent">
有关更多样式选项,请参阅:
希望这会有所帮助。在这两种情况下,您的定制选项都是无止境的。你有没有尝试过表情融合?它随附(可免费使用),并允许您以任何方式自定义任一控件 在这里,使用表达式混合、无闪烁、无边框、图像交换完成:
<ToggleButton x:Name="changeButBorderedBlinky" Margin="0,12,194,0" Width="82" Height="82" Background="Transparent" Padding="-1" Focusable="false" VerticalAlignment="Top" HorizontalAlignment="Right">
<ToggleButton.Template>
<ControlTemplate TargetType="{x:Type ButtonBase}">
<ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
<ControlTemplate.Triggers>
<Trigger Property="Button.IsDefaulted" Value="True"/>
<Trigger Property="IsMouseOver" Value="True"/>
<Trigger Property="IsPressed" Value="True"/>
<Trigger Property="ToggleButton.IsChecked" Value="True"/>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="#FF838383"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</ToggleButton.Template>
<ToggleButton.Style>
<Style TargetType="{x:Type ToggleButton}">
<Setter Property="Content">
<Setter.Value>
<Border BorderThickness="0" >
<Image Source="images/buttonimages/back2.png" Stretch="Fill" />
</Border>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter Property="Content">
<Setter.Value>
<Border BorderThickness="0" >
<Image Source="images/buttonimages/back.png" Stretch="fill" />
</Border>
</Setter.Value>
</Setter>
</Trigger>
</Style.Triggers>
</Style>
</ToggleButton.Style>
</ToggleButton>
Murven,太棒了。这很有效。我从来没有用过混合的。学习这一点的好资源是什么?我知道我可以用谷歌搜索,但如果有推荐的话,我宁愿从那里开始。Expression Blend是Visual Studio的姊妹工具。从2012版开始,它包括在内。您可以在VisualStudio中右键单击XAML文件,您将看到选项“在Blend中打开”,因为这是一个WYSIWYG环境,您只需四处探索即可轻松熟悉它。有关于如何在MSDN中执行动画和状态等特定操作的特定教程。还有一些教程网站,如Lynda.com和Pluralsight。你也可以在这里开始探索和提问,我如何知道哪个按钮被选中,哪个按钮不被选中?