src/FingersDance.Control.Player/UserControlPlayer.xaml
changeset 92 3a0b48be34bd
parent 57 926ad47737a3
child 94 5d6ebbd6557f
--- a/src/FingersDance.Control.Player/UserControlPlayer.xaml	Wed Sep 23 17:11:43 2009 +0200
+++ b/src/FingersDance.Control.Player/UserControlPlayer.xaml	Wed Sep 23 19:44:59 2009 +0200
@@ -4,21 +4,134 @@
 	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.Player.UserControlPlayer"
 	x:Name="UserControl"
-	Width="560" Height="400" xmlns:Custom="http://schemas.microsoft.com/surface/2008">
+	Width="560" Height="400">
 	<UserControl.Resources>
 		<Storyboard x:Key="OnClick1"/>
+		<Style x:Key="FingersDance.Control.PlayerButton" 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" Stroke="{TemplateBinding BorderBrush}" 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>
 	</UserControl.Resources>
-	<UserControl.Triggers>
-	</UserControl.Triggers>
-        <Grid x:Name="LayoutRoot" Width="{Binding Path=ActualWidth, ElementName=UserControl, Mode=Default}" Height="{Binding Path=ActualHeight, ElementName=UserControl, Mode=Default}" Background="{x:Null}" >
-        	<Viewbox Margin="0,0,0,0" Width="{Binding Path=ActualWidth, ElementName=UserControl, Mode=Default}" Height="{Binding Path=ActualHeight, ElementName=UserControl, Mode=Default}" Stretch="Uniform">
+        <Grid x:Name="LayoutRoot" Width="{Binding ActualWidth, ElementName=UserControl, Mode=Default}" Height="{Binding ActualHeight, ElementName=UserControl, Mode=Default}" Background="{x:Null}" >
+        	<Viewbox Margin="0,0,0,0" Width="{Binding ActualWidth, ElementName=UserControl, Mode=Default}" Height="{Binding ActualHeight, ElementName=UserControl, Mode=Default}" Stretch="Uniform">
         		<Grid Width="560" Height="400">
         			<MediaElement x:Name="MediaElementVideo" MediaOpened="MediaElementVideo_MediaOpened" Stretch="Fill" ScrubbingEnabled="False" StretchDirection="Both" />
-        			<Custom:SurfaceButton x:Name="Rewind_area" Content="Play/Pause" ContactDown="ButtonRewind_ContactDown" Click="ButtonRewind_Click" Foreground="{x:Null}" Background="#FFF7F0F0" BorderBrush="{x:Null}" Opacity="0" Width="72" HorizontalAlignment="Left"/>
-        			<Custom:SurfaceButton x:Name="Fast_Forward_area" Content="Play/Pause" ContactDown="ButtonFastForward_ContactDown" Click="ButtonFastForward_Click" Foreground="{x:Null}" Background="#FFF7F0F0" BorderBrush="{x:Null}" Opacity="0" Width="72" HorizontalAlignment="Right"/>
-        			<Custom:SurfaceButton x:Name="Play_Pause_area" ContactDown="ButtonPlayPause_ContactDown" Click="ButtonPlayPause_Click" Foreground="{x:Null}" Background="#FFF7F0F0" BorderBrush="{x:Null}" Opacity="0" Margin="76,0,76,0"/>
+        			<Custom:SurfaceButton x:Name="Rewind_area" Content="Play/Pause" ContactDown="ButtonRewind_ContactDown" Click="ButtonRewind_Click" Foreground="{x:Null}" Background="#FFF7F0F0" BorderBrush="{x:Null}" Opacity="0" Width="72" HorizontalAlignment="Left" Style="{DynamicResource FingersDance.Control.PlayerButton}" VerticalAlignment="Top" Height="48"/>
+        			<Custom:SurfaceButton x:Name="Fast_Forward_area" Content="Play/Pause" ContactDown="ButtonFastForward_ContactDown" Click="ButtonFastForward_Click" Foreground="{x:Null}" Background="#FFF7F0F0" BorderBrush="{x:Null}" Opacity="0" Width="72" HorizontalAlignment="Right" Style="{DynamicResource FingersDance.Control.PlayerButton}" VerticalAlignment="Top" Height="48"/>
+        			<Custom:SurfaceButton x:Name="Play_Pause_area" ContactDown="ButtonPlayPause_ContactDown" Click="ButtonPlayPause_Click" Foreground="{x:Null}" Background="{x:Null}" BorderBrush="{x:Null}" Margin="76,0" Style="{DynamicResource FingersDance.Control.PlayerButton}" Opacity="0" VerticalAlignment="Top" Height="48"/>
         		</Grid>
         	</Viewbox>
         </Grid>