VisualState.Storyboard Property

Definition

Gets or sets a Storyboard that defines the appearance of the control when it is in the state that is represented by the VisualState.

public:
 property System::Windows::Media::Animation::Storyboard ^ Storyboard { System::Windows::Media::Animation::Storyboard ^ get(); void set(System::Windows::Media::Animation::Storyboard ^ value); };
public System.Windows.Media.Animation.Storyboard Storyboard { get; set; }
member this.Storyboard : System.Windows.Media.Animation.Storyboard with get, set
Public Property Storyboard As Storyboard

Property Value

A storyboard that defines the appearance of the control when it is in the state that is represented by the VisualState. The default is null.

Examples

The following example creates a simple ControlTemplate for a Button that contains one Grid. The VisualState called MouseOver has a Storyboard that changes the color of the Grid from green to red when the user puts the mouse over the Button. The VisualState called Normal is included so that when the user moves the mouse off the button, the Grid returns to green.

<ControlTemplate TargetType="Button">
  <Grid >
    <VisualStateManager.VisualStateGroups>
      <VisualStateGroup x:Name="CommonStates">

        <VisualStateGroup.Transitions>

          <!--Take one half second to trasition to the MouseOver state.-->
          <VisualTransition To="MouseOver" 
            GeneratedDuration="0:0:0.5"/>
        </VisualStateGroup.Transitions>

        <VisualState x:Name="Normal" />

        <!--Change the SolidColorBrush, ButtonBrush, to red when the
            mouse is over the button.-->
        <VisualState x:Name="MouseOver">
          <Storyboard>
            <ColorAnimation Storyboard.TargetName="ButtonBrush" 
              Storyboard.TargetProperty="Color" To="Red" />
          </Storyboard>
        </VisualState>
      </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
    <Grid.Background>
      <SolidColorBrush x:Name="ButtonBrush" Color="Green"/>
    </Grid.Background>
  </Grid>
</ControlTemplate>

Remarks

When the control enters the state that is specified by the VisualState.Name property, the Storyboard begins. When the control exits the state, the Storyboard stops.

Applies to