HOW TO:建立 ArcSegment 大小的動畫
更新:2007 年 11 月
本範例說明如何將 ArcSegment 的 Size 屬性顯示為動畫。
範例
下列範例會建立一個 ArcSegment,當它載入畫面時,會將其 Size 顯示為動畫。
using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Shapes;
using System.Windows.Media.Animation;
using System.Windows.Media;
namespace SDKSamples
{
public class SizeAnimationExample : Page
{
public SizeAnimationExample()
{
// Create a NameScope for this page so that
// Storyboards can be used.
NameScope.SetNameScope(this, new NameScope());
// Create an ArcSegment to define the geometry of the path.
// The Size property of this segment is animated.
ArcSegment myArcSegment = new ArcSegment();
myArcSegment.Size = new Size(90, 80);
myArcSegment.SweepDirection = SweepDirection.Clockwise;
myArcSegment.Point = new Point(500, 200);
// Assign the segment a name so that
// it can be targeted by a Storyboard.
this.RegisterName(
"myArcSegment", myArcSegment);
PathSegmentCollection myPathSegmentCollection = new PathSegmentCollection();
myPathSegmentCollection.Add(myArcSegment);
// Create a PathFigure to be used for the PathGeometry of myPath.
PathFigure myPathFigure = new PathFigure();
// Set the starting point for the PathFigure specifying that the
// geometry starts at point 100,200.
myPathFigure.StartPoint = new Point(100, 200);
myPathFigure.Segments = myPathSegmentCollection;
PathFigureCollection myPathFigureCollection = new PathFigureCollection();
myPathFigureCollection.Add(myPathFigure);
PathGeometry myPathGeometry = new PathGeometry();
myPathGeometry.Figures = myPathFigureCollection;
// Create a path to draw a geometry with.
Path myPath = new Path();
myPath.Stroke = Brushes.Black;
myPath.StrokeThickness = 1;
// specify the shape of the path using the path geometry.
myPath.Data = myPathGeometry;
SizeAnimation mySizeAnimation = new SizeAnimation();
mySizeAnimation.Duration = TimeSpan.FromSeconds(2);
// Set the animation to repeat forever.
mySizeAnimation.RepeatBehavior = RepeatBehavior.Forever;
// Set the From and To properties of the animation.
mySizeAnimation.From = new Size(90, 80);
mySizeAnimation.To = new Size(200, 200);
// Set the animation to target the Size property
// of the object named "myArcSegment."
Storyboard.SetTargetName(mySizeAnimation, "myArcSegment");
Storyboard.SetTargetProperty(
mySizeAnimation, new PropertyPath(ArcSegment.SizeProperty));
// Create a storyboard to apply the animation.
Storyboard ellipseStoryboard = new Storyboard();
ellipseStoryboard.Children.Add(mySizeAnimation);
// Start the storyboard when the Path loads.
myPath.Loaded += delegate(object sender, RoutedEventArgs e)
{
ellipseStoryboard.Begin(this);
};
Canvas containerCanvas = new Canvas();
containerCanvas.Children.Add(myPath);
Content = containerCanvas;
}
}
}
<Page xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml" >
<Canvas HorizontalAlignment="Left" Margin="0" >
<!-- Create an arc on the screen that animates its size when it loads. -->
<Path Stroke="Black" StrokeThickness="2" >
<Path.Data>
<PathGeometry>
<PathGeometry.Figures>
<PathFigureCollection>
<PathFigure StartPoint="100,200">
<PathFigure.Segments>
<PathSegmentCollection>
<ArcSegment x:Name="myArcSegment" Size="90,80"
SweepDirection="Clockwise" Point="500,200" />
</PathSegmentCollection>
</PathFigure.Segments>
</PathFigure>
</PathFigureCollection>
</PathGeometry.Figures>
</PathGeometry>
</Path.Data>
<Path.Triggers>
<EventTrigger RoutedEvent="Path.Loaded">
<BeginStoryboard Name="myBeginStoryBoard">
<Storyboard>
<!-- Animate the size of the ArcSegment to a width and height of 200. -->
<SizeAnimation
Storyboard.TargetName="myArcSegment"
Storyboard.TargetProperty="Size"
From="90,80"
To="200,200"
Duration="0:0:2" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Path.Triggers>
</Path>
</Canvas>
</Page>
如需其他幾何以及動畫範例,請參閱幾何範例。