.NET MAUI에서 사용자 지정 렌더러 다시 사용

아티클
05/14/2024

.NET 다중 플랫폼 앱 UI(.NET MAUI) 처리기를 사용하여 컨트롤을 사용자 지정하고 만들 때 많은 이점이 있지만.NET MAUI 앱에서 Xamarin.Forms 사용자 지정 렌더러를 사용할 수 있습니다. 사용자 지정 렌더러에 대한 자세한 내용은 Xamarin.Forms 사용자 지정 렌더러를 참조 하세요.

스밍 렌더러

.NET MAUI는 렌더러가 파생 FrameRendererListViewRendererShellRenderer 되는 경우, iOS 및 AndroidTableViewRendererVisualElementRenderer에서 Xamarin.Forms 사용자 지정 렌더러를 쉽게 다시 사용할 수 있도록 하는 쉬밍 렌더러를 제공합니다.

, , ShellRendererTableViewRenderer및 VisualElementRenderer .NET MAUI 쉬밍 렌더러에서 FrameRendererListViewRenderer파생되는 Xamarin.Forms 사용자 지정 렌더러를 마이그레이션하는 프로세스는 다음과 같습니다.

.NET MAUI 프로젝트의 적절한 위치에 사용자 지정 렌더러 코드를 추가합니다. 자세한 내용은 코드 추가를 참조하세요.
지시문을 using 수정하고 특성을 제거 ExportRenderer 합니다. 자세한 내용은 지시문 및 기타 코드를 사용하여 수정을 참조하세요.
렌더러를 등록합니다. 자세한 내용은 렌더러 등록을 참조 하세요.
렌더러를 사용합니다. 자세한 내용은 사용자 지정 렌더러 사용 방법을 참조 하세요.

.NET MAUI에서 사용자 지정 렌더러를 사용하는 방법을 보여 주려면 명명 PressableView된 Xamarin.Forms 컨트롤을 고려합니다. 이 컨트롤은 PressedReleased 플랫폼별 제스처를 기반으로 이벤트를 노출합니다. 사용자 지정 렌더러 구현은 3개 파일로 구성됩니다.

PressableView.cs - 확장되는 플랫폼 간 클래스입니다 ContentView.
PressableViewRenderer.cs - 에서 파생 VisualElementRenderer되는 Android 구현입니다.
PressableViewRenderer.cs - 에서 파생되는 iOS 구현입니다 VisualElementRenderer.

참고 항목

.NET MAUI에서 Xamarin.Forms 사용자 지정 렌더러를 사용하는 대신 사용자 지정 렌더러를 .NET MAUI 처리기로 마이그레이션하는 것입니다. 자세한 내용은 Xamarin.Forms 사용자 지정 렌더러를 .NET MAUI 처리기로 마이그레이션을 참조 하세요.

코드 추가

.NET MAUI 다중 대상 프로젝트를 사용하는 경우 플랫폼 간 파일을 Platforms 폴더 외부로 이동할 수 있으며 플랫폼별 구현 파일을 해당 Platform 폴더로 이동해야 합니다.

렌더러 파일을 이동합니다.

솔루션에 플랫폼당 별도의 프로젝트가 있는 경우 플랫폼별 구현 파일을 해당 프로젝트로 이동해야 합니다.

지시문 및 기타 코드를 사용하여 수정

네임스페이 Xamarin.Forms.* 스에 대한 모든 참조를 제거한 다음 관련 형식 Microsoft.Maui.*을 확인할 수 있습니다. 이 문제는 .NET MAUI 프로젝트에 추가한 모든 파일에서 발생해야 합니다.

또한 .NET MAUI에서 필요하지 않으므로 특성을 ExportRenderer 제거해야 합니다. 예를 들어 다음을 제거해야 합니다.

[assembly: ExportRenderer(typeof(PressableView), typeof(PressableViewRenderer))]

렌더러 등록

플랫폼 간 컨트롤 및 해당 렌더러를 사용하려면 먼저 앱에 등록해야 합니다. 이 문제는 앱 프로젝트의 클래스에서 MauiProgram 앱의 플랫폼 간 진입점인 메서드에서 발생 CreateMauiApp 합니다.

public static class MauiProgram
{
    public static MauiApp CreateMauiApp()
    {
        var builder = MauiApp.CreateBuilder();
        builder
            .UseMauiApp<App>()
            .ConfigureFonts(fonts =>
            {
                fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
                fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
            })
            .ConfigureMauiHandlers((handlers) =>
            {
#if ANDROID
                handlers.AddHandler(typeof(PressableView), typeof(XamarinCustomRenderer.Droid.Renderers.PressableViewRenderer));
#elif IOS
                handlers.AddHandler(typeof(PressableView), typeof(XamarinCustomRenderer.iOS.Renderers.PressableViewRenderer));
#endif
            });

        return builder.Build();
    }
}

렌더러는 및 AddHandler 메서드에 ConfigureMauiHandlers 등록됩니다. 메서드에 대한 AddHandler 첫 번째 인수는 플랫폼 간 컨트롤 형식이며 두 번째 인수는 렌더러 형식입니다.

Important

iOS, ListViewRendererNavigationRenderer iOS 및 AndroidTableViewRendererTabbedRenderer, ShellRenderer iOS에서 FrameRenderer파생된 VisualElementRenderer 렌더러만 메서드에 AddHandler 등록할 수 있습니다.

사용자 지정 렌더러 사용

사용자 지정 렌더러는 .NET MAUI 앱에서 사용자 지정 컨트롤로 사용할 수 있습니다.

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:controls="clr-namespace:XamarinCustomRenderer.Controls"
             x:Class="MauiCustomRenderer.MainPage">
    <Grid BackgroundColor="#f1f1f1">
        <controls:PressableView Pressed="Handle_Pressed"
                                Released="Handle_Released"
                                HorizontalOptions="Center"
                                VerticalOptions="Center">
            <Grid BackgroundColor="#202020"
                  HorizontalOptions="Center"
                  VerticalOptions="Center">
                <Label Text="Press Me"
                       FontSize="16"
                       TextColor="White"
                       Margin="24,20"
                       HorizontalTextAlignment="Center" />
            </Grid>
        </controls:PressableView>
    </Grid>
</ContentPage>

다음을 통해 공유