반응형
Property Trigger에 이어 이번엔 Event Trigger다
Event Trigger는 특정 Event가 발생되었을때 수행되는 Trigger다
코드 ㄱㄱ
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
|
<Window x:Class="TestProject.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:TestProject"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Grid>
<Rectangle Name="rctback" HorizontalAlignment="Left" Height="100" Stroke="Black" VerticalAlignment="Top" Width="100" Margin="178,92,0,0" >
<Rectangle.Style>
<Style TargetType="Rectangle">
<Setter Property="Fill" Value="Green"></Setter>
<Style.Triggers>
<EventTrigger RoutedEvent="MouseEnter">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Duration="0:0:0.800" Storyboard.TargetProperty="Height" To="300" />
<DoubleAnimation Duration="0:0:0.800" Storyboard.TargetProperty="Width" To="300" />
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
<EventTrigger RoutedEvent="MouseLeave">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Duration="0:0:0.800" Storyboard.TargetProperty="Height" To="100" />
<DoubleAnimation Duration="0:0:0.800" Storyboard.TargetProperty="Width" To="100" />
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Style.Triggers>
</Style>
</Rectangle.Style>
</Rectangle>
</Grid>
</Window>
|
cs |
코드가 길긴하지만..... 보면 뭐 없는 코드다.
일단 1개의 Rectangle을 선언해주고.. 그 Rectangle의 Style을 지정해준다.
그후 Event Trigger를 선언..!!
마우스가 Rectangle 위로 올라왔을때와 내려왔을때 2가지를 선언해주고.
Rectangle의 Width, Height를 수정하는 애니메이션을 발동시켰다..
DoubleAnimation등은 추후에 추가로 작성하는 것으로 하고... 간단히 설명하면 800 밀리세컨드동안 Width, Height를 100-300 으로 수정하는 애니메이션일 뿐이다.
해당 코드를 수행하면
 |
 |
요롷게 될 것이다.
막상 코드를 작성하고 실행해보면 어려울게없을 것이다.
코드는 여기
반응형