SkinnedApplication
WPF 어플리케이션의 스킨을 동적으로 설정 및 변경하는 샘플 입니다.
이 샘플은 응용 프로그램 수준의 속성과 리소스를 사용하기에 먼저 응용 프로그램 속성 및 리소스를 살펴 보겠습니다.
Application Property
응용 프로그램 범위의 Dictionary 형식으로 Application.Properties 속성을 통해 설정 및 조회 할 수 있습니다. 응용 프로그램 공유 설정으로 런타임에 설정 및 접근이 가능 합니다.
1:
2: Application.Current.Properties["Blue"] = new object();
3:
4: object property = Application.Current.Properties["Blue"];
Application Resources
응용 프로그램 범위의 ResourceDictionary 형식으로 Application.Resources 속성을 통해 설정 및 조회 할 수 있습니다. 응용 프로그램 공유 리소스로 런타임에 설정 및 접근이 가능 합니다.
1: Application.Current.Resources.Add("KeyName", "Value");
2: object get = Application.Current.Resources["KeyName"];
위에 설명한 내용을 토대로 설정된 두 개의 스킨을 동적으로 변경하여 적용되는 샘플을 만들어 보겠습니다.
ResourceDictionary 구성
프로젝트 > 추가 > 리소스 사전.. 을 통해 YellowSkin.xaml과 Blue.xaml을 생성 합니다.
YellowSkin.xaml
1:
2: <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
3: xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4: xmlns:local="clr-namespace:SkinnedApplication">
5: <Style TargetType="{x:Type Button}">
6: <Setter Property="Background" Value="Yellow" />
7: </Style>
8: <Style TargetType="{x:Type local:ChildWindow}">
9: <Setter Property="Background" Value="Yellow" />
10: </Style>
11: <Style TargetType="{x:Type local:MainWindow}">
12: <Setter Property="Background" Value="Yellow" />
13: </Style>
14: </ResourceDictionary>
BlueSkin.xaml
1:
2: <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
3: xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4: xmlns:local="clr-namespace:SkinnedApplication">
5: <Style TargetType="{x:Type Button}">
6: <Setter Property="Background" Value="Blue" />
7: </Style>
8: <Style TargetType="{x:Type local:ChildWindow}">
9: <Setter Property="Background" Value="Blue" />
10: </Style>
11: <Style TargetType="{x:Type local:MainWindow}">
12: <Setter Property="Background" Value="Blue" />
13: </Style>
14: </ResourceDictionary>
Application Property 설정
응용프로그램 시작 시 발생하는 Startup 이벤트에서 ResourceDictionary 파일을 읽어 Properties 속성에 설정 합니다.
1: private void Application_Startup(object sender, StartupEventArgs e)
2: {
3: Properties["Blue"] = (ResourceDictionary)LoadComponent(new Uri("BlueSkin.xaml", UriKind.Relative));
4: Properties["Yellow"] = (ResourceDictionary)LoadComponent(new Uri("Yellow
Skin.xaml", UriKind.Relative));
5: }
창 구성
자식 창을 생성하는 Button과 스킨을 변경 선택 할 수 있는 ComboBox로 구성 합니다.
1: <Window x:Class="SkinnedApplication.MainWindow"
2: xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
3: xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4: xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
5: xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
6: xmlns:local="clr-namespace:SkinnedApplication"
7: mc:Ignorable="d"
8: Title="MainWindow" Height="350" Width="525">
9: <StackPanel>
10: <Button Name="newChildWindowButton" Click="newChildWindowButton_Click">New ChildWindow</Button>
11: <StackPanel Orientation="Horizontal">
12: <Label>Skin:</Label>
13: <ComboBox Name="skinComboBox" />
14: </StackPanel>
15: </StackPanel>
16: </Window>
ChildWindow라는 Window를 생성 합니다. (이 샘플에는 자식 요소에도 스킨이 적용되는 것을 확인 하는 용도로만 사용합니다.)
창 초기화
스킨을 동적으로 선택 할 수 있도록 ComboBox의 Item을 추가 및 아이템 변경 시 발생하는 이벤트 등록을 합니다. 첫 스킨을 Blue로 초기화 합니다.
1: public MainWindow()
2: {
3: InitializeComponent();
4: // ComboBox 아이템 추가
5: skinComboBox.Items.Add("Blue");
6: skinComboBox.Items.Add("Yellow");
7: skinComboBox.SelectedIndex = 0;
8: // 스킨 초기화
9: Application.Current.Resources = (ResourceDictionary)Application.Current.Properties["Blue"];
10: // 스킨 변경 이벤트 설정
11: skinComboBox.SelectionChanged += SkinComboBox_SelectionChanged;
12: }
스킨 변경 이벤트
사용자가 선택 한 스킨을 응용 프로그램 속성을 통해 스킨으로 설정 합니다.
1: private void SkinComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
2: {
3:
4: string selectedValue = (string)e.AddedItems[0];
5: Application.Current.Resources = (ResourceDictionary)Application.Current.Properties[selectedValue];
6: }
결과 화면
댓글
댓글 쓰기