Hochwertige (optisch ansprechende) WPF - Buttons

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67

<Window x:Class="NextGenButtons.Window2"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title=".Net-Snippets - NextGenButtons" Height="250" Width="350">

  <Window.Resources>
    <LinearGradientBrush x:Key="GridBackgroundBrush" StartPoint="0,0" EndPoint="0,1">
      <GradientStop Offset="0" Color="Black"/>
      <GradientStop Offset="0.7" Color="DimGray"/>
      <GradientStop Offset="1" Color="Gray"/>
    </LinearGradientBrush>
    
    <ControlTemplate x:Key="BlackButton" TargetType="{x:Type Button}">
      <Border BorderBrush="White" BorderThickness="1" CornerRadius="3">
        <Border BorderBrush="DarkGray" BorderThickness="1" CornerRadius="3">
          <Grid Name="ButtonGrid">
            <Rectangle Name="ButtonRect">
              <Rectangle.Fill>
                <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                  <GradientStop Offset="0" Color="Gray" />
                  <GradientStop Offset="0.49" Color="DimGray" />
                  <GradientStop Offset="0.5" Color="DimGray" />
                  <GradientStop Offset="1" Color="Black" />
                </LinearGradientBrush>
              </Rectangle.Fill>
            </Rectangle>
            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Width="Auto" />
          </Grid>
        </Border>
      </Border>
      <ControlTemplate.Triggers>
        <!-- Bei Mausbewegung über den Button ... -->
        <Trigger Property="IsMouseOver" Value="True">
          <!-- Buttonhintergrund heller darstellen -->
          <Setter Property="Fill" TargetName="ButtonRect">
            <Setter.Value>
              <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                <GradientStop Offset="0" Color="Silver" />
                <GradientStop Offset="1" Color="Black" />
              </LinearGradientBrush>
            </Setter.Value>
          </Setter>
          <!-- Leuchteffekt -->
          <Setter Property="BitmapEffect">
            <Setter.Value>
              <OuterGlowBitmapEffect GlowColor="White" GlowSize="5" />
            </Setter.Value>
          </Setter>
        </Trigger>
        <Trigger Property="IsPressed" Value="True">
          <Setter Property="Fill" TargetName="ButtonRect" Value="#FF000000" />
        </Trigger>
      </ControlTemplate.Triggers>
    </ControlTemplate>
  </Window.Resources>

  <Grid Background="{StaticResource GridBackgroundBrush}">
    <Button Name="btn1" Content="Einfacher Button" Margin="0,50,0,0" Width="110" Height="30"
            HorizontalAlignment="Center" VerticalAlignment="Top" />

    <Button Name="btn2" Content="NextGen Button" Margin="0,110,0,0" Width="110" Height="30"
            HorizontalAlignment="Center" VerticalAlignment="Top" Foreground="White"
            Template="{DynamicResource BlackButton}"/>
  </Grid>

</Window>