XAML 미리 보기에서 사용자 지정 컨트롤 렌더링Render Custom Controls in the XAML Previewer

사용자 지정 컨트롤은 XAML 미리 보기에서 예상 대로 작동 하지 않을 수도 있습니다. 이 문서의 지침을 사용 하 여 사용자 지정 컨트롤 미리 보기의 제한 사항을 이해 합니다.Custom controls sometimes don't work as expected in the XAML Previewer. Use the guidance in this article to understand the limitations of previewing your custom controls.

기본 미리 보기 모드Basic Preview mode

프로젝트를 빌드하지 않았더라도 XAML 미리 보기에서 페이지가 렌더링 됩니다.Even if you haven't built your project, the XAML Previewer will render your pages. 빌드 전 까지는 코드 숨김에 의존 하는 모든 컨트롤의 기본 Xamarin.ios 형식이 표시 됩니다.Until you build, any control that relies on code-behind will show its base Xamarin.Forms type. 프로젝트가 빌드되면 XAML 미리 보기에서 디자인 타임 렌더링을 사용 하는 사용자 지정 컨트롤을 표시 하려고 합니다.When your project is built, the XAML Previewer will try to show custom controls with design time rendering enabled. 렌더링에 실패 하면 기본 Xamarin.ios 형식이 표시 됩니다.If the render fails, it will show the base Xamarin.Forms type.

사용자 지정 컨트롤에 디자인 타임 렌더링 사용Enable design time rendering for custom controls

사용자 지정 컨트롤을 만들거나 타사 라이브러리의 컨트롤을 사용 하는 경우 미리 보기에서 해당 컨트롤을 잘못 표시 하는 경우도 있습니다.If you make your own custom controls, or use controls from a third-party library, the Previewer might display them incorrectly. 사용자 지정 컨트롤은 디자인 타임 렌더링을 옵트인 (opt in) 하 여 컨트롤을 작성 하거나 라이브러리에서 가져왔는지 여부에 관계 없이 미리 보기에 표시 되도록 합니다.Custom controls must opt in to design time rendering to appear in the previewer, whether you wrote the control or imported it from a library. 사용자가 만든 컨트롤을 사용 하 여 [DesignTimeVisible(true)] 를 컨트롤의 클래스에 추가 하 여 미리 보기에 표시 합니다.With controls you've created, add the [DesignTimeVisible(true)] to your control's class to show it in the Previewer:

namespace MyProject
{
  [DesignTimeVisible(true)]
  public class MyControl : BaseControl
  {
    // Your control's code here
  }

}

James Montemagno 'S ImageCirclePlugin's base 클래스 를 예로 사용 합니다.Use James Montemagno's ImageCirclePlugin's base class as an example.

SkiaSharp 컨트롤SkiaSharp controls

현재 SkiaSharp 컨트롤은 iOS에서 미리 보는 경우에만 지원 됩니다.Currently, SkiaSharp controls are only supported when you're previewing on iOS. Android 미리 보기에서는 렌더링 되지 않습니다.They won't render on the Android preview.

문제 해결Troubleshooting

Xamarin.ios 버전 확인Check your Xamarin.Forms version

최소 Xamarin. 양식 3.6이 설치 되어 있는지 확인 합니다.Make sure you have at least Xamarin.Forms 3.6 installed. NuGet에서 Xamarin.ios 버전을 업데이트할 수 있습니다.You can update your Xamarin.Forms version on NuGet.

를 사용 [DesignTimeVisible(true)]하는 경우에도 사용자 지정 컨트롤이 제대로 렌더링 되지 않습니다.Even with [DesignTimeVisible(true)], my custom control isn't rendering properly.

코드 숨김이 나 백 엔드 데이터를 많이 사용 하는 사용자 지정 컨트롤은 XAML 미리 보기에서 항상 작동 하지는 않습니다.Custom controls that rely heavily on code-behind or backend data don't always work in the XAML Previewer. 다음을 시도할 수 있습니다.You can try:

XAML 미리 보기에는 "사용자 지정 컨트롤이 제대로 렌더링 되지 않습니다." 오류가 표시 됩니다.The XAML Previewer shows the error "Custom Controls aren't rendering properly"

프로젝트를 정리 하 고 다시 빌드하거나 XAML 파일을 닫았다가 다시 열어 보세요.Try cleaning and rebuilding your project, or closing and reopening the XAML file.