創建一個WPF應用程序WpfApplication1,新建個窗體DialogWin
<Window x:Class="WpfApplication1.DialogWin"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="DialogWin" Height="632" Width="635" WindowStyle="None"
Name="DW1" Background="Transparent" AllowsTransparency="True" WindowStartupLocation="CenterScreen" WindowState="Normal">
<Window.Resources>
<!--此樣式能去除按鈕點擊後的虛線框-->
<Style x:Key="MyFocusVisual">
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate>
<Rectangle Margin="-2" StrokeThickness="0" Stroke="Red" StrokeDashArray="1 2"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!--原始旋轉出來樣例-->
<Storyboard x:Key="showDW">
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="Opacity"
From="0.2" To="1" Duration="0:0:2.5">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[1].Angle"
From="70" To="0" Duration="0:0:2" >
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleX"
From="0" To="1" Duration="0:0:2"
AccelerationRatio="1">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleY"
From="0" To="1" Duration="0:0:2"
AccelerationRatio="1">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleX"
To="0.98" BeginTime="0:0:2" Duration="0:0:0.05"
DecelerationRatio="1">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleY"
To="0.98" BeginTime="0:0:2" Duration="0:0:0.05"
DecelerationRatio="1">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleX"
To="1" BeginTime="0:0:2.05" Duration="0:0:0.2"
AccelerationRatio="1">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleY"
To="1" BeginTime="0:0:2.05" Duration="0:0:0.2"
AccelerationRatio="1">
</DoubleAnimation>
</Storyboard>
<!--原始的旋轉回去樣例-->
<Storyboard x:Key="closeDW">
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[1].Angle"
To="360" Duration="0:0:1.5" >
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="Opacity"
To="0" Duration="0:0:3">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleX"
To="0" Duration="0:0:1.5" AccelerationRatio="1">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleY"
To="0" Duration="0:0:1.5" AccelerationRatio="1">
</DoubleAnimation>
</Storyboard>
<!--轉出來-->
<Storyboard x:Key="showDW1">
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="Opacity"
From="0" To="1" Duration="0:0:0.2">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[1].Angle"
From="180" To="0" Duration="0:0:0.2" >
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleX"
From="0.2" To="1" Duration="0:0:0.2"
AccelerationRatio="1">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleY"
From="0.2" To="1" Duration="0:0:0.2"
AccelerationRatio="1">
</DoubleAnimation>
</Storyboard>
<!--彈出來-->
<Storyboard x:Key="showDW2">
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleX"
From="0.2" To="0.5" Duration="0:0:0.04" >
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleY"
From="0.2" To="0.5" Duration="0:0:0.04" >
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleX"
From="0.5" To="1" Duration="0:0:0.04" BeginTime="0:0:0.04" >
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleY"
From="0.5" To="1" Duration="0:0:0.04" BeginTime="0:0:0.04">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleX"
From="1" To="1.2" Duration="0:0:0.04" BeginTime="0:0:0.08" AutoReverse="True" >
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleY"
From="1" To="1.2" Duration="0:0:0.04" BeginTime="0:0:0.08" AutoReverse="True">
</DoubleAnimation>
</Storyboard>
<!--轉回去-->
<Storyboard x:Key="closeDW1">
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[1].Angle"
To="180" Duration="0:0:0.2" >
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="Opacity"
To="0" Duration="0:0:0.2">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleX"
To="0.2" Duration="0:0:0.2" AccelerationRatio="1">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleY"
To="0.2" Duration="0:0:0.2" AccelerationRatio="1">
</DoubleAnimation>
</Storyboard>
<!--彈回去-->
<Storyboard x:Key="closeDW2">
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleX"
From="1" To="1.2" Duration="0:0:0.04" AutoReverse="True">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleY"
From="1" To="1.2" Duration="0:0:0.04" AutoReverse="True">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleX"
From="1" To="0.5" Duration="0:0:0.04" BeginTime="0:0:0.04" >
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleY"
From="1" To="0.5" Duration="0:0:0.04" BeginTime="0:0:0.04">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleX"
From="0.5" To="0.2" Duration="0:0:0.04" BeginTime="0:0:0.08" >
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="Canvas1"
Storyboard.TargetProperty="RenderTransform.Children[0].ScaleY"
From="0.5" To="0.2" Duration="0:0:0.04" BeginTime="0:0:0.08" >
</DoubleAnimation>
</Storyboard>
</Window.Resources>
<Window.Triggers>
<!--設置DW1的事件觸發-->
<!--注意對窗體window的name取爲DW1-->
<EventTrigger SourceName="DW1" RoutedEvent="Window.Loaded">
<BeginStoryboard Name="showQueryCanvasStoryboard2"
Storyboard="{StaticResource showDW}">
</BeginStoryboard>
</EventTrigger>
<!--設置button1的事件觸發-->
<!--注意對按鈕的name取爲button1-->
<EventTrigger SourceName="button1" RoutedEvent="Button.Click">
<BeginStoryboard Name="closeQueryCanvasStoryboard"
Storyboard="{StaticResource closeDW}">
</BeginStoryboard>
</EventTrigger>
</Window.Triggers>
<Canvas Background="Transparent" Height="257" Width="214">
<Canvas Background="Brown" Height="236" Width="201" Canvas.Left="9" Canvas.Top="14" Name="Canvas1">
<!--設置動畫-->
<Canvas.RenderTransform>
<TransformGroup>
<ScaleTransform CenterX="100" CenterY="50"></ScaleTransform><!--縮放中心爲100,50。RenderTransform.Children[0]-->
<RotateTransform CenterX="100" CenterY="50"></RotateTransform><!--旋轉中心爲100,50。RenderTransform.Children[1]-->
</TransformGroup>
</Canvas.RenderTransform>
<Button Margin="98,107,124,127" Name="button1" FocusVisualStyle="{DynamicResource MyFocusVisual}"
Click="button1_Click" Height="28" Width="112" Canvas.Left="-53" Canvas.Top="77">關閉</Button>
<CheckBox Height="31" HorizontalAlignment="Left" Margin="32,25,0,0" Name="checkBox1" VerticalAlignment="Top" Width="75" Canvas.Left="11" Canvas.Top="-1">CheckBox</CheckBox>
<TextBlock Height="35" Margin="124,21,34,0" Name="textBlock1" VerticalAlignment="Top" Background="BlueViolet" Text="dfdf" Width="60" Canvas.Left="-73" Canvas.Top="43" />
</Canvas>
</Canvas>
</Window>
cs代碼:
添加引用
private void button1_Click(object sender, RoutedEventArgs e)
{
// this.Close();
/////timer定義
tm.Tick += new EventHandler(tm_Tick);
tm.Interval = TimeSpan.FromSeconds(0.2);
tm.Start();
}
DispatcherTimer tm = new DispatcherTimer();
void tm_Tick(object sender, EventArgs e)
{ this.Close(); }
其中動畫目標爲Canvas1,包括:
慢速旋轉顯示(showDW)、慢速旋轉消失(closeDW)
快速旋轉顯示(showDW1)、快速旋轉消失(closeDW1)
快速彈出顯示(showDW2)、快速旋轉消失(closeDW2)
快速旋轉顯示(showDW1):
time:0 → 0.2
旋轉角度:180→0
透明度: 0→1
放大: X向:0.2→1 Y向:0.2→1
快速彈出顯示(showDW2):
time:0 → 0.04 → 0.08 →← 0.12
放大 放大 放大(並復原)
X向:0.2→0.5 0.5→1 1→1.2→1
Y向:0.2→0.5 0.5→1 1→1.2→1
本文轉自Maths_bai的專欄 http://blog.csdn.net/maths_bai/article/details/5025394