ListboxItem의 여러 상태 사이의 애니메이션

선택한 항목이 다른 항목보다 자세히 표시되는 ListBox를 구현하려고합니다. 하나의 접근법은 Josh Smith가 his blog에 표시합니다.ListboxItem의 여러 상태 사이의 애니메이션

사용자 환경을 개선하기 위해 변경 사항을 애니메이션화 (예 : 항목이 커지면서 추가 정보가 사라지는 현상)하고 싶습니다. I이 상세도에 대한 재사용 주형이없는

것을 스토리가 disadvandates을 가지고 시작하는 DataTriggers Enter- 또는 ExitActions 사용 은 (단지 애니메이션의 종료 상태로 존재한다).
한 번만이 아니라 두 애니메이션에서 상세보기 hs가 변경 될 때마다 변경됩니다.

더 쉽게 유지 보수 할 수있는 다른 접근 방법이 있습니까?

2011-07-26 Jens

WCF4를 사용하는 경우 VisualStateManager를 살펴보십시오. 이 링크는 2007 년 기사를 가리 킵니다. http://windowsclient.net/wpf/wpf35/wpf-35sp1-toolkit-visual-state-manager-overview.aspx –

@Henk이 VisualStateManager에 대한 해결책입니다. (그는 분명히 WCF 4 대신 WPF 4를 입력 할 예정이었습니다) –

이 ListBox.ItemContainerStyle을 사용하고 필요에 맞게 조정할 수 있습니다.

<Style TargetType="{x:Type ListBoxItem}"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type ListBoxItem}">         
       <Border> 
        <StackPanel> 
         <ContentPresenter x:Name="Compact" 
           Opacity="1" 
           ContentTemplate="{StaticResource UnselectedDataTemplate}"> 
          <ContentPresenter.LayoutTransform> 
           <ScaleTransform ScaleY="1" /> 
          </ContentPresenter.LayoutTransform> 
         </ContentPresenter> 

         <ContentPresenter x:Name="Details" 
           Opacity="0" 
           ContentTemplate="{StaticResource SelectedDataTemplate}"> 
          <ContentPresenter.LayoutTransform> 
           <ScaleTransform ScaleY="0" /> 
          </ContentPresenter.LayoutTransform> 
         </ContentPresenter> 
        </StackPanel> 

        <VisualStateManager.VisualStateGroups> 
         <VisualStateGroup Name="SelectionStates"> 
          <VisualState Name="Unselected"> 
           <Storyboard SpeedRatio="2"> 
            <DoubleAnimation To="1" 
              Storyboard.TargetName="Compact" 
              Storyboard.TargetProperty="Opacity" /> 
            <DoubleAnimation To="1" 
              Storyboard.TargetName="Compact" 
              Storyboard.TargetProperty="LayoutTransform.(ScaleTransform.ScaleY)" /> 
            <DoubleAnimation To="0" 
              Storyboard.TargetName="Details" 
              Storyboard.TargetProperty="Opacity" /> 
            <DoubleAnimation To="0" 
              Storyboard.TargetName="Details" 
              Storyboard.TargetProperty="LayoutTransform.(ScaleTransform.ScaleY)" /> 
           </Storyboard> 
          </VisualState> 

          <VisualState Name="Selected"> 
           <Storyboard SpeedRatio="2"> 
            <DoubleAnimation To="0" 
              Storyboard.TargetName="Compact" 
              Storyboard.TargetProperty="Opacity" /> 
            <DoubleAnimation To="0" 
              Storyboard.TargetName="Compact" 
              Storyboard.TargetProperty="LayoutTransform.(ScaleTransform.ScaleY)" /> 
            <DoubleAnimation To="1" 
              Storyboard.TargetName="Details" 
              Storyboard.TargetProperty="Opacity" /> 
            <DoubleAnimation To="1" 
              Storyboard.TargetName="Details" 
              Storyboard.TargetProperty="LayoutTransform.(ScaleTransform.ScaleY)" /> 
           </Storyboard> 
          </VisualState> 
         </VisualStateGroup> 
        </VisualStateManager.VisualStateGroups> 
       </Border>        
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style>

이 경우에는 내가 자원으로 템플릿을 선언했다.

<DataTemplate x:Key="UnselectedDataTemplate"> 
    /* your controls for unselected state */ 
</DataTemplate> 
<DataTemplate x:Key="SelectedDataTemplate"> 
    /* your controls for selected state */ 
</DataTemplate>

는하지만 ContentPresenter.Content에 직접 datatemplated 내용을 바인딩도 가능하다고 생각.

하면 자세한 단순히 Storyboard.TargetName="Compact"와 Storyboard에서 모든 DoubleAnimation을 제거, 추가하지 컴팩트를 교체합니다.

희망 사항.

출처

2011-08-04 14:39:52 LPL

ListboxItem의 여러 상태 사이의 애니메이션

답변

관련 문제