/Visual Studio 2008/VBSL3Animation/AnimateDependencyProperty.xaml

<!--/****************************** Module Header ******************************\

* Module Name:  AnimateDependencyProperty.xaml

* Project:      VBSL3Animation

* Copyright (c) Microsoft Corporation.

* 

* This module shows how to catch custom event of MyEllipse object and in the

* relevant event handler, it creates animation effect for the Line object by

* syncronizing its endpoints with the latest mouse click point and current position

* of MyEllipse object.

* 

* This source is subject to the Microsoft Public License.

* See http://www.microsoft.com/opensource/licenses.mspx#Ms-PL.

* All other rights reserved.

* 

* History:

* * 9/8/2009 05:00 PM Allen Chen Created

\***************************************************************************/-->

    

<UserControl x:Class="VBSL3Animation.AnimateDependencyProperty"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 

    xmlns:c="clr-namespace:VBSL3Animation"

    Width="400" Height="300">

    <UserControl.Resources>

        <Storyboard x:Name="MyAnimationStoryboard">

            <PointAnimation x:Name="MyAnimation"

                            Duration="0:0:2" 

                            Storyboard.TargetProperty="EllipseCenter"

                            Storyboard.TargetName="MyAnimatedEllipseGeometry"

></PointAnimation>

        </Storyboard>

    </UserControl.Resources>

    <Grid x:Name="LayoutRoot">

        <Grid.RowDefinitions>

            <RowDefinition Height="1*"></RowDefinition>

            <RowDefinition Height="9*"></RowDefinition>

        </Grid.RowDefinitions>

        <StackPanel Grid.Row="0">

            <TextBlock Text="Please click mouse in the black area."></TextBlock>

        </StackPanel>

        <StackPanel x:Name="MyStackPanel" MouseLeftButtonDown="MyStackPanel_MouseLeftButtonDown" Background="Black"  Grid.Row="1">

            <Canvas>

                <Line x:Name="MyLine" Fill="Red"  Stroke="Red"  Visibility="Collapsed" StrokeThickness="5" Canvas.ZIndex="1"></Line>

                <c:MyEllipse x:Name="MyAnimatedEllipseGeometry" EllipseCenterChanged="MyAnimatedEllipseGeometry_EllipseCenterChanged"></c:MyEllipse>

            </Canvas>

        </StackPanel>

    </Grid>

</UserControl>