■ TabControl 클래스의 SelectionChanged 이벤트를 사용해 탭 전환시 애니메이션을 만드는 방법을 보여준다.
▶ MainWindow.xaml
|
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 43 |
<Window x:Class="TestProject.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="800" Height="600" Title="TabControl 클래스 : SelectionChanged 이벤트를 사용해 탭 전환시 애니메이션 사용하기" FontFamily="나눔고딕코딩" FontSize="16"> <Grid> <Grid.Resources> <DataTemplate x:Key="TabTemplateKey"> <Grid Name="tabGrid"> <ContentControl Margin="10" Content="{Binding}" /> </Grid> </DataTemplate> </Grid.Resources> <TabControl Name="tabControl" Width="500" Height="500" ContentTemplate="{StaticResource TabTemplateKey}" TabStripPlacement="Top"> <TabItem Header="적색"> <Grid Background="Red"> <TextBlock Text="적색 탭 입니다." /> </Grid> </TabItem> <TabItem Header="녹색"> <Grid Background="Green"> <TextBlock Text="녹색 탭 입니다." /> </Grid> </TabItem> <TabItem Header="청색"> <Grid Background="Blue"> <TextBlock Text="청색 탭 입니다." /> </Grid> </TabItem> </TabControl> </Grid> </Window> |
▶ MainWindow.xaml.cs
|
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 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 |
using System; using System.Collections.Generic; using System.Windows; using System.Windows.Controls; using System.Windows.Media; using System.Windows.Media.Animation; namespace TestProject { /// <summary> /// 메인 윈도우 /// </summary> public partial class MainWindow : Window { //////////////////////////////////////////////////////////////////////////////////////////////////// Field ////////////////////////////////////////////////////////////////////////////////////////// Private #region Field /// <summary> /// 이전 인덱스 /// </summary> private int previousIndex = -1; /// <summary> /// 현재 인덱스 /// </summary> private int currentIndex = -1; #endregion //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor ////////////////////////////////////////////////////////////////////////////////////////// Public #region 생성자 - MainWindow() /// <summary> /// 생성자 /// </summary> public MainWindow() { InitializeComponent(); this.tabControl.SelectionChanged += tabControl_SelectionChanged; } #endregion //////////////////////////////////////////////////////////////////////////////////////////////////// Method ////////////////////////////////////////////////////////////////////////////////////////// Private //////////////////////////////////////////////////////////////////////////////// Event #region 탭 컨트롤 선택 변경시 처리하기 - tabControl_SelectionChanged(sender, e) /// <summary> /// 탭 컨트롤 선택 변경시 처리하기 /// </summary> /// <param name="sender">이벤트 발생자</param> /// <param name="e">이벤트 인자</param> private void tabControl_SelectionChanged(object sender, SelectionChangedEventArgs e) { this.currentIndex = (sender as TabControl).SelectedIndex; if(this.previousIndex != this.currentIndex) { foreach(Grid tabGrid in FindVisualChildren<Grid>(this)) { if(tabGrid.Name == "tabGrid") { DoubleAnimation animation = null; if(this.previousIndex > this.currentIndex) { animation = new DoubleAnimation() { Duration = TimeSpan.FromSeconds(0.3), From = -300, To = 0 }; } else { animation = new DoubleAnimation() { Duration = TimeSpan.FromSeconds(0.3), From = 300, To = 0 }; } TranslateTransform transform = new TranslateTransform(); transform.BeginAnimation(TranslateTransform.XProperty, animation); tabGrid.RenderTransform = transform; this.previousIndex = this.currentIndex; } } } } #endregion //////////////////////////////////////////////////////////////////////////////// Function #region 비주얼 자식 찾기 - FindVisualChildren<T>(parent) /// <summary> /// 비주얼 자식 찾기 /// </summary> /// <typeparam name="TChild">자식 타입</typeparam> /// <param name="parent">부모 의존 객체</param> /// <returns>자식 열거 가능형</returns> private IEnumerable<TChild> FindVisualChildren<TChild>(DependencyObject parent) where TChild : DependencyObject { if(parent != null) { for(int i = 0; i < VisualTreeHelper.GetChildrenCount(parent); i++) { DependencyObject child = VisualTreeHelper.GetChild(parent, i); if(child != null && child is TChild) { yield return (TChild)child; } foreach(TChild grandChild in FindVisualChildren<TChild>(child)) { yield return grandChild; } } } } #endregion } } |
