Assembly: PresentationCore (in presentationcore.dll)
XML Namespace: http://schemas.microsoft.com/winfx/2006/xaml/presentation
/** @property */ public Nullable<double> get_From () /** @property */ public void set_From (Nullable<double> value)
public function get From () : Nullable<double> public function set From (value : Nullable<double>)
Property ValueThe starting value of the animation. The default value is a null reference (Nothing in Visual Basic).
The animation progresses from the value specified by the From property to the base value of the property being animated or to a previous animation's output value, depending on how the previous animation is configured.
From and To
The animation progresses from the value specified by the From property to the value specified by the To property.
From and By
The animation progresses from the value specified by the From property to the value specified by the sum of the From and By properties.
The animation progresses from the animated property's base value or a previous animation's output value to the value specified by the To property.
The animation progresses from the base value of the property being animated or a previous animation's output value to the sum of that value and the value specified by the By property.
If you set both the To and By properties, the To property takes precedence and the By property is ignored.
To use other interpolation methods or animate between more than two target values, use a DoubleAnimationUsingKeyFrames object.
In the following example animates the size of two buttons using these two approaches. One button is resized by animating its Width property and another is resized by animating a ScaleTransform applied to its RenderTransform property. Each button contains some text. Initially, the text appears the same in both buttons, but as the buttons are resized, the text in the second button becomes distorted.
<!-- AnimatingSizeExample.xaml This example shows two ways of animating the size of a framework element. --> <Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Class="Microsoft.Samples.Animation.AnimatingSizeExample" WindowTitle="Animating Size Example"> <Canvas Width="650" Height="400"> <Button Name="AnimatedWidthButton" Canvas.Left="20" Canvas.Top="20" Width="200" Height="150" BorderBrush="Red" BorderThickness="5"> Click Me <Button.Triggers> <!-- Animate the button's Width property. --> <EventTrigger RoutedEvent="Button.Loaded"> <BeginStoryboard> <Storyboard> <DoubleAnimation Storyboard.TargetName="AnimatedWidthButton" Storyboard.TargetProperty="(Button.Width)" To="500" Duration="0:0:10" AutoReverse="True" RepeatBehavior="Forever" /> </Storyboard> </BeginStoryboard> </EventTrigger> </Button.Triggers> </Button> <Button Canvas.Left="20" Canvas.Top="200" Width="200" Height="150" BorderBrush="Black" BorderThickness="3"> Click Me <Button.RenderTransform> <ScaleTransform x:Name="MyAnimatedScaleTransform" ScaleX="1" ScaleY="1" /> </Button.RenderTransform> <Button.Triggers> <!-- Animate the ScaleX property of a ScaleTransform applied to the button. --> <EventTrigger RoutedEvent="Button.Loaded"> <BeginStoryboard> <Storyboard> <DoubleAnimation Storyboard.TargetName="MyAnimatedScaleTransform" Storyboard.TargetProperty="(ScaleTransform.ScaleX)" To="3.0" Duration="0:0:10" AutoReverse="True" RepeatBehavior="Forever" /> </Storyboard> </BeginStoryboard> </EventTrigger> </Button.Triggers> </Button> </Canvas> </Page>
When you transform an element, the entire element and its contents are transformed. When you directly alter the size of an element, as in the case of the first button, the element's contents are not resized unless their size and position depend on the size of their parent element.
Animating the size of an element by applying an animated transform to its RenderTransform property provides better performance than animated its Width and Height directly, because the RenderTransform property does not trigger a layout pass.
|How to: Control an Animation using From, To, and By|| |
A "From/To/By" or "basic animation" creates a transition between two target values (see Animation Overview for an introduction to different types of animations). To set the target values of a basic animation, use its From, To, and By properties. The following table summarizes how the From, To, and By properties may be used together or separately to determine an animation's target values.
Windows 98, Windows Server 2000 SP4, Windows CE, Windows Millennium Edition, Windows Mobile for Pocket PC, Windows Mobile for Smartphone, Windows Server 2003, Windows XP Media Center Edition, Windows XP Professional x64 Edition, Windows XP SP2, Windows XP Starter EditionThe Microsoft .NET Framework 3.0 is supported on Windows Vista, Microsoft Windows XP SP2, and Windows Server 2003 SP1.