XAML 및 WPF를 사용하면 클릭시 속성을 애니메이션 한 다음 연속 클릭으로 반대하는 방법
-
13-09-2019 - |
문제
XAML 만 사용하여 속성에서 애니메이션을 수행 한 다음 다음 번 클릭에서 리버스 애니메이션을 수행하는 방법이 있는지 알고 싶습니다.
다음은 국경 개체에있는 방아쇠 샘플입니다.
<!-- Animates the Width to Slide It Out. -->
<EventTrigger RoutedEvent="Border.MouseLeftButtonUp">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="theFilterControl"
Storyboard.TargetProperty="Width"
From="16"
To="170"
Duration="0:0:.7" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
해결책
ToggleButton 용 ControlTemplate을 만들고 테두리를 넣을 수 있습니다. 버튼 ControlTemplate은 애니메이션에 대한 속성을 제공 할 수 있습니다.
<ToggleButton>
<ToggleButton.Template>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<Border x:Name="theFilterControl" Background="#FF686868"
BorderBrush="Black" Width="16" />
<ControlTemplate.Triggers>
<EventTrigger RoutedEvent="ToggleButton.Checked">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="theFilterControl"
Storyboard.TargetProperty="Width"
From="16"
To="170"
Duration="0:0:.7" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
<EventTrigger RoutedEvent="ToggleButton.Unchecked">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="theFilterControl"
Storyboard.TargetProperty="Width"
From="170"
To="16"
Duration="0:0:.7" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</ToggleButton.Template>
</ToggleButton>
다른 팁
Jobi의 Togglebutton에 대한 좋은 아이디어, 감사합니다! ControlTemplate 외부 및 UserControl (또는 페이지) 트리거 내부 (예 :
<UserControl.Triggers>
<EventTrigger RoutedEvent="ToggleButton.Checked"
SourceName="ExpandCollapseToggleButton">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="SidebarCanvas"
Storyboard.TargetProperty="Width"
To="0"
Duration="0:0:0.15" />
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
<EventTrigger RoutedEvent="ToggleButton.Unchecked"
SourceName="ExpandCollapseToggleButton">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="SidebarCanvas"
Storyboard.TargetProperty="Width"
To="250"
Duration="0:0:0.15" />
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</UserControl.Triggers>
ControlTemplate의 범위는 UserControl/Page와 완전히 다른 것으로 보이므로 이러한 범위 사이의 대상을 참조 할 수 없습니다.
제휴하지 않습니다 StackOverflow