最近项目大量要用到动画,研究研究wpf动画效果,没事做做demo
<Page.Background>
<LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
<LinearGradientBrush.GradientStops>
<GradientStop Offset="0.0" Color="Black" />
<GradientStop Offset="1.0" Color="#666666" />
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
<DrawingBrush x:Key="MyWireBrushResource"
Viewport="0,0,10,10" ViewportUnits="Absolute" TileMode="Tile">
<DrawingBrush.Drawing>
<DrawingGroup>
<DrawingGroup.Children>
<GeometryDrawing Geometry="M0,0 L1,0 1,0.1, 0,0.1Z" Brush="#66CCCCFF" />
<GeometryDrawing Geometry="M0,0 L0,1 0.1,1, 0.1,0Z" Brush="#66CCCCFF" />
</DrawingGroup.Children>
</DrawingGroup>
</DrawingBrush.Drawing>
</DrawingBrush>
</Page.Background>
<StackPanel Margin="40">
<Border Name="TextBorder" HorizontalAlignment="Left"
VerticalAlignment="Top" Background="{StaticResource MyWireBrushResource}">
<TextBlock
Name="RealText"
FontFamily="Segoe UI"
FontSize="60 px"
Margin="50"
Foreground="White">
Windows 7
<TextBlock.TextEffects>
<!-- The TextEffect to animate. -->
<TextEffect PositionCount="1" x:Name="MyTextEffect">
<TextEffect.Transform>
<RotateTransform x:Name="TextEffectRotateTransform"
Angle="0" CenterX="10" CenterY="10" />
</TextEffect.Transform>
</TextEffect>
</TextBlock.TextEffects>
<TextBlock.Triggers>
<EventTrigger RoutedEvent="TextBlock.Loaded">
<BeginStoryboard>
<Storyboard>
<ParallelTimeline RepeatBehavior="Forever">
<!-- Animates the angle of the RotateTransform
applied to the TextEffect. -->
<DoubleAnimation
Storyboard.TargetName="TextEffectRotateTransform"
Storyboard.TargetProperty="Angle"
From="0"
To="360"
Duration="00:00:0.75"
BeginTime="0:0:0.25" />
</ParallelTimeline>
<!-- Animates the horizontal center of the RotateTransform
applied to the TextEffect. -->
<DoubleAnimation
From="30"
To="370"
Duration="00:00:13"
RepeatBehavior="Forever"
AutoReverse="True"
Storyboard.TargetName="TextEffectRotateTransform"
Storyboard.TargetProperty="CenterX" />
<!-- Animates the position of the TextEffect. -->
<Int32AnimationUsingKeyFrames
Storyboard.TargetName="MyTextEffect"
Storyboard.TargetProperty="PositionStart"
Duration="0:0:13"
AutoReverse="True"
RepeatBehavior="Forever">
<Int32AnimationUsingKeyFrames.KeyFrames>
<DiscreteInt32KeyFrame Value="0" KeyTime="0:0:0" />
<DiscreteInt32KeyFrame Value="1" KeyTime="0:0:1" />
<DiscreteInt32KeyFrame Value="2" KeyTime="0:0:2" />
<DiscreteInt32KeyFrame Value="3" KeyTime="0:0:3" />
<DiscreteInt32KeyFrame Value="4" KeyTime="0:0:4" />
<DiscreteInt32KeyFrame Value="5" KeyTime="0:0:5" />
<DiscreteInt32KeyFrame Value="6" KeyTime="0:0:6" />
<DiscreteInt32KeyFrame Value="7" KeyTime="0:0:7" />
<DiscreteInt32KeyFrame Value="8" KeyTime="0:0:8" />
<DiscreteInt32KeyFrame Value="9" KeyTime="0:0:9" />
<DiscreteInt32KeyFrame Value="10" KeyTime="0:0:10" />
<DiscreteInt32KeyFrame Value="11" KeyTime="0:0:11" />
<DiscreteInt32KeyFrame Value="12" KeyTime="0:0:12" />
</Int32AnimationUsingKeyFrames.KeyFrames>
</Int32AnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</TextBlock.Triggers>
</TextBlock>
</Border>
<!-- Uses a VisualBrush to create a reflection of the animated text. -->
<Rectangle Name="ReflectedText"
Height="{Binding ElementName=TextBorder, Path=ActualHeight}"
Width="{Binding ElementName=TextBorder, Path=ActualWidth}"
HorizontalAlignment="Left">
<Rectangle.OpacityMask>
<LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
<LinearGradientBrush.GradientStops>
<GradientStop Offset="0.0" Color="#66000000" />
<GradientStop Offset="1.0" Color="#00000000" />
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Rectangle.OpacityMask>
<Rectangle.Fill>
<VisualBrush
Visual="{Binding ElementName=TextBorder}">
<VisualBrush.RelativeTransform>
<TransformGroup>
<ScaleTransform ScaleX="1" ScaleY="-1" />
<TranslateTransform Y="1" />
</TransformGroup>
</VisualBrush.RelativeTransform>
</VisualBrush>
</Rectangle.Fill>
</Rectangle>
</StackPanel>
效果如下:
作者:wpf之家
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。