开发者

Stylling Button in WPF

开发者 https://www.devze.com 2023-03-20 04:22 出处:网络
I have a style for button as per below code. <Style TargetType=\"Button\" x:Key=\"TransparentButton\">

I have a style for button as per below code.

<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>

I need to set the background of button

1.To gray as soon as “MouseUp“ event occurred.

2.And set it to Default(say white)as soon as Focus Of Button being changed or say Focus Being lost.

Is there any way to solve this using Trigger or EventTrigger??.


See One example for above code with image

Button with Above style.

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

Button will look as per below image after above style being applied.

Stylling Button in WPF


This can be done by using RadioButton instead of Button just have a look at this

<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>
0

精彩评论

暂无评论...
验证码 换一张
取 消