2009-08-14 5 views
4

height 속성에 애니메이션을 적용하여 ItemsSource를 확장하고 축소하는 이미지에 트리거가 있어야합니다.WPF 애니메이션 확장 - 계약 높이

ObservableCollection에 바인딩 된 일반적인 ItemsSource가 있으므로이 컨트롤의 전체 높이를 알 수 없습니다.

일단 이미지를 클릭하면 항목 소스가 확장되었음을 보여주기 위해 이미지 원본 글리프가 변경되어야합니다. 다시 클릭하면 ItemsSource가 현재 높이에서 0으로 축소되기 시작해야합니다. 첫 번째 애니메이션이 완료되지 않을 수 있기 때문입니다.

현재 나는 다음과 같은 이미지 트리거가 있습니다

<Image Name="ExpandImage" Source="ArrowDown.png"> 
      <Image.Triggers> 
       <EventTrigger RoutedEvent="Image.MouseLeftButtonDown"> 
        <EventTrigger.Actions> 
         <BeginStoryboard> 
          <Storyboard> 
           <DoubleAnimation Storyboard.TargetProperty="Height"              
              Storyboard.TargetName="myItemsControl" 
              From="0" To="300" Duration="0:0:2" /> 
          </Storyboard> 
         </BeginStoryboard> 
        </EventTrigger.Actions> 
       </EventTrigger> 
      </Image.Triggers> 
     </Image> 

가 고정 된 높이에 애니메이션 때문 못생긴 - 나는 ItemsControl에의 총 (알 수없는 높이)에 애니메이션을해야합니다. 또한 단방향 (확장) 애니메이션 만 지원합니다.

내 ItemsControl에 간단하다 :

<ItemsControl Name="myItemsControl" 
     ItemsSource="{Binding Items}" Height="0" > 
     <ItemsControl.ItemTemplate> 
      <DataTemplate> 
       <c:CustomUserControl/> 
      </DataTemplate> 
     </ItemsControl.ItemTemplate> 
    </ItemsControl> 

답변

1

당신은 ... 음,의 ActualHeight 속성을 제어하는 ​​항목의 실제 높이를 얻을 수 있습니다. 문제는 그것이 의존성 속성이 아니라는 것입니다. 그러나 Kent Boogaart와 같은 연결된 동작을 사용하여 this answer에 바인딩 할 수 있습니다.

실제 높이에 바인딩해야합니다. 나는 당신에게 붙어있는 행동을 쓰도록 맡길 것입니다. :)