New pivot
authorriley
Wed, 23 Sep 2009 17:24:33 +0200
changeset 87 68f4c0d7a7fc
parent 84 067f4a6c0cca
child 88 6a738974dd2e
New pivot
src/FingersDance.Control.Pivot/UserControlPivot.xaml
--- a/src/FingersDance.Control.Pivot/UserControlPivot.xaml	Wed Sep 23 16:47:42 2009 +0200
+++ b/src/FingersDance.Control.Pivot/UserControlPivot.xaml	Wed Sep 23 17:24:33 2009 +0200
@@ -4,13 +4,128 @@
 	xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
 	xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
 	mc:Ignorable="d"
+	xmlns:Custom="http://schemas.microsoft.com/surface/2008" xmlns:Microsoft_Surface_Presentation_Generic="clr-namespace:Microsoft.Surface.Presentation.Generic;assembly=Microsoft.Surface.Presentation.Generic"
 	x:Class="FingersDance.Control.Pivot.UserControlPivot"
-	x:Name="UserControl" Width="90" Height="90" xmlns:Custom="http://schemas.microsoft.com/surface/2008">
+	x:Name="UserControl" Width="90" Height="90">
 	<UserControl.Resources>
 		<ResourceDictionary>
 			<ResourceDictionary.MergedDictionaries>
 				<ResourceDictionary Source="FingersDance.Control.Pivot.Ressource.xaml"/>
 			</ResourceDictionary.MergedDictionaries>
+			<Style x:Key="FingersDance.Pivot.Button" TargetType="{x:Type Custom:SurfaceButton}">
+				<Style.BasedOn>
+					<Style TargetType="{x:Type ButtonBase}">
+						<Setter Property="SnapsToDevicePixels" Value="True"/>
+						<Setter Property="FocusVisualStyle">
+							<Setter.Value>
+								<Style>
+									<Setter Property="Control.Template">
+										<Setter.Value>
+											<ControlTemplate/>
+										</Setter.Value>
+									</Setter>
+								</Style>
+							</Setter.Value>
+						</Setter>
+						<Setter Property="FontFamily" Value="Segoe UI"/>
+						<Setter Property="FontSize" Value="10"/>
+						<Setter Property="Foreground" Value="Black"/>
+						<Setter Property="Background" Value="#33A4B4BD"/>
+						<Setter Property="BorderBrush">
+							<Setter.Value>
+								<LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
+									<GradientStop Color="#7FFFFFFF" Offset="0"/>
+									<GradientStop Color="#0CFFFFFF" Offset="1"/>
+								</LinearGradientBrush>
+							</Setter.Value>
+						</Setter>
+						<Setter Property="BorderThickness" Value="1"/>
+						<Setter Property="HorizontalContentAlignment" Value="Center"/>
+						<Setter Property="VerticalContentAlignment" Value="Center"/>
+						<Setter Property="Padding" Value="15,6"/>
+						<Setter Property="IsTabStop" Value="False"/>
+						<Setter Property="Focusable" Value="False"/>
+						<Setter Property="MinWidth" Value="30"/>
+						<Setter Property="MinHeight" Value="30"/>
+						<Setter Property="Template">
+							<Setter.Value>
+								<ControlTemplate TargetType="{x:Type ButtonBase}">
+									<ControlTemplate.Resources>
+										<Storyboard x:Key="Press">
+											<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Glow" Storyboard.TargetProperty="(UIElement.Opacity)">
+												<SplineDoubleKeyFrame KeyTime="00:00:00.1000000" Value="1"/>
+											</DoubleAnimationUsingKeyFrames>
+											<ThicknessAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Glow" Storyboard.TargetProperty="(FrameworkElement.Margin)">
+												<SplineThicknessKeyFrame KeyTime="00:00:00.1000000" Value="-3"/>
+											</ThicknessAnimationUsingKeyFrames>
+										</Storyboard>
+										<Storyboard x:Key="Release">
+											<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Glow" Storyboard.TargetProperty="(UIElement.Opacity)">
+												<SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
+												<SplineDoubleKeyFrame KeySpline="0.5,0.5,0.5,1" KeyTime="00:00:00.5000000" Value="0"/>
+											</DoubleAnimationUsingKeyFrames>
+											<ThicknessAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Glow" Storyboard.TargetProperty="(FrameworkElement.Margin)">
+												<SplineThicknessKeyFrame KeyTime="00:00:00" Value="-3"/>
+												<SplineThicknessKeyFrame KeySpline="0.5,0.5,0.5,1" KeyTime="00:00:00.5000000" Value="1"/>
+											</ThicknessAnimationUsingKeyFrames>
+										</Storyboard>
+									</ControlTemplate.Resources>
+									<Grid x:Name="Grid" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}">
+										<Border x:Name="Shadow" Margin="1,1,1,0" BorderBrush="{x:Null}" BorderThickness="0,0,0,1" CornerRadius="6" Padding="1"/>
+										<Rectangle x:Name="Base" Fill="{TemplateBinding Background}" StrokeThickness="1" RadiusX="5" RadiusY="5" Margin="1" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" Stroke="{x:Null}"/>
+										<Rectangle x:Name="RenderOverlay" StrokeThickness="1" RadiusX="4" RadiusY="4" Margin="2" Opacity="1" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" Fill="{x:Null}"/>
+										<Microsoft_Surface_Presentation_Generic:SurfaceShadowChrome x:Name="Glow" Margin="1" Opacity="0" Color="White" CornerRadius="4"/>
+										<ContentPresenter x:Name="Content" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" RenderTransformOrigin="0.5,0.5" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" ContentTemplate="{TemplateBinding ContentTemplate}">
+											<ContentPresenter.RenderTransform>
+												<TranslateTransform X="0" Y="-1"/>
+											</ContentPresenter.RenderTransform>
+										</ContentPresenter>
+									</Grid>
+									<ControlTemplate.Triggers>
+										<Trigger Property="IsPressed" Value="True">
+											<Trigger.EnterActions>
+												<BeginStoryboard>
+													<Storyboard>
+														<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Glow" Storyboard.TargetProperty="(UIElement.Opacity)">
+															<SplineDoubleKeyFrame KeyTime="00:00:00.1000000" Value="1"/>
+														</DoubleAnimationUsingKeyFrames>
+														<ThicknessAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Glow" Storyboard.TargetProperty="(FrameworkElement.Margin)">
+															<SplineThicknessKeyFrame KeyTime="00:00:00.1000000" Value="-3"/>
+														</ThicknessAnimationUsingKeyFrames>
+													</Storyboard>
+												</BeginStoryboard>
+											</Trigger.EnterActions>
+											<Trigger.ExitActions>
+												<BeginStoryboard>
+													<Storyboard>
+														<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Glow" Storyboard.TargetProperty="(UIElement.Opacity)">
+															<SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
+															<SplineDoubleKeyFrame KeySpline="0.5,0.5,0.5,1" KeyTime="00:00:00.5000000" Value="0"/>
+														</DoubleAnimationUsingKeyFrames>
+														<ThicknessAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Glow" Storyboard.TargetProperty="(FrameworkElement.Margin)">
+															<SplineThicknessKeyFrame KeyTime="00:00:00" Value="-3"/>
+															<SplineThicknessKeyFrame KeySpline="0.5,0.5,0.5,1" KeyTime="00:00:00.5000000" Value="1"/>
+														</ThicknessAnimationUsingKeyFrames>
+													</Storyboard>
+												</BeginStoryboard>
+											</Trigger.ExitActions>
+										</Trigger>
+										<Trigger Property="IsEnabled" Value="True"/>
+										<Trigger Property="IsEnabled" Value="False">
+											<Setter Property="Fill" TargetName="RenderOverlay" Value="#0CFFFFFF"/>
+											<Setter Property="Stroke" TargetName="RenderOverlay" Value="#33FFFFFF"/>
+											<Setter Property="Stroke" TargetName="Base" Value="#33000000"/>
+											<Setter Property="BorderBrush" TargetName="Shadow" Value="#00000000"/>
+											<Setter Property="Foreground" Value="#A5333333"/>
+											<Setter Property="Background" Value="Transparent"/>
+										</Trigger>
+									</ControlTemplate.Triggers>
+								</ControlTemplate>
+							</Setter.Value>
+						</Setter>
+					</Style>
+				</Style.BasedOn>
+			</Style>
 		</ResourceDictionary>
 	</UserControl.Resources>
 	<Grid>
@@ -22,9 +137,9 @@
 			<ColumnDefinition Width="0.506*"/>
 			<ColumnDefinition Width="0.494*"/>
 		</Grid.ColumnDefinitions>
-		<Ellipse Stroke="#FFFFFFFF" Grid.ColumnSpan="2" Grid.RowSpan="2" StrokeThickness="0.5" Fill="#FF000000" Margin="0.462,0,-0.462,0"/>
-		<Custom:SurfaceButton BorderThickness="0,0,0,0" x:Name="SurfaceButtonPlayer1" Content="" Background="{DynamicResource Color_8_#230FD2_xaml}" ContactDown="SurfaceButtonPlayer1_ContactDown" Click="SurfaceButtonPlayer1_Click" Margin="10.377,11.057,6.827,5.11"/>
-		<Custom:SurfaceButton Content="" x:Name="SurfaceButtonPlayer2" Grid.Column="1" RenderTransformOrigin="0.5,0.5" Background="{DynamicResource Color_4_#FF0000_xaml}" ContactDown="SurfaceButtonPlayer2_ContactDown" Click="SurfaceButtonPlayer2_Click" Margin="6.335,11.235,9.272,4.932">
+		<Ellipse Stroke="#FFFFFFFF" Grid.ColumnSpan="2" Grid.RowSpan="2" StrokeThickness="0.5" Fill="#FF706868" Margin="0.462,0,-0.462,0"/>
+		<Custom:SurfaceButton BorderThickness="0,0,0,0" x:Name="SurfaceButtonPlayer1" Content="" Background="{DynamicResource Color_9_#0096FF__xaml}" ContactDown="SurfaceButtonPlayer1_ContactDown" Click="SurfaceButtonPlayer1_Click" Margin="2.303,1.451,2.236,0.639" Width="41" Height="43" Style="{DynamicResource FingersDance.Pivot.Button}"/>
+		<Custom:SurfaceButton Content="" x:Name="SurfaceButtonPlayer2" Grid.Column="1" RenderTransformOrigin="0.5,0.5" Background="{DynamicResource Color_4_#FF0000_xaml}" ContactDown="SurfaceButtonPlayer2_ContactDown" Click="SurfaceButtonPlayer2_Click" Margin="2.501,1.451,1.248,0.439" Width="41" Height="43" Style="{DynamicResource FingersDance.Pivot.Button}">
 			<Custom:SurfaceButton.RenderTransform>
 				<TransformGroup>
 					<ScaleTransform ScaleX="-1" ScaleY="1"/>
@@ -34,7 +149,7 @@
 				</TransformGroup>
 			</Custom:SurfaceButton.RenderTransform>
 		</Custom:SurfaceButton>
-		<Custom:SurfaceButton Content="" x:Name="SurfaceButtonPlayer3" Grid.Row="1" RenderTransformOrigin="0.5,0.5" Background="{DynamicResource Color_12_#00C800_xaml}" ContactDown="SurfaceButtonPlayer3_ContactDown" Click="SurfaceButtonPlayer3_Click" Margin="10.04,4.107,6.527,11.888" >
+		<Custom:SurfaceButton Content="" x:Name="SurfaceButtonPlayer3" Grid.Row="1" RenderTransformOrigin="0.5,0.5" Background="{DynamicResource Color_12_#00C800_xaml}" ContactDown="SurfaceButtonPlayer3_ContactDown" Click="SurfaceButtonPlayer3_Click" Margin="2.303,0.593,2.167,1.317" Width="41" Height="43" Style="{DynamicResource FingersDance.Pivot.Button}" Foreground="{x:Null}" >
 			<Custom:SurfaceButton.RenderTransform>
 				<TransformGroup>
 					<ScaleTransform ScaleX="1" ScaleY="-1"/>
@@ -44,7 +159,7 @@
 				</TransformGroup>
 			</Custom:SurfaceButton.RenderTransform>
 		</Custom:SurfaceButton>
-		<Custom:SurfaceButton Content=""  Grid.Row="1" Grid.Column="1" x:Name="SurfaceButtonPlayer4" RenderTransformOrigin="0.5,0.5" Background="{DynamicResource Color_2_#FFC800_xaml}" ContactDown="SurfaceButtonPlayer4_ContactDown" Click="SurfaceButtonPlayer4_Click" Margin="6.365,3.685,7.938,12.539">
+		<Custom:SurfaceButton Content=""  Grid.Row="1" Grid.Column="1" x:Name="SurfaceButtonPlayer4" RenderTransformOrigin="0.5,0.5" Background="{DynamicResource Color_2_#FFC800_xaml}" ContactDown="SurfaceButtonPlayer4_ContactDown" Click="SurfaceButtonPlayer4_Click" Margin="2.212,0.809,1.248,1.317" Style="{DynamicResource FingersDance.Pivot.Button}" Width="41" Height="43">
 			<Custom:SurfaceButton.RenderTransform>
 				<TransformGroup>
 					<ScaleTransform ScaleX="-1" ScaleY="-1"/>
@@ -54,19 +169,6 @@
 				</TransformGroup>
 			</Custom:SurfaceButton.RenderTransform>
 		</Custom:SurfaceButton>
-		<Ellipse Height="25" HorizontalAlignment="Left" VerticalAlignment="Top" Width="25" Margin="-12.479,-12.358,0,0" Grid.Row="1" StrokeThickness="0.5" Grid.Column="1">
-			<Ellipse.Fill>
-				<RadialGradientBrush>
-					<GradientStop Color="#FF000000" Offset="0.788"/>
-					<GradientStop Color="#FFFFFFFF" Offset="0"/>
-				</RadialGradientBrush>
-			</Ellipse.Fill>
-			<Ellipse.Stroke>
-				<RadialGradientBrush>
-					<GradientStop Color="#FF8A8888" Offset="0"/>
-					<GradientStop Color="#FFFFFFFF" Offset="1"/>
-				</RadialGradientBrush>
-			</Ellipse.Stroke>
-		</Ellipse>
+		<Ellipse Margin="0,0,-19,-19" StrokeThickness="0.5" Fill="#FF706868" HorizontalAlignment="Right" VerticalAlignment="Bottom" Width="40.655" Height="40.335"/>
 	</Grid>
 </UserControl>
\ No newline at end of file