Este artículo describe cómo mostrar sus controles personalizados en el controlador de vista previa de XAML

  • Artículo

Los controles personalizados a veces no funcionan como se espera en el controlador de vista previa de XAML. Use la guía de este artículo para comprender las limitaciones de usar una vista preliminar de sus controles personalizados.

Advertencia

El controlador de vista previa de XAML ha quedado en desuso en Visual Studio 2019, versión 16.8 y Visual Studio para Mac, versión 8.8, y lo ha reemplazado la característica Recarga activa de XAML de Visual Studio 2019, versión 16.9 y Visual Studio para Mac, versión 8.9. Obtenga más información sobre Recarga activa de XAML en la documentación.

Modo de vista previa básica

Aunque no haya compilado su proyecto, el controlador de vista previa de XAML representará sus páginas. Hasta que compile, cualquier controlador que dependa de código subyacente mostrará su tipo base Xamarin.Forms. Cuando se compila el proyecto, el Los controles personalizados deben optar por la representación en tiempo de diseño para aparecer en el controlador de vista previa, tanto si ha escrito el control como si lo ha importado de una biblioteca. de XAML intenta mostrar los controles personalizados con la habilitación de la representación en tiempo de diseño. Si se produce un error en la representación, se mostrará el tipo base Xamarin.Forms.

Habilitación de la representación en tiempo de diseño para controles personalizados

Si crea sus propios controles personalizados, o usa controles de una biblioteca de terceros, el controlador de vista previa podría mostrarlos de forma incorrecta. Los controles personalizados deben optar por la representación en tiempo de diseño para aparecer en el controlador de vista previa, tanto si ha escrito el control como si lo ha importado de una biblioteca. Con los controles que ha creado, agregue el [DesignTimeVisible(true)] a la clase del control para mostrarlo en el controlador de vista previa:

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

}

Use la clase base ImageCirclePlugin de James Montemagno como ejemplo.

Controles SkiaSharp

Actualmente, los controles SkiaSharp solo se admiten al obtener una vista previa en iOS. No se representarán en la vista previa de Android.

Solución de problemas

Comprobación de su versión de Xamarin.Forms

Asegúrese de tener al menos Xamarin.Forms 3.6 instalado. Puede actualizar su versión de Xamarin.Forms en NuGet.

Incluso con [DesignTimeVisible(true)], mi control personalizado no se representa correctamente.

Los controles personalizados que dependen en gran medida de datos de código subyacente o back-end no siempre funcionan en el controlador de vista previa de XAML. Pruebe lo siguiente:

El controlador de vista previa de XAML muestra el error "Los controles personalizados no se están representando correctamente"

Pruebe a limpiar y recompilar el proyecto, o a cerrar y volver a abrir el archivo XAML.