WPF テンプレ
WPFのボタン用テンプレート3種。
<Window.Resources>
<ControlTemplate x:Key="BtnTmplElp1" TargetType="{x:Type Button}">
<Grid Loaded="BtnTmplElp1_Grid_Loaded">
<Ellipse RenderTransformOrigin="0.4 0.4">
<Ellipse.RenderTransform>
<TransformGroup>
<ScaleTransform ScaleX="1.05" ScaleY="1.05"/>
<TranslateTransform X="2" Y="2"/>
</TransformGroup>
</Ellipse.RenderTransform>
<Ellipse.Fill>
<RadialGradientBrush>
<GradientStop Color="Black" Offset="0.7"/>
<GradientStop Color="White" Offset="1"/>
</RadialGradientBrush>
</Ellipse.Fill>
</Ellipse>
<Grid x:Name="BtnTmplElp1Grid" RenderTransformOrigin="0.5,0.5">
<Grid.RenderTransform>
<TranslateTransform X="0" Y="0"/>
</Grid.RenderTransform>
<Ellipse>
<Ellipse.Fill>
<RadialGradientBrush GradientOrigin="0.5,0.7">
<GradientStop Color="#A0A0FF" Offset="0"/>
<GradientStop Color="#273367" Offset="1"/>
</RadialGradientBrush>
</Ellipse.Fill>
</Ellipse>
<Ellipse Margin="4 0 4 24">
<Ellipse.Fill>
<RadialGradientBrush GradientOrigin="0.5,0.36">
<GradientStop Color="#80FFFFFF" Offset="0.4"/>
<GradientStop Color="#1071AB5C" Offset="1"/>
<GradientStop Color="#FFFFFFFF" Offset="0"/>
</RadialGradientBrush>
</Ellipse.Fill>
</Ellipse>
<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True"
Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
</Grid>
</Grid>
<ControlTemplate.Resources>
<Storyboard x:Key="BtnTmplElp1OnPreviewMouseLeftButtonDown">
<DoubleAnimationUsingKeyFrames BeginTime="0:0:0" Storyboard.TargetName="BtnTmplElp1Grid" Storyboard.TargetProperty="RenderTransform.(TranslateTransform.X)">
<SplineDoubleKeyFrame KeyTime="0:0:0.1" Value="5"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames BeginTime="0:0:0" Storyboard.TargetName="BtnTmplElp1Grid" Storyboard.TargetProperty="RenderTransform.(TranslateTransform.Y)">
<SplineDoubleKeyFrame KeyTime="0:0:0.1" Value="5"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
<Storyboard x:Key="BtnTmplElp1OnPreviewMouseLeftButtonUp">
<DoubleAnimationUsingKeyFrames BeginTime="0:0:0" Storyboard.TargetName="BtnTmplElp1Grid" Storyboard.TargetProperty="RenderTransform.(TranslateTransform.X)">
<SplineDoubleKeyFrame KeyTime="0:0:0.1" Value="0"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames BeginTime="0:0:0" Storyboard.TargetName="BtnTmplElp1Grid" Storyboard.TargetProperty="RenderTransform.(TranslateTransform.Y)">
<SplineDoubleKeyFrame KeyTime="0:0:0.1" Value="0"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</ControlTemplate.Resources>
<ControlTemplate.Triggers>
<EventTrigger RoutedEvent="UIElement.PreviewMouseLeftButtonDown">
<BeginStoryboard Storyboard="{StaticResource BtnTmplElp1OnPreviewMouseLeftButtonDown}"/>
</EventTrigger>
<EventTrigger RoutedEvent="UIElement.PreviewMouseLeftButtonUp">
<BeginStoryboard Storyboard="{StaticResource BtnTmplElp1OnPreviewMouseLeftButtonUp}"/>
</EventTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
<x:Code>
<![CDATA[
private void BtnTmplElp1_Grid_Loaded(object sender, RoutedEventArgs e)
{
var gr = sender as Grid;
var gr2 = gr.Children[1] as Grid;
var btn = gr.TemplatedParent as Button;
var el1 = gr.Children[0] as Ellipse;
double d = Math.Min(gr.ActualWidth, gr.ActualHeight);
el1.Margin = new Thickness(0, 0, d / 20, 0);
var tg = (el1.RenderTransform as TransformGroup).CloneCurrentValue();
tg.Children[1] = new TranslateTransform(d / 12, d / 12);
el1.RenderTransform = tg;
var el2 = gr2.Children[0] as Ellipse;
var br = el2.Fill.CloneCurrentValue() as RadialGradientBrush;
Color c1 = ((SolidColorBrush)btn.Background).Color;
Color c2 = Color.FromRgb((byte)(c1.R / 2), (byte)(c1.G / 2), (byte)(c1.B / 2));
br.GradientStops[0] = new GradientStop(c1, 0);
br.GradientStops[1] = new GradientStop(c2, 1);
el2.Fill = br;
var el3 = gr2.Children[1] as Ellipse;
el3.Margin = new Thickness(d / 15, 0, d / 15, d * 0.4);
}
]]>
</x:Code>
<ControlTemplate x:Key="BtnTmplElp2" TargetType="{x:Type Button}">
<Grid Loaded="BtnTmplElp2_Grid_Loaded">
<Rectangle Stroke="#FF111E4D" RadiusX="40" RadiusY="40">
<Rectangle.Fill>
<RadialGradientBrush GradientOrigin="0.5,0.7">
<GradientStop Color="#FFB6D0FF" Offset="0"/>
<GradientStop Color="#FF6083dC" Offset="0.75"/>
<GradientStop Color="#FF0043BC" Offset="1"/>
</RadialGradientBrush>
</Rectangle.Fill>
</Rectangle>
<Rectangle RadiusX="40" RadiusY="40" Margin="25,7,25,0" Height="24" VerticalAlignment="Top">
<Rectangle.Fill>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#A0FFC0C0" Offset="0"/>
<GradientStop Color="#10FFFFFF" Offset="0.7"/>
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True"
Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
<Rectangle x:Name="BtnTmplElp2Rect" Fill="Black" Opacity="0"/>
</Grid>
<ControlTemplate.Resources>
<Storyboard x:Key="BtnTmplElp2OnPreviewMouseLeftButtonDown">
<DoubleAnimation Duration="00:00:00.1" Storyboard.TargetName="BtnTmplElp2Rect" Storyboard.TargetProperty="Opacity" To="0.2"/>
</Storyboard>
<Storyboard x:Key="BtnTmplElp2OnPreviewMouseLeftButtonUp">
<DoubleAnimation Duration="00:00:00.1" Storyboard.TargetName="BtnTmplElp2Rect" Storyboard.TargetProperty="Opacity" To="0"/>
</Storyboard>
</ControlTemplate.Resources>
<ControlTemplate.Triggers>
<EventTrigger RoutedEvent="UIElement.PreviewMouseLeftButtonDown">
<BeginStoryboard Storyboard="{StaticResource BtnTmplElp2OnPreviewMouseLeftButtonDown}"/>
</EventTrigger>
<EventTrigger RoutedEvent="UIElement.PreviewMouseLeftButtonUp">
<BeginStoryboard Storyboard="{StaticResource BtnTmplElp2OnPreviewMouseLeftButtonUp}"/>
</EventTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
<x:Code>
<![CDATA[
private void BtnTmplElp2_Grid_Loaded(object sender, RoutedEventArgs e)
{
var gr = sender as Grid;
double d = Math.Min(gr.ActualWidth, gr.ActualHeight);
var re1 = gr.Children[0] as Rectangle;
var re3 = gr.Children[3] as Rectangle;
re1.RadiusX = re1.RadiusY = re3.RadiusX = re3.RadiusY = d * 0.4;
var br1 = re1.Fill.CloneCurrentValue() as RadialGradientBrush;
var btn = gr.TemplatedParent as Button;
var sc = btn.Background as SolidColorBrush;
Color c1 = sc != null ? sc.Color : SystemColors.WindowFrameColor;
Color c2 = Color.FromRgb((byte)(c1.R * 0.75), (byte)(c1.G * 0.75), (byte)(c1.B * 0.75));
Color c3 = Color.FromRgb((byte)(c1.R * 0.5), (byte)(c1.G * 0.5), (byte)(c1.B * 0.5));
br1.GradientStops[0] = new GradientStop(c1, 0);
br1.GradientStops[1] = new GradientStop(c2, 0.7);
br1.GradientStops[2] = new GradientStop(c3, 1);
re1.Fill = br1;
var re2 = gr.Children[1] as Rectangle;
re2.RadiusX = re2.RadiusY = d * 0.4;
re2.Height = d * 0.24;
re2.Margin = new Thickness(d * 0.24, d * 0.08, d * 0.24, 0);
var br2 = re2.Fill.CloneCurrentValue() as LinearGradientBrush;
Color c4 = Color.FromArgb(160, (byte)(c1.R * 0.2 + 204), (byte)(c1.G * 0.2 + 204), (byte)(c1.B * 0.2 + 204));
br2.GradientStops[0] = new GradientStop(c4, 0);
br2.GradientStops[1] = new GradientStop(Color.FromArgb(16,255,255,255), 0.7);
}
]]>
</x:Code>
<ControlTemplate x:Key="BtnTmplElp3" TargetType="{x:Type Button}">
<Grid Loaded="BtnTmplElp3_Grid_Loaded">
<Ellipse Stroke="#FF2C3366">
<Ellipse.Fill>
<LinearGradientBrush EndPoint="0.909,-0.085" StartPoint="0.1,1">
<GradientStop Color="#F03D71CE" Offset="0.0"/>
<GradientStop Color="#F7CFD9EB" Offset="0.5"/>
<GradientStop Color="#FF0F3F97" Offset="1"/>
</LinearGradientBrush>
</Ellipse.Fill>
</Ellipse>
<Ellipse Margin="8,8,8,8">
<Ellipse.Fill>
<LinearGradientBrush EndPoint="0.3,1.5" StartPoint="0.7,-0.4">
<GradientStop Color="#F03D71CE" Offset="0.0"/>
<GradientStop Color="#F7CFD9EB" Offset="0.5"/>
<GradientStop Color="#FF0F3F97" Offset="1"/>
</LinearGradientBrush>
</Ellipse.Fill>
</Ellipse>
<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True"
Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
<Ellipse x:Name="BtnTmplElp3Elps" Fill="Black" Opacity="0"/>
</Grid>
<ControlTemplate.Resources>
<Storyboard x:Key="BtnTmplElp3OnPreviewMouseLeftButtonDown">
<DoubleAnimation Duration="00:00:00.1" Storyboard.TargetName="BtnTmplElp3Elps" Storyboard.TargetProperty="Opacity" To="0.2"/>
</Storyboard>
<Storyboard x:Key="BtnTmplElp3OnPreviewMouseLeftButtonUp">
<DoubleAnimation Duration="00:00:00.1" Storyboard.TargetName="BtnTmplElp3Elps" Storyboard.TargetProperty="Opacity" To="0"/>
</Storyboard>
</ControlTemplate.Resources>
<ControlTemplate.Triggers>
<EventTrigger RoutedEvent="UIElement.PreviewMouseLeftButtonDown">
<BeginStoryboard Storyboard="{StaticResource BtnTmplElp3OnPreviewMouseLeftButtonDown}"/>
</EventTrigger>
<EventTrigger RoutedEvent="UIElement.PreviewMouseLeftButtonUp">
<BeginStoryboard Storyboard="{StaticResource BtnTmplElp3OnPreviewMouseLeftButtonUp}"/>
</EventTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
<x:Code>
<![CDATA[
private void BtnTmplElp3_Grid_Loaded(object sender, RoutedEventArgs e)
{
var gr = sender as Grid;
double d = Math.Min(gr.ActualWidth, gr.ActualHeight);
var btn = gr.TemplatedParent as Button;
var el1 = gr.Children[0] as Ellipse;
var el2 = gr.Children[1] as Ellipse;
el2.Margin = new Thickness(d * 0.12);
var br1 = el1.Fill.CloneCurrentValue() as LinearGradientBrush;
var br2 = el2.Fill.CloneCurrentValue() as LinearGradientBrush;
var sc = btn.Background as SolidColorBrush;
Color c1 = sc != null ? sc.Color : SystemColors.WindowFrameColor;
Color c2 = Color.FromRgb((byte)(c1.R * 0.3 + 180), (byte)(c1.G * 0.3 + 180), (byte)(c1.B * 0.3 + 180));
br1.GradientStops[0] = br2.GradientStops[0] = new GradientStop(c1, 0);
br1.GradientStops[1] = br2.GradientStops[1] = new GradientStop(c2, 0.5);
br1.GradientStops[2] = br2.GradientStops[2] = new GradientStop(c1, 1);
el1.Fill = br1;
el2.Fill = br2;
}
]]></x:Code>
</Window.Resources>
