WPF 그들의 사랑을 쉽게 보다 나는 그것을 만들기
문제
나는 알겠지만 시간을 파악해 이웃:는 말은 두 가지 버튼을 세 textblock 은.내가 원하는 버튼을 트리거하는 간단한 스토리보드에서 모든 textblock 은.현재 저는 정의하고자 노력하고 일반 Textblock 스타일을 포함하는 스토리,그리고 다음 방아쇠에서 온 어떤 버튼을 클릭합니다.이것은 가장 가까이 왔어요 하지만 응용 프로그램에 충돌을 시작...나는 무엇을 하지 않기:
<Window.Resources>
<Style TargetType="TextBlock" >
<Setter Property="Foreground" Value="Blue" />
<Style.Resources>
<Storyboard x:Key="TextBlockOpacity" Storyboard.TargetProperty="Opacity">
<DoubleAnimation From="0" To="1" />
</Storyboard>
</Style.Resources>
</Style>
<Window.Triggers>
<EventTrigger RoutedEvent="ButtonBase.Click" SourceName="button">
<BeginStoryboard Storyboard="{StaticResource TextBlockOpacity}"/>
</EventTrigger>
</Window.Triggers>
<Grid x:Name="LayoutRoot">
<Button x:Name="button" HorizontalAlignment="Left" Margin="51,54,0,0" VerticalAlignment="Top" Width="96" Height="45" Content="Button"/>
<TextBlock x:Name="textBlock1" Margin="228,54,172,0" VerticalAlignment="Top" Height="45" FontSize="26.667" Text="TextBlock" TextWrapping="Wrap" />
<TextBlock x:Name="textBlock2" Margin="228,103,172,0" VerticalAlignment="Top" Height="45" FontSize="26.667" Text="Hello" TextWrapping="Wrap"/>
</Grid>
해결책
KEK444의 XAML 전용 솔루션을 기반으로, 버튼의 데이터 콘텍스트에 의존하지 않고 여러 트리거를 가질 수있는 약간 향상된 버전을 제시합니다.
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="WpfApplication1.MainWindow"
x:Name="Window"
Title="MainWindow"
Width="640" Height="480">
<Window.Resources>
<UIElement x:Key="OpacityCounter" Opacity="0"/>
<Style TargetType="TextBlock">
<Setter Property="Opacity" Value="{Binding Source={StaticResource OpacityCounter}, Path=Opacity}" />
</Style>
<Storyboard x:Key="OnClick1">
<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.Target="{StaticResource OpacityCounter}" Storyboard.TargetProperty="(UIElement.Opacity)">
<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
<SplineDoubleKeyFrame KeyTime="00:00:00.5000000" Value="1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</Window.Resources>
<Window.Triggers>
<EventTrigger RoutedEvent="ButtonBase.Click" SourceName="button1">
<BeginStoryboard Storyboard="{StaticResource OnClick1}"/>
</EventTrigger>
<EventTrigger RoutedEvent="ButtonBase.Click" SourceName="button2">
<BeginStoryboard Storyboard="{StaticResource OnClick1}"/>
</EventTrigger>
</Window.Triggers>
<Grid x:Name="LayoutRoot">
<StackPanel>
<StackPanel Orientation="Horizontal">
<Button x:Name="button1" Width="131" Height="37" Content="Button 1" Margin="0,0,0,22"/>
<Button x:Name="button2" Width="131" Height="37" Content="Button 2" Margin="0,0,0,22"/>
</StackPanel>
<TextBlock x:Name="textBlock" Height="27" Text="TextBlock 1" TextWrapping="Wrap" />
<TextBlock x:Name="textBlock1" Height="27" Text="TextBlock 2" TextWrapping="Wrap" />
<TextBlock x:Name="textBlock2" Height="27" Text="TextBlock 3" TextWrapping="Wrap" />
<TextBlock x:Name="textBlock3" Height="27" Text="TextBlock 4" TextWrapping="Wrap" />
</StackPanel>
</Grid>
</Window>
ListBox를 트리거 메커니즘으로 사용하려면 ( "ListBox1"라는 ListBox가있는 경우 Window.Triggers에 다음을 추가하십시오.
<EventTrigger RoutedEvent="Selector.SelectionChanged" SourceName="listbox1">
<BeginStoryboard Storyboard="{StaticResource OnClick1}"/>
</EventTrigger>
또는 특정 ListBoxItem을 트리거하려면 필요합니다 (여기서 Item1은 명명 된 ListBoxItem입니다).
<EventTrigger RoutedEvent="ListBoxItem.Selected" SourceName="item1">
<BeginStoryboard Storyboard="{StaticResource OnClick1}"/>
</EventTrigger>
다른 팁
는 경우 당신은"헌신"버튼을 변경하는 불투명도 수로 활용할 수 있게 해주 DataContext
애니메이션니다.다음 단순히 묶는 당신의 요소' Opacity
을 DataContext
:
(나는 또한 refactor xaml 조금)
<Window x:Class="SomeNamespace.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:System="clr-namespace:System;assembly=mscorlib"
Title="Window1" Height="300" Width="300">
<Window.Resources>
<Storyboard x:Key="TextBlockOpacity" Storyboard.TargetName="button1" Storyboard.TargetProperty="DataContext" >
<DoubleAnimation From="0.1" To="1"/>
</Storyboard>
<Style TargetType="TextBlock" >
<Setter Property="Foreground" Value="Blue" />
<Setter Property="Background" Value="LightGray" />
<Setter Property="FontSize" Value="26.667" />
<Setter Property="TextWrapping" Value="Wrap" />
<Setter Property="Height" Value="45" />
<Setter Property="Opacity" Value="{Binding ElementName=button1, Path=DataContext}"/>
</Style>
</Window.Resources>
<Window.Triggers>
<EventTrigger RoutedEvent="ButtonBase.Click">
<BeginStoryboard Storyboard="{StaticResource TextBlockOpacity}" >
</BeginStoryboard>
</EventTrigger>
<EventTrigger RoutedEvent="ListBox.SelectionChanged">
<BeginStoryboard Storyboard="{StaticResource TextBlockOpacity}" >
</BeginStoryboard>
</EventTrigger>
</Window.Triggers>
<Grid x:Name="LayoutRoot">
<Button x:Name="button1" HorizontalAlignment="Left" Margin="51,54,0,0" VerticalAlignment="Top" Width="96" Height="45" Content="Button">
<Button.DataContext>
<System:Double>0</System:Double>
</Button.DataContext>
</Button>
<Button x:Name="button2" HorizontalAlignment="Right" Margin="0,54,29,0" VerticalAlignment="Top" Width="96" Height="45" Content="Button"/>
<ListBox x:Name="listBox1" Height="50" VerticalAlignment="Top">
<ListBox.Items>
<System:String>Text1</System:String>
<System:String>Text2</System:String>
</ListBox.Items>
</ListBox>
<TextBlock x:Name="textBlock1" Margin="51,114,61,0" Text="TextBlock" Height="45" VerticalAlignment="Top" Width="166" />
<TextBlock x:Name="textBlock2" Margin="51,0,74,42" Text="Hello" Height="45" Width="153" VerticalAlignment="Bottom" />
</Grid>
</Window>
또한 한 가지는 이 방법을 사용하려면 최소화하는 코드 고 그 모든 일에 xaml.귀하의 접근 방식 anmate 의 Opacity
의 전체 창입니다.그 이유는 위 코드에서 textblock 은 바인딩을 버튼 DataContext
, 자체 애니메이션입니다.
그것은 물론 없이 할 수 있는 바인딩하는 일반적인 값(이 매핑되),그러나 당신은 당신을 반복해야 X 애니메이션(기 때문에 설정해야 합 X TargetNames).이 방법 위에 더 쉽게 확장 가능하고 유지 관리할 수 있습니다.
편집
추가 또 다른 버튼과 목록 상자에 대한 다양한:)
샘플에서는 스타일 내부의 스토리 보드를 리소스로 정의하지만 창자 자원으로 액세스하려고합니다. 스토리 보드 선언을 Window.Resources로 이동 한 다음 스토리 보드를 스타일로 참조하십시오.
그것이 당신이 원하는 것을 할 것인지 모르겠지만, 나는 거기서 시작할 것입니다.