Posted By

heathbo on 09/28/13

Tagged

Versions (?)

Last Edited at 09/28/13 03:20am

Statistics

Viewed 167 times

Favorited by 0 user(s)

Related snippets

WPF Custom Styled Button

/ Published in: C#

This code gives you the ability to stylize the buttons background, and borders on events.

Highlighted TextExpand

Put this code in the XAML

<Window.Resources>
     <Style x:Key="RoundCorner" TargetType="Button">

<Setter Property="HorizontalContentAlignment" Value="Center"/>
            <Setter Property="VerticalContentAlignment" Value="Center"/>
            <Setter Property="Padding" Value="1"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Grid x:Name="grid">
                            <Border x:Name="border" CornerRadius="0,3,0,0" BorderBrush="#FF114EAF" BorderThickness="1">
                                <Border.Background>
                                    <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
                                        <GradientStop Color="#FF88A6D7" Offset="0"/>
                                        <GradientStop Color="#FFEBEBEB" Offset="0.5"/>
                                        <GradientStop Color="#FF1853B1" Offset="0.5"/>
                                        <GradientStop Color="#FF779AD1" Offset="1"/>
                                        <GradientStop Color="#FF4977C2" Offset="0.498"/>
                                    </LinearGradientBrush>
                                </Border.Background>
                                <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" TextElement.FontWeight="Bold"></ContentPresenter>
                            </Border>
                        </Grid>
                        <ControlTemplate.Triggers>                            
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Background" TargetName="border">
                                    <Setter.Value>
                                        <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
                                            <GradientStop Color="#FF98B2DC" Offset="0"/>
                                            <GradientStop Color="#FF245CB5" Offset="0.528"/>
                                            <GradientStop Color="#FFCAD7ED" Offset="1"/>
                                            <GradientStop Color="#FF7095CF" Offset="0.442"/>
                                            <GradientStop Color="#FF4272BF" Offset="0.487"/>
                                        </LinearGradientBrush>
                                    </Setter.Value>
                                </Setter>
                            </Trigger>

<Trigger Property="IsPressed" Value="True">
                                <Setter Property="Background" TargetName="border">
                                    <Setter.Value>
                                        <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
                                            <GradientStop Color="#FF88A6D7" Offset="0"/>
                                            <GradientStop Color="#FFEBEBEB" Offset="0.5"/>
                                            <GradientStop Color="#FF1853B1" Offset="0.5"/>
                                            <GradientStop Color="#FF779AD1" Offset="1"/>
                                            <GradientStop Color="#FF4977C2" Offset="0.498"/>
                                        </LinearGradientBrush>
                                    </Setter.Value>
                                </Setter>
                            </Trigger>

<Trigger Property="IsEnabled" Value="False">
                                <Setter Property="Opacity" TargetName="grid" Value="0.25"/>
                            </Trigger>
                            
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>

<Button Style="{StaticResource RoundCorner}"/>

Report this snippet Tweet

Comments

Subscribe to comments

Comment:

You need to login to post a comment.