다음을 통해 공유


VisualState.Storyboard 속성

정의

이 시각적 상태를 사용할 때 컨트롤의 상태별 속성 값과 모양을 정의하는 Storyboard 를 가져오거나 설정합니다.

public:
 property Storyboard ^ Storyboard { Storyboard ^ get(); void set(Storyboard ^ value); };
Storyboard Storyboard();

void Storyboard(Storyboard value);
public Storyboard Storyboard { get; set; }
var storyboard = visualState.storyboard;
visualState.storyboard = storyboard;
Public Property Storyboard As Storyboard
<VisualState>
  singleStoryboard
</VisualState>

속성 값

VisualState를 현재 시각적 상태로 사용할 때 컨트롤에 적용할 속성 변경 내용을 정의하는 Storyboard입니다.

예제

이 예제에서는 하나의 그리드를 포함하는 단추에 대한 간단한 ControlTemplate을 만듭니다. x:Name 특성 값이 "PointerOver"인 VisualState에는 사용자가 단추 위에 포인터를 놓을 때 단추 콘텐츠(그리드)의 색을 녹색에서 빨간색으로 변경하는 Storyboard가 있습니다. x:Name 특성 값이 "Normal"인 VisualState가 포함되어 사용자가 단추에서 포인터를 옮기면 Grid 배경이 녹색으로 돌아갑니다.

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

        <VisualStateGroup.Transitions>

          <!--Take one half second to transition to the PointerOver state.-->
          <VisualTransition To="PointerOver" 
                              GeneratedDuration="0:0:0.5"/>
        </VisualStateGroup.Transitions>
        
        <VisualState x:Name="Normal" />

        <!--Change the SolidColorBrush, ButtonBrush, to red when the
            Pointer is over the button.-->
        <VisualState x:Name="PointerOver">
          <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>

설명

Storyboard 속성의 값은 null이거나 단일 Storyboard 개체입니다. 스토리보드는 애니메이션용 컨테이너와 같습니다. 하나 이상의 애니메이션 정의를 포함할 수 있습니다. 이러한 각 애니메이션은 특정 명명된 대상에 대한 특정 종속성 속성을 대상으로 지정할 수 있습니다. 명명된 대상은 템플릿 자체에 정의된 Name 또는 x:Name 특성 값이 있는 컨트롤 템플릿의 요소여야 합니다. 종속성 속성은 해당 개체의 개체 모델에 있는 속성이거나 연결된 속성이어야 합니다. 애니메이션을 대상으로 하려면 Storyboard.TargetNameStoryboard.TargetProperty 연결된 속성을 사용합니다. XAML 구문을 사용하여 애니메이션을 정의하는 방법과 사용할 수 있는 애니메이션 유형에 대한 자세한 내용은 스토리보드 애니메이션을 참조하세요.

레이아웃에 영향을 주는 애니메이션은 잠재적으로 종속된 애니메이션으로, 컨트롤이 VisualState를 로드할 때 컨트롤 사용자에게 성능이 저하될 수 있습니다. 자세한 내용은 시각적 상태에 대한 스토리보드 애니메이션을 참조하세요.

적용 대상

추가 정보