728x90
728x170
■ DoubleAnimation 엘리먼트를 사용해 스크롤 슬라이드 애니메이션을 만드는 방법을 보여준다.
▶ MainWindow.xaml
<Window x:Class="TestProject.TestWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="620"
Height="490"
Title="DoubleAnimation 엘리먼트 : 스크롤 슬라이드 사용하기"
FontFamily="나눔고딕코딩"
FontSize="16">
<Window.Resources>
<DoubleAnimation x:Key="MoveAnimationKey"
Storyboard.TargetName="imageSlideStackPanel"
Storyboard.TargetProperty="(Canvas.Left)"
SpeedRatio="2" />
</Window.Resources>
<Grid>
<Canvas
Width="600"
Height="450"
ClipToBounds="True">
<StackPanel x:Name="imageSlideStackPanel"
Canvas.Left="0"
Height="450"
Orientation="Horizontal">
<Image Width="600" Height="450" Source="IMAGE/1.png" />
<Image Width="600" Height="450" Source="IMAGE/2.png" />
<Image Width="600" Height="450" Source="IMAGE/3.png" />
<Image Width="600" Height="450" Source="IMAGE/4.png" />
<Image Width="600" Height="450" Source="IMAGE/5.png" />
<Image Width="600" Height="450" Source="IMAGE/6.png" />
</StackPanel>
</Canvas>
<StackPanel
Margin="5"
Height="30"
HorizontalAlignment="Right"
VerticalAlignment="Bottom"
Orientation="Horizontal">
<StackPanel.Resources>
<Style TargetType="TextBlock">
<Setter Property="Width" Value="25" />
<Setter Property="Opacity" Value="0.5" />
<Setter Property="Foreground" Value="White" />
<Setter Property="FontFamily" Value="Verdata" />
<Setter Property="FontSize" Value="30" />
<Setter Property="FontWeight" Value="Bold" />
<Setter Property="FontStyle" Value="Italic" />
<Setter Property="Cursor" Value="Hand" />
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Opacity" Value="1" />
</Trigger>
</Style.Triggers>
</Style>
</StackPanel.Resources>
<TextBlock Text="1" MouseDown="textBlock_MouseDown"></TextBlock>
<TextBlock Text="2" MouseDown="textBlock_MouseDown"></TextBlock>
<TextBlock Text="3" MouseDown="textBlock_MouseDown"></TextBlock>
<TextBlock Text="4" MouseDown="textBlock_MouseDown"></TextBlock>
<TextBlock Text="5" MouseDown="textBlock_MouseDown"></TextBlock>
<TextBlock Text="6" MouseDown="textBlock_MouseDown"></TextBlock>
</StackPanel>
</Grid>
</Window>
▶ MainWindow.xaml.cs
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media.Animation;
namespace TestProject
{
/// <summary>
/// 테스트 윈도우
/// </summary>
public partial class TestWindow : Window
{
//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
////////////////////////////////////////////////////////////////////////////////////////// Public
#region 생성자 - TestWindow()
/// <summary>
/// 생성자
/// </summary>
public TestWindow()
{
InitializeComponent();
}
#endregion
//////////////////////////////////////////////////////////////////////////////////////////////////// Method
////////////////////////////////////////////////////////////////////////////////////////// Private
#region 텍스트 블럭 마우슨 버튼 하강시 처리하기 - textBlock_MouseDown(sender, e)
/// <summary>
/// 텍스트 블럭 마우슨 버튼 하강시 처리하기
/// </summary>
/// <param name="sender">이벤트 발생자</param>
/// <param name="e">이벤트 인자</param>
private void textBlock_MouseDown(object sender, RoutedEventArgs e)
{
DoubleAnimation doubleAnimation = Resources["MoveAnimationKey"] as DoubleAnimation;
TextBlock textBlock = sender as TextBlock;
doubleAnimation.To = -(int.Parse(textBlock.Text) - 1) * 600;
this.imageSlideStackPanel.BeginAnimation(Canvas.LeftProperty, doubleAnimation, HandoffBehavior.Compose);
}
#endregion
}
}
728x90
그리드형(광고전용)
'C# > WPF' 카테고리의 다른 글
[C#/WPF] Window 클래스 : Background 속성을 사용해 배경색 변경하기 (0) | 2018.03.10 |
---|---|
[C#/WPF] Application, Window 클래스 상속하기 (0) | 2018.03.10 |
[C#/WPF] XAML에서 특수 문자 사용하기 (0) | 2018.03.04 |
[C#/WPF] MediaElement 클래스 사용하기 (0) | 2018.02.18 |
[C#/WPF] RotateTransform 엘리먼트 : 마우스 진입시 이미지 회전하기 (0) | 2018.02.18 |
[C#/WPF] 이미지 뒤집기 (0) | 2018.02.18 |
[C#/WPF] 이미지 뒤집기 (0) | 2018.02.18 |
[C#/WPF] 이미지 슬라이드 쇼 보여주기 (0) | 2018.02.18 |
[C#/WPF] 애니메이션 사용하기 (0) | 2018.02.18 |
[C#/WPF] XAML 시계 사용하기 (0) | 2018.02.18 |