WPF 中的样式按钮答案

【问题标题】：Stylling Button in WPFWPF 中的样式按钮
【发布时间】：2011-07-13 10:56:12
【问题描述】：

我有一个button 的样式，如下所示。

<Style TargetType="Button" x:Key="TransparentButton">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Border HorizontalAlignment="Center" x:Name="borderTemplate"
                        Background="Transparent">
                    <ContentPresenter/>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="true">
                        <Setter TargetName="borderTemplate"
                                Property="Border.BorderBrush" Value="Gray" />
                        <Setter TargetName="borderTemplate"
                                Property="Border.BorderThickness" Value="1" />
                    </Trigger>
                    <Trigger Property="IsPressed" Value="true">
                        <Setter TargetName="borderTemplate"
                                Property="Border.BorderBrush" Value="Lime" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

我需要设置button的background

1.在“MouseUp”事件发生时灰色。

2.一旦按钮焦点被更改或说焦点丢失，立即将其设置为默认（比如白色）。

有没有办法使用Trigger 或EventTrigger 解决这个问题？？

请参阅一个示例以了解上述带有图像的代码

上面样式的按钮。

 <Button Background="Black" Style="{StaticResource TransparentButton}"
         Content="0123456789" Height="15" HorizontalAlignment="Left"
         Name="button2" VerticalAlignment="Top" Margin="70,17,0,0" />

应用上述样式后，按钮将如下图所示。

【问题讨论】：

标签： wpf xaml styles

【解决方案1】：

这可以通过使用 RadioButton 而不是 Button 来完成看看这个

<Style x:Key="RadioButtonStyle1" TargetType="{x:Type RadioButton}">
    <Setter Property="Background" Value="#F4F4F4"/>
    <Setter Property="BorderBrush" Value="{StaticResource CheckBoxStroke}"/>
    <Setter Property="BorderThickness" Value="1"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type RadioButton}">
                 <Border  HorizontalAlignment="Center" x:Name="borderTemplate" Background="Transparent" VerticalAlignment="Center">
                            <ContentPresenter x:Name="contentPresenter" VerticalAlignment="Center"/>
                        </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Background" TargetName="borderTemplate" Value="#FFE4E4E4"/>
                        <Setter Property="HorizontalAlignment" TargetName="contentPresenter" Value="Center"/>
                    </Trigger>
                    <Trigger Property="IsChecked" Value="True">
                        <Setter Property="Background" TargetName="borderTemplate" Value="#FFA1A1A1"/>
                    </Trigger>
                    <Trigger Property="IsEnabled" Value="false">
                        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

<Grid x:Name="LayoutRoot">
    <StackPanel/>
    <RadioButton Content="RadioButton" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="116,86.04,0,0" Style="{StaticResource RadioButtonStyle1}"/>
    <RadioButton Content="RadioButton" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="116,106,0,0" Style="{StaticResource RadioButtonStyle1}"/>
</Grid>

【讨论】：

感谢您提供答案..我已经尝试过这段代码..但是它发生了什么......只要我按下鼠标按钮......它会设置Border到 Lime 和 Background 到 Gray....**应该是什么？？** 当 MouseUP 事件发生时，Background 应该是 Gray...谢谢.......
对于演示，您可以看到 SilverLight 的 DATA PAGER 控件......这里是DEMO..你可以在那里看到......导航到那篇文章中的演示部分......谢谢...... ....
我已经用 RadioButton 而不是 Button 样式更新了我的答案，请看一下
谢谢..回答.....但是在这里改变后会发生什么，所有按钮都变成Gray除了..选中一个........谢谢......
非常感谢您的回答...但是...我找不到 StaticResource CheckBoxStroke 我已将其设置为 .....虽然当鼠标按下按钮时边框没有改变...... .