[MAUI] 바인딩 값 변환기 (IValueConverter)

 

MAUI 바인딩은 일반적으로 원본 속성에서 대상 속성으로 데이터를 전송하고 경우에 따라 대상 속성에서 원본 속성으로 데이터를 전송한다. 데이터 바인딩의 속성을 이용하여 다른 형식의 변환을 원하는 경우 IValueConverter 인터페이스를 구현하는 클래스에 일부 특수한 코드를 작성하면 된다. IValueConverter를 구현하는 클래스를 값 변환기 / 바인딩 변환기 / 바인딩 값 변환기라고 한다.

 

IValueConverter

IValueConverter는 기본적으로 Convert, ConvertBack 메서드를 갖고 있다. 바인딩 값 변환을 하기 위한 인터페이스이다.

IValueConverter

728x90

Convert

public object Convert(object value, Type targetType, object parameter, CultureInfo culture)

데이터가 원본에서 OneWay or TwoWay 바인딩의 대상으로 이동하는 경우 Convert 메서드가 호출된다. value 매개 변수는 데이터 바인딩 원본의 개체 또는 값이다.

 

ConvertBack

public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)

데이터가 대상에서 TwoWay or OneWayToSource 바인딩의 원본으로 이동하는 경우 ConvertBack 메서드가 호출된다.

ConvertBack은 반대 변환을 수행한다.

 

 

반응형

 

예시

IsExitConvert Class

class IsExitConvert : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        return (int)value != 0;;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        return (bool)value ? 1 : 0;
    }
}

 

TestPage.xaml

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage
    x:Class="MauiApp1.TestPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:MauiApp1.Class"
    Title="TestPage"
    Padding="20">

    <ContentPage.Resources>
        <local:IsExitConvert x:Key="isExitConvert" />

        <Style x:Key="labelStyle" TargetType="Label">
            <Setter Property="FontSize" Value="18" />
            <Setter Property="HorizontalTextAlignment" Value="Center" />
            <Setter Property="VerticalOptions" Value="Center" />
        </Style>
    </ContentPage.Resources>

    <StackLayout>

        <Entry
            x:Name="entry1"
            Margin="20,20,20,10"
            Placeholder="input"
            Text="" />

        <Button
            Margin="20,0,20,20"
            IsEnabled="{Binding Source={x:Reference entry1}, Path=Text.Length, Converter={StaticResource isExitConvert}}"
            Text="button" />

    </StackLayout>

</ContentPage>

 

빈값 인경우 버튼 비활성화

값이 있는 경우 버튼 활성화

 

해당 코드는 Entry 속성에 값이 있으면 버튼이 활성화되고 없을 경우 버튼을 비활성화하도록 되어있다. Button의 Converter 속성에 미리 정의해둔 ixExitConvert를 설정하여 필요한 값을 Path를 통해 Value에서 받도록 처리했다.

 

값 변환기 클래스에 속성 및 일반매개변수가 있을 수 있습니다. 바인딩 변환기 속성 페이지를 통해 추가적으로 알 수 있습니다. 

[참고]

https://learn.microsoft.com/ko-kr/dotnet/maui/fundamentals/data-binding/converters

바인딩 값 변환기 - .NET MAUI