Expanding Circles : Path « Windows Presentation Foundation « VB.Net Tutorial

1. VB.Net Tutorial
2. Windows Presentation Foundation
3. Path

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      WindowTitle="Expanding Circles">
    <Canvas Width="400" Height="400"
          HorizontalAlignment="Center" VerticalAlignment="Center" >
        <Path Name="pathInner" Stroke="Red" StrokeThickness="12.5">
            <Path.Data>
                <EllipseGeometry x:Name="elips1" Center="200 200" RadiusX="0" RadiusY="0" />
            </Path.Data>
        </Path>
        <Path Stroke="Red" StrokeThickness="12.5">
            <Path.Data>
                <GeometryGroup>
                    <EllipseGeometry x:Name="elips2" Center="200 200" RadiusX="25" RadiusY="25" />
                </GeometryGroup>
            </Path.Data>
        </Path>

        <Canvas.Triggers>
            <EventTrigger RoutedEvent="Canvas.Loaded">
                <BeginStoryboard>
                    <Storyboard RepeatBehavior="Forever">
                        <DoubleAnimation Storyboard.TargetName="pathInner"
                             Storyboard.TargetProperty="StrokeThickness"
                             From="0" Duration="0:0:5" />

                        <DoubleAnimation Storyboard.TargetName="elips1" 
                             Storyboard.TargetProperty="RadiusX" 
                             From="0" To="25" IsAdditive="True"  
                             Duration="0:0:5" />

                        <DoubleAnimation Storyboard.TargetName="elips1" 
                             Storyboard.TargetProperty="RadiusY" 
                             From="0" To="25" IsAdditive="True"  
                             Duration="0:0:5" />

                        <DoubleAnimation Storyboard.TargetName="elips2" 
                             Storyboard.TargetProperty="RadiusX" 
                             From="0" To="25" IsAdditive="True"  
                             Duration="0:0:5" />

                        <DoubleAnimation Storyboard.TargetName="elips2" 
                             Storyboard.TargetProperty="RadiusY" 
                             From="0" To="25" IsAdditive="True"  
                             Duration="0:0:5" />


                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Canvas.Triggers>
    </Canvas>
</Page>

16.70.Path
	16.70.1.	Trivial Path
	16.70.2.	Path Data
	16.70.3.	A Path based on Path.Data, PathGeometry and LineSegment
	16.70.4.	Path StrokeDashArray
	16.70.5.	Sample Arc
	16.70.6.	Four Overlapping Circles
	16.70.7.	Path Intersect
	16.70.8.	Closed PathFigure
	16.70.9.	PathGeometry Figure
	16.70.10.	Path with OuterGlowBitmapEffect
	16.70.11.	Path with M, C and Z
	16.70.12.	Path and PolyLineSegment.Points
	16.70.13.	Double animation with path
	16.70.14.	Matrix animation with path
	16.70.15.	Create a polyline with a PathGeometry
	16.70.16.	Expanding Circles
	16.70.17.	Simple Arc
	16.70.18.	Draw a Curved Line with PathFigure, LineSegment, ArcSegment
	16.70.19.	LineSegment inside a PathFigure
	16.70.20.	ArcSegment inside a PathFigure
	16.70.21.	Set SweepDirection=Clockwise for ArcSegment
	16.70.22.	PathFigure and BezierSegment
	16.70.23.	Path with BlurBitmapEffect
	16.70.24.	Path with DropShadowBitmapEffect
	16.70.25.	Path based on GeometryGroup
	16.70.26.	Set for RenderTransformOrigin Path
	16.70.27.	Use TransformGroup to group transformations
	16.70.28.	Transform Path
	16.70.29.	Grouped Shapes
	16.70.30.	FileRule = Nonzero for Path
	16.70.31.	FileRule = EvenOdd for Path
	16.70.32.	Path with EllipseGeometries
	16.70.33.	One Path with two EllipseGeometries
	16.70.34.	Path with Shadow
	16.70.35.	Dotted Path