Отображать пользовательские элементы управления в средстве предварительного просмотра XAMLRender 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.Forms.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.Forms.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. Пользовательские элементы управления должны согласиться на проектирование время отрисовки для отображения в средстве предварительного просмотра ли вы написали код элемента управления или он импортирован из библиотеки.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
  }

}

Используйте Монтеманьо ImageCirclePlugin базового класса в качестве примера.Use James Montemagno's ImageCirclePlugin's base class as an example.

Элементы управления в SkiaSharpSkiaSharp 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.FormsCheck your Xamarin.Forms version

Убедитесь, что у вас есть по крайней мере Xamarin.Forms 3.6 установлен.Make sure you have at least Xamarin.Forms 3.6 installed. Вы можете обновить вашей версии Xamarin.Forms NuGet.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.