Custom Shaped Button : Button Style « Windows Presentation Foundation « VB.Net Tutorial






<Window x:Class="ControlTemplates.SimpleShapedButton"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Shaped Button" Height="510" Width="600">
  <Window.Resources>
    <ControlTemplate x:Key="ButtonTemplate" TargetType="{x:Type Button}" >      
        <Grid>          
          <Path Name="Border" Stroke="Red" StrokeThickness="2" Stretch="Fill">
            <Path.Fill>            
                <RadialGradientBrush RadiusX="1" RadiusY="1" GradientOrigin="0.7,0.3" >
                  <GradientStop Color="Red" Offset="0" />
                  <GradientStop Color="Blue" Offset="1" />
                </RadialGradientBrush>            
            </Path.Fill>
            <Path.Data>
              <CombinedGeometry GeometryCombineMode="Union">
                <CombinedGeometry.Geometry1>                  
                  <EllipseGeometry Center="70 20" RadiusX="50" RadiusY="25"></EllipseGeometry>
                </CombinedGeometry.Geometry1>
                <CombinedGeometry.Geometry2>
                  <RectangleGeometry Rect="100 0 150 30"></RectangleGeometry>                  
                </CombinedGeometry.Geometry2>                
              </CombinedGeometry>
            </Path.Data>
          </Path>
        <Rectangle Name="FocusCue" Visibility="Hidden" Stroke="Black" StrokeThickness="1" StrokeDashArray="1 2" SnapsToDevicePixels="True" ></Rectangle>
          <Border Margin="5,10,5,10">
            <ContentPresenter  Name="Content" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" TextBlock.Foreground="White"></ContentPresenter>
          </Border>
        </Grid>
      <ControlTemplate.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
          <Setter TargetName="Border" Property="Fill" Value="DarkRed" />
        </Trigger>                
        <Trigger Property="IsPressed" Value="True">
          <Setter TargetName="Border" Property="Fill" Value="IndianRed" />
          <Setter TargetName="Border" Property="Stroke" Value="DarkKhaki" />
        </Trigger>
        <Trigger Property="IsKeyboardFocused" Value="True">
          <Setter TargetName="FocusCue" Property="Visibility" Value="Visible"></Setter>
        </Trigger>
        <Trigger Property="IsEnabled" Value="False">
          <Setter TargetName="Content" Property="TextBlock.Foreground" Value="Gray"></Setter>
          <Setter TargetName="Border" Property="Fill" Value="MistyRose"></Setter>
        </Trigger>
      </ControlTemplate.Triggers>
    </ControlTemplate>
  </Window.Resources>
  <StackPanel Width="150" HorizontalAlignment="Left">
    <Button Template="{StaticResource ButtonTemplate}" Click="Clicked" Name="cmdOne">A Simple Button
    </Button>
     <Button Template="{StaticResource ButtonTemplate}" IsEnabled="False" Click="Clicked" Name="cmdFour">
      <StackPanel>
        <Label>sfsdfsf</Label>
      </StackPanel>
      
    </Button>
  </StackPanel>
</Window>

//File:Window.xaml.vb
Imports System
Imports System.Collections.Generic
Imports System.Text
Imports System.Windows
Imports System.Windows.Controls
Imports System.Windows.Data
Imports System.Windows.Documents
Imports System.Windows.Input
Imports System.Windows.Media
Imports System.Windows.Media.Imaging
Imports System.Windows.Shapes

Namespace ControlTemplates
  Public Partial Class SimpleShapedButton
    Inherits System.Windows.Window
    Public Sub New()
      InitializeComponent()
    End Sub
    Private Sub Clicked(sender As Object, e As RoutedEventArgs)
      MessageBox.Show("You clicked " & DirectCast(sender, Button).Name)
    End Sub
  End Class
End Namespace
WPF Custom Shaped Button








16.8.Button Style
16.8.1.Button.Background and DrawingBrushButton.Background and DrawingBrush
16.8.2.Button with Semi-Transparent imageButton with Semi-Transparent image
16.8.3.Set Width for ButtonSet Width for Button
16.8.4.Button HorizontalAlignmentButton HorizontalAlignment
16.8.5.Button PaddingButton Padding
16.8.6.Button MarginButton Margin
16.8.7.Button Padding and HorizontalAlignmentButton Padding and HorizontalAlignment
16.8.8.Button HorizontalAlignment: StretchButton HorizontalAlignment: Stretch
16.8.9.Set BlurBitmapEffect for ButtonSet BlurBitmapEffect for Button
16.8.10.Set Padding for ButtonSet Padding for Button
16.8.11.Set Margin for ButtonSet Margin for Button
16.8.12.Fisheye Effect for ButtonFisheye Effect for Button
16.8.13.Custom Shaped ButtonCustom Shaped Button
16.8.14.Scale TransformScale Transform
16.8.15.Scale Transformate a ButtonScale Transformate a Button
16.8.16.Setting FontSize for ButtonSetting FontSize for Button