본문 바로가기

Develop/MAUI 가이드

[Xamarin] Custom Renderer 로 Platform-Specific 하게 구현하기

반응형

Custom Renderer
Custom Renderer

Custom Renderer 사용자 지정 렌더러

Renderer 는 Xamarin Forms 로 정의된 뷰를 플랫폼이 제공해주는 컨드롤과 연결하는 역할을 합니다. 예를 들어 Xamarin Forms 의 Entry 는 프레임워크가 기본으로 제공해주는 플랫폼 별 EntryRenderer 를 통해 플랫폼 별 컨트롤로 연결됩니다. 예를 들어, 안드로이드의 EntryRenderer 는 안드로이드 플랫폼의 EditText 컨트롤과 연결하고, iOS의 EntryRenderer는 iOS 플랫폼의 UITextField 컨트롤과 연결합니다.

Custom Renderer
Custom Renderer

Xamarin Forms 가 기본으로 제공해주는 UI 요소는 모두 Xamarin 개발팀에서 제공해주는 기본 Renderer 가 있습니다. 하지만 어플리케이션을 개발하다보면 가끔 Renderer 를 직접 작성해야 하는 경우가 있습니다. 제가 Renderer 를 직접 개발해야 했던 경우는 키보드 위에 메뉴가 붙도록 만들려는데, 플랫폼 별로 키보드가 화면에 나타날 때 UI 에 영향을 미치는 방식이 달라 기본 Renderer 로는 제대로 표현할 수 없었을 때였습니다.

이처럼 Custom Renderer 은 Xamarin Forms 로 개발한 UI를 플랫폼에 맞춰 개발할 수 있도록 해주는 강력한 기능입니다. 이처럼 Renderer 는 플랫폼에 직접적으로 관여할 수 있어서 강력한 기능이지만, 플랫폼에 직접적으로 관여하게 되니 어플리케이션 성능에 적잖은 영향을 미치므로 작성할 때 주의가 필요합니다. 그리고 Renderer 대신 Effects 로 플랫폼 종속적인 UI 조작이 가능하므로 Effects 로 구현이 가능한지 먼저 검토하고 나서 Custom Renderer 를 작성하길 추천드립니다.

Custom Renderer 은 아래 순서로 구현하게 됩니다.

  1. Xamarin Forms 에 View 를 정의한다.
  2. 플랫폼별 Renderer 를 구현한다.

1. Xamarin Forms 에 View 를 정의한다.

public partial class MyView : View
{
    public MyView() 
    {
        InitializeComponent();
    }
}

2. 플랫폼별 Renderer 를 구현한다.

// Renderer 를 Xamarin Forms 에 등록하는 Attribute 입니다.
[assembly: ExportRenderer (typeof(MyView), typeof(MyViewRenderer))]
namespace Solution.Platform
{
    // ViewRenderer 는 제일 기본이 되는 Renderer 로 반드시 상속해야 합니다. 
    public class MyViewRenderer : ViewRenderer<MyView, Platform_Specific_Control>
    {
        // OnElementChanged 는 반드시 구현해야 하는 메서드입니다.
        protected override void OnElementChanged (ElementChangedEventArgs<MyView> e)
        {
            base.OnElementChanged (e);
        }
    }
}

코드를 나눠서 설명드리겠습니다.


[assembly: ExportRenderer (typeof(MyView), typeof(MyViewRenderer))]

Renderer 를 등록하는 Attribute 입니다.


public class MyViewRenderer : ViewRenderer<MyView, Platform_Specific_Control>

ViewRenderer<T1, T2> 를 상속하면서 Xamarin Forms 에서 정의한 View 와 플랫폼 컨트롤을 연결하는 코드입니다. 플랫폼 별로 작성하려는 View 를 표현할 수 있는 Platform_Specific_Control 을 지정해야 합니다.


protected override void OnElementChanged (ElementChangedEventArgs<MyView> e)
{
    base.OnElementChanged (e);
}

플랫폼 컨트롤과 연결된 후 실행되는 메서드로 Renderer 를 생성한 뒤 실행된다고 생각해도 무방합니다. 여기서는 주로 플랫폼 컨트롤을 생성해서 객체 속성으로 저장하거나, 이벤트를 연결하는 등의 작업이 수행됩니다.

연구 노트

제가 Custom Renderer 를 조사하면서 제일 어려웠던 건 공식 API 문서가 없다는 겁니다. 따라서 소스코드 메타데이터의 이름으로 ViewRenderer 의 속성과 메서드를 어림짐작해서 사용해야 합니다.

일단 제가 나름 연구한 사항을 아래에 적어 드리도록 하겠습니다. 개인적으로 소스코드를 보거나, 코드를 디버깅하여 추정하는 연구 결과이므로 참고만 해주시길 바랍니다.

  • ViewRenderer.Control 은 플랫폼 컨트롤을 의미한다.
  • ViewRenderer.CreateNativeControl() 메서드를 override 해서 플랫폼 컨트롤을 생성할 수 있다.
  • ViewRenderer.SetNativeControl() 메서드를 호출해야 ViewRenderer.Control 를 변경할 수 있다.
  • ViewRendererVisualElementRenderer 를 상속한다.
  • VisualElementRenderer.Element 가 Xamarin Forms 에서 정의한 View 다.
  • VisualElementRenderer.SetElement()VisualElementRenderer.Element 를 변경할 수 있다.
  • VisualElementRenderer.OnElementPropertyChanged() 메서드를 override 해서 데이터 바인딩된 속성이 변경되었을 때 대응할 수 있다.
반응형

태그