Compatibilidad en tiempo de diseño de Visual Studio con controles personalizados (.NET de Form de Windows)

Como ha observado al interactuar con el diseñador Form de Windows, hay muchas características en tiempo de diseño diferentes que ofrecen los controles de Form de Windows. Algunas de las características que ofrece el diseñador de Visual Studio incluyen líneas de ajuste, elementos de acción y la cuadrícula de propiedades. Todas estas características le ofrecen una manera más fácil de interactuar y personalizar un control durante el tiempo de diseño. Este artículo es una introducción sobre el tipo de soporte técnico que puede agregar a los controles personalizados para mejorar la experiencia en tiempo de diseño para los consumidores de los controles.

Importante

La documentación de la guía de escritorio para .NET 7 y .NET 6 está en proceso de elaboración.

Lo que es diferente de .NET Framework

Muchos elementos de diseño básicos de controles personalizados se han mantenido iguales desde .NET Framework. Sin embargo, si usa características de personalización de diseñador más avanzadas, como listas de acciones, convertidores de tipos, diálogos personalizados, tiene algunos escenarios únicos que controlar.

Visual Studio es una aplicación basada en .NET Framework y, como tal, el diseñador visual que ve para el Form de Windows también se basa en .NET Framework. Con un proyecto de .NET Framework, tanto el entorno de Visual Studio como la aplicación Form de Windows que se está diseñando se ejecutan en el mismo proceso, devenv.exe. Esto supone un problema al trabajar con una aplicación de .NET (no .NET Framework) de Form de Windows. .NET y .NET Framework no pueden funcionar en el mismo proceso. Como resultado, el .NET de Form de Windows usa un diseñador diferente, el diseñador "fuera de proceso".

El diseñador fuera de proceso es un proceso denominado DesignToolsServer.exey se ejecuta a lo largo del proceso de devenv.exe de Visual Studio. El proceso de DesignToolsServer.exe se ejecuta en la misma versión y plataforma, como .NET 7 y x64, de .NET que la aplicación tiene como destino. Cuando el control personalizado necesita mostrar la interfaz de usuario en el devenv.exe, el control personalizado debe implementar una arquitectura cliente-servidor para facilitar la comunicación hacia y desde devenv.exe. Para obtener más información, vea El diseñador cambia desde .NET Framework (.NET de Form de Windows).

Ventana de propiedades

La ventana Propiedades de Visual Studio muestra las propiedades y eventos del control o formulario seleccionado. Este suele ser el primer punto de personalización que se realiza en un control o componente personalizado.

En la imagen siguiente se muestra un control Button seleccionado en el Diseñador visual y la cuadrícula de propiedades que muestra las propiedades del botón:

El diseñador Form de Windows en Visual Studio que muestra un botón y la ventana propiedades

Puede controlar algunos aspectos de cómo aparece la información sobre el control personalizado en la cuadrícula de propiedades. Los atributos se aplican a la clase de control personalizada o a las propiedades de clase.

Atributos para clases

En la tabla siguiente se muestran los atributos que se pueden aplicar para especificar en tiempo de diseño el comportamiento de los controles y componentes personalizados.

Atributo Descripción
DefaultEventAttribute Especifica el evento predeterminado para un componente.
DefaultPropertyAttribute Especifica la propiedad predeterminada para un componente.
DesignerAttribute Especifica la clase utilizada para implementar, en tiempo de diseño, los servicios para un componente.
DesignerCategoryAttribute Especifica que el diseñador de una clase pertenece a una categoría determinada.
ToolboxItemAttribute Representa un atributo de un elemento del cuadro de herramientas.
ToolboxItemFilterAttribute Especifica la cadena del filtro y el tipo de filtro que se va a utilizar para un elemento del cuadro de herramientas.

Atributos para propiedades

En la tabla siguiente se muestran los atributos que se pueden aplicar a las propiedades o a otros miembros de los controles y componentes personalizados.

Atributo Descripción
AmbientValueAttribute Especifica el valor para pasar a una propiedad que hace que esta obtenga su valor de otro origen. Esto se conoce como ambiente.
BrowsableAttribute Especifica si una propiedad o un evento se debería mostrar en una ventana Propiedades.
CategoryAttribute Especifica el nombre de la categoría en la que se agrupa la propiedad o el evento cuando se muestra en un control PropertyGrid establecido en el modo Categorized.
DefaultValueAttribute Especifica el valor predeterminado de una propiedad.
DescriptionAttribute Especifica una descripción para una propiedad o evento.
DisplayNameAttribute Especifica el nombre para mostrar de una propiedad, evento o método público que no devuelve un valor y no toma ningún argumento.
EditorAttribute Especifica el editor que se va a utilizar para cambiar una propiedad.
EditorBrowsableAttribute Especifica que una propiedad o un método son visibles en un editor.
HelpKeywordAttribute Especifica la palabra clave de contexto para una clase o miembro.
LocalizableAttribute Especifica si se debería localizar una propiedad.
PasswordPropertyTextAttribute Indica que la representación del texto de un objeto está oculta por caracteres, como asteriscos.
ReadOnlyAttribute Especifica si la propiedad a la que se enlaza este atributo es de solo lectura o de lectura y escritura en tiempo de diseño.
RefreshPropertiesAttribute Indica que la cuadrícula de la propiedad debería actualizarse cuando cambia el valor de propiedad asociado.
TypeConverterAttribute Especifica el tipo que se debe utilizar como convertidor para el objeto al que está enlazado este atributo.

Diseñadores de control personalizado

La experiencia en tiempo de diseño de controladores personalizados puede mejorarse con la creación de un diseñador personalizado que se asocie a este. De forma predeterminada, el control personalizado se muestra en la superficie de diseño del host y tiene el mismo aspecto que en tiempo de ejecución. Con un diseñador personalizado puede mejorar la vista en tiempo de diseño del control, agregar elementos de acción, líneas de ajuste y otros elementos, lo que puede ayudar al usuario a determinar cómo diseñar y configurar el control. Por ejemplo, en tiempo de diseño, el diseñador de ToolStrip agrega controles adicionales para que el usuario agregue, quite y configure los elementos individuales, como se muestra en la imagen siguiente:

Un diseñador Form de Windows en Visual Studio que muestra la vista en tiempo de diseño de un contenedor dividido.

Puede crear sus propios diseñadores personalizados realizando los pasos siguientes:

  1. Agregar referencia al paquete NuGet de Microsoft.WinForms.Designer.SDK.
  2. Crear un tipo hereda de la clase Microsoft.DotNet.DesignTools.Designers.ControlDesigner.
  3. En la clase de control de usuario, marque la clase con el atributo de clase System.ComponentModel.DesignerAttribute y pase el tipo que creó en el paso anterior.

Para obtener más información, consulte la sección Qué es diferente de .NET Framework.

Acciones

Las acciones del diseñador son menús contextuales que permiten al usuario realizar tareas comunes rápidamente. Por ejemplo, si agrega un TabControl a un formulario, va a agregar y quitar pestañas hacia y desde el control. Las pestañas se administran en la ventana propiedades, a través de la propiedad TabPages, que muestra un editor de colecciones de pestañas. En lugar de forzar al usuario a examinar siempre la lista propiedades buscando la propiedad TabPages, el TabControl proporciona un botón de etiqueta inteligente que solo está visible cuando se selecciona el control, como se muestra en las imágenes siguientes:

El diseñador Form de Windows en Visual Studio que muestra un botón de etiqueta inteligente de un control de pestaña.

Cuando se selecciona la etiqueta inteligente, se muestra la lista de acciones:

El diseñador Form de Windows en Visual Studio que muestra un botón de etiqueta inteligente de un control de pestaña presionado que muestra una lista de opciones.

Al agregar las acciones Agregar pestaña y Quitar pestaña, el diseñador del control hace posible que pueda agregar o quitar rápidamente una pestaña.

Crear una lista de elemento de acción

El tipo ControlDesigner que crea proporciona listas de elementos de acción. Los pasos siguientes son una guía básica para crear su propia lista de acciones:

  1. Agregar referencia al paquete NuGet de Microsoft.WinForms.Designer.SDK.
  2. Cree una nueva clase de lista de acciones que herede de Microsoft.DotNet.DesignTools.Designers.Actions.DesignerActionList.
  3. Agregue las propiedades a la lista de acciones a la que desea que el usuario acceda. Por ejemplo, agregar una propiedad bool o Boolean (en Visual Basic) a la clase crea un control CheckBox en la lista de acciones.
  4. Siga los pasos de la sección Diseñadores de controles personalizados para crear un nuevo diseñador.
  5. En la clase de diseñador, invalide la propiedad ActionLists, que devuelve un tipo Microsoft.DotNet.DesignTools.Designers.Actions.DesignerActionListCollection.
  6. Agregue la lista de acciones a una instancia de DesignerActionListCollection y vuelva a ella.

Para obtener un ejemplo de una lista de acciones, consulte el repositorio de GitHub de documentos y ejemplos de extensibilidad del diseñador Form de Windows, específicamente la carpeta TileRepeater.Designer.Server/ControlDesigner.

En la ventana propiedades, la mayoría de las propiedades se editan fácilmente en la cuadrícula, como cuando el tipo de respaldo de la propiedad es una enumeración, booleano o número.

La ventana Propiedades de Visual Studio para una aplicación Form de Windows, que muestra la propiedad alineación.

A veces, una propiedad es más compleja y requiere un cuadro de diálogo personalizado que el usuario puede usar para cambiar la propiedad. Por ejemplo, la propiedad Font es un tipo System.Drawing.Font, que contiene muchas propiedades que modifican el aspecto de la fuente. Esto no se puede presentar fácilmente en la ventana propiedades, por lo que esta propiedad usa un cuadro de diálogo personalizado para editar la fuente:

Cuadro de diálogo Fuente de Visual Studio para una aplicación Form de Windows.

Si las propiedades de control personalizadas usan los editores de tipos integrados proporcionados por Form de Windows, puede usar el EditorAttribute para marcar las propiedades con el editor de .NET Framework correspondiente que quiere que use Visual Studio. Mediante el uso de los editores integrados, se evita el requisito de replicar la comunicación de cliente-servidor proxy-object proporcionada por el diseñador fuera de proceso.

Al hacer referencia a un editor de tipos integrado, use el tipo de .NET Framework, no el tipo de .NET:

[Editor("System.Windows.Forms.Design.FileNameEditor, System.Design, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a",
        "System.Drawing.Design.UITypeEditor, System.Drawing, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a")]
public string? Filename { get; set; }
<Editor("System.Windows.Forms.Design.FileNameEditor, System.Design, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a", "System.Drawing.Design.UITypeEditor, System.Drawing, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a")>
Public Property Filename As String