본문 바로가기

Develop/MAUI 가이드

[Xamarin] ResourceDictionary 관리

반응형

ResourceDictionary 관리
XAML

ResourceDictionary

Xamarin 개발에서 Resource Dictionary는 반드시 사용하게 되는 클래스입니다. 특히 XAML 에서 Style 이나 IValueConverter, ContentTemplate, DataTemplate 등을 사용할 때 Resource Dictionary 를 사용하면 다른 XAML에서 공유하여 사용할 수 있습니다. 문제는 ResourceDictionary 를 분리하거나 합치는 방법을 모르면 하나의 파일 안에 모든 XAML 리소스를 관리해야 해서 Resoucre Dictionary가 매우 복잡해집니다. 이를 해결하기 위해 Resource Dictionary 가 다른 Resource Dictionary 를 참조하는 방법을 알려드리도록 하겠습니다.

<?xaml-comp compile="true" ?>

아래 코드 한 줄을 반드시 Resource Dictionary 에 포함시켜야 합니다.

<?xaml-comp compile="true" ?>

<?xml version="1.0" encoding="UTF-8"?>
<?xaml-comp compile="true" ?>
<ResourceDictionary xmlns="http://xamarin.com/schemas/2014/forms"
                    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">
</ResourceDictionary>

새로운 IValueConverter 클래스를 XAML에서 사용해보자!

1. ColorValueConverter 만들기

namespace Solution.Project
{
    class ColorValueConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            var color = (System.Drawing.Color)value;
            return new SKColor(color.R, color.G, color.B, color.A);
        }
        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            var skcolor = (SKColor)value;
            return System.Drawing.Color.FromArgb(skcolor.Alpha, skcolor.Red, skcolor.Green, skcolor.Blue);
        }
    }
}

2. ColorValueConverter를 Converter.xaml 에 정의하기

<!-- 파일 이름은 "Converter.xaml" 입니다. -->
<?xml version="1.0" encoding="UTF-8"?>
<?xaml-comp compile="true" ?>
<ResourceDictionary xmlns="http://xamarin.com/schemas/2014/forms"
                    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                    xmlns:local="clr-namespace:Solution.Project">
    <local:ColorValueConverter x:Key="ColorValueConverter"/>
</ResourceDictionary>

3. Converter.xaml 을 DataTemplate.xaml 에서 사용하기

<?xml version="1.0" encoding="UTF-8"?>
<?xaml-comp compile="true" ?>
<ResourceDictionary xmlns="http://xamarin.com/schemas/2014/forms"
                    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                    xmlns:local="clr-namespace:Solution.Project">
      <!-- "ResourceDictionary.MergedDictionaries" 로 합칠 ResourceDictionary를 지정합니다. -->
    <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source="Converter.xaml"/>
    </ResourceDictionary.MergedDictionaries>
      <!-- 합쳐도 기존에 StaticResource 를 사용하던 방법대로 Key 값만 입력해주면 됩니다.  -->
    <DataTemplate x:Key="SomeView">
        <local:SomeView Color="{Binding Color, Converter={StaticResource ColorValueConverter}}" />
    </DataTemplate>
</ResourceDictionary>

4. ContentView.xaml 에서 DataTemplate.xaml 사용하기

<?xml version="1.0" encoding="UTF-8"?>
<?xaml-comp compile="true" ?>
<ContentView
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    x:Class="Solution.Project.ContentView">
    <ContentView.Resources>
        <ResourceDictionary Source="DataTemplate.xaml"/>
    </ContentView.Resources>
    <ContentView.Content>
                           <!-- DataTemplate.xaml에 정의된 SomeView 를 사용합니다. -->
            <StackLayout
                         BindableLayout.ItemsSource="{Binding AList}"
                         BindableLayout.ItemTemplate="{StaticResource SomeView}">
            </StackLayout>
    </ContentView.Content>
</ContentView>
반응형