WPF Designer para desarrolladores de Windows Forms
WPF Designer for Visual Studio comparte muchas similitudes con el Diseñador de Windows Forms, pero también difiere en varios aspectos. En este tema se describen algunas de las diferencias y también cómo hacer tareas conocidas en el Diseñador de Windows Forms utilizando WPF Designer.
Hincapié en XAML
La diferencia más obvia entre el Diseñador de formularios Windows Forms y WPF Designer es la vista dividida. La vista dividida permite ver tanto la superficie de diseño como el marcado XAML simultáneamente. WPF Designer hace hincapié en la vista XAML y proporciona una experiencia de edición completa, que incluye IntelliSense, para el XAML de su aplicación. Puede hacer muchas tareas conocidas en el Diseñador de Windows Forms utilizando la vista XAML. La vista dividida proporciona una retroalimentación inmediata, porque muestra los efectos de los cambios en la vista XAML. Para obtener más información sobre la vista dividida, vea Vista dividida: Ver la superficie de diseño de WPF y XAML al mismo tiempo.
También puede utilizar Expression Blend junto a Visual Studio para hacer tareas que no se admiten en WPF Designer. Para obtener más información, vea Colaboración con Expression Blend.
Mejoras en WPF Designer
Hay una serie de mejoras en WPF Designer que no están disponibles en el Diseñador de Windows Forms. Estas mejoras incluyen:
Líneas del margen y códigos auxiliares: las líneas del margen que hay alrededor de cada control indican que se ha fijado un margen para ese control. Un código auxiliar de margen indica que no se ha estado establecido ningún margen para ese borde de control.
Control de zoom: el control de zoom aparece en la esquina superior izquierda de la Vista de diseño y permite al programador acercar o alejar la superficie de diseño para realizar ajustes precisos. Después de acercarla, también puede desplazarse lateralmente por la superficie de diseño.
Guías de alineación: mientras que las guías de alineación aparecen tanto en WPF Designer como en el Diseñador de Windows Forms, en WPF Designer muestran también los valores exactos. Además de mostrar la alineación de los controles, las guías de alineación también muestran la alineación del texto de los controles basados en texto. Para obtener más información, vea Cómo: Alinear con márgenes y líneas base del texto.
Tareas del Diseñador de Windows Forms y equivalentes en WPF Designer
En la siguiente tabla se proporciona un mapa para entender cómo se pueden hacer distintas tareas en WPF Designer.
Tarea en el Diseñador de Windows Forms |
Equivalente en WPF Designer |
|---|---|
Diseño absoluto |
Utilice la clase Canvas como elemento raíz. |
Ordenación alfabética en la ventana Propiedades |
En la ventana Propiedades, haga clic en el botón Alfabético. Para buscar una propiedad, utilice el cuadro Buscar. Puede examinar las propiedades mediante IntelliSense en la vista XAML o en el Editor de código. También puede utilizar el Examinador de objetos. |
Delimitación |
Utilice el control Grid y las capacidades de delimitación en la Vista de diseño para establecer valores de delimitación de destino. |
Animación |
Utilice Expression Blend. |
Icono de aplicación |
Establezca la propiedad Icon en la clase Window principal de la aplicación. |
Asignar el orden de tabulación |
Seleccione cada control y establezca la propiedad TabIndex correspondiente en la vista XAML o en la ventana Propiedades. El orden de tabulación predeterminado es el orden en el que aparecen los controles en el contenedor primario. |
Componentes y bandeja de componentes |
Los componentes no visuales no aparecen en el Cuadro de herramientas de WPF Designer. Utilice la vista XAML y la asignación de espacio de nombres para hacer referencia a los recursos y los tipos no locales. Para obtener más información, vea Cómo: Importar un espacio de nombres a XAML. |
La ventana Orígenes de datos y el enlace de datos |
Para obtener más información sobre cómo usar la ventana Orígenes de datos, vea Enlazar controles WPF a datos en Visual Studio. Es posible enlazar a una instancia en tiempo de diseño de los datos utilizando la extensión de marcado DesignInstance. Para obtener más información, vea Tutorial: Usar DesignInstance para enlazar datos en el diseñador. También puede utilizar Expression Blend para definir los orígenes y enlaces de datos si está enlazando a objetos o XML. Copie y pegue el XAML generado automáticamente en la vista XAML de WPF Designer. También se puede abrir el proyecto en Visual Studio con Expression Blend y crear directamente los recursos. |
Declarar y asociar los controladores de eventos |
En la ventana Propiedades, haga clic en el botón Eventos y, a continuación, haga doble clic en el evento deseado. Para el controlador de eventos predeterminado, haga doble clic en el control en la Vista de diseño. También puede utilizar IntelliSense en la vista XAML para seleccionar el evento deseado. Para obtener más información, vea Cómo: Crear controladores de eventos simples. |
Diseñar los menús |
Utilice la vista XAML o el Editor de colecciones en la ventana Propiedades en la colección Items y establezca la propiedad Header de cada elemento. |
Definir pinceles y colores |
En la ventana Propiedades, desplácese a una propiedad de tipo de pincel y haga clic en la flecha abajo. Utilice el editor de pinceles para diseñar el pincel. Para obtener más información, vea Cómo: Crear un pincel mediante el editor de pinceles. Puede utilizar Expression Blend. Copie y pegue el XAML generado automáticamente en la vista XAML de WPF Designer. También se puede abrir el proyecto en Visual Studio con Expression Blend y crear directamente los recursos. |
Eliminar las líneas de la cuadrícula |
Haga clic en un indicador de la línea de cuadrícula y arrástrelo desde el raíl de la cuadrícula. Para obtener más información, vea Cómo: Quitar filas y columnas de una cuadrícula. También puede usar la vista XAML para quitar las definiciones de fila o de columna pertinentes y, a continuación, arreglar las asignaciones de Grid.Column o Grid.Row de los controles secundarios afectados que son primarios dentro del control Grid. |
Mostrar imágenes |
Utilice el control Image. Para obtener más información, vea Cómo: Agregar imágenes a un proyecto de WPF. |
Mostrar el control UserControl en el Cuadro de herramientas |
Agregue una referencia de proyecto al ensamblado del control de usuario y use IntelliSense en la vista XAML para asignar el atributo xmlns. Puede utilizar también el cuadro de diálogo Elegir elementos del cuadro de herramientas y desplazarse hasta el ensamblado que contiene el control, pero hay limitaciones. Para obtener más información, vea Componentes WPF (Pestaña), Elegir elementos del cuadro de herramientas (Cuadro de diálogo). |
Distribuir los controles en un formulario |
Use el elemento StackPanel |
Acoplamiento |
Utilice el elemento DockPanel para varios controles. Puede utilizar también Grid y ajustar los controles a los límites de celda de la cuadrícula usando guías de alineación a la cuadrícula. |
Proveedor de errores |
Sin presentación visual en tiempo de diseño. Utilice la clase Validation en la vista XAML. Para obtener más información, vea Cómo: Implementar la validación de enlaces. |
Ir a definición |
En el código subyacente, haga clic con el botón secundario en el símbolo y seleccione Ir a definición en el menú contextual. Para buscar desde la vista XAML, abra todos los archivos XAML del proyecto y use la ventana Buscar y reemplazar. Para obtener más información, vea Buscar y reemplazar (Ventana). |
Proveedor de ayuda |
Sin presentación visual en tiempo de diseño. Utilice la vista XAML. |
Hipervínculo |
Utilice la clase Hyperlink dentro del contenido de flujo. |
Sin presentación visual en tiempo de diseño. Utilice la vista XAML. |
|
Bloqueo |
No se admite. |
Sin presentación visual en tiempo de diseño. Utilice la vista XAML. |
|
Teclas de acceso |
Preceda el carácter de la tecla de acceso con el carácter de subrayado"_" en lugar del carácter "&". |
Lista desplegable del selector de objetos en la ventana Propiedades |
Seleccione el objeto en la ventana Esquema del documento, la ficha navegador o la Vista de diseño. Para mostrar la ventana Esquema del documento, abra el menú Ver, elija Otras ventanas y seleccione Esquema de documento. |
Sin presentación visual en tiempo de diseño. Utilice la vista XAML. |
|
Hacer referencia a tipos no locales en XAML |
Agregue una referencia de proyecto y utilice IntelliSense en la vista XAML para establecer el atributo xmlns. Para obtener más información, vea Cómo: Importar un espacio de nombres a XAML. .gif "Nota") Nota
WPF Designer intenta buscar coincidencias basadas en el alias del espacio de nombres tras el atributo xmlns, en lugar de en la sintaxis completa utilizando clr-namespace.
|
Cambiar el nombre y refactorizar |
Abra todos los archivos XAML del proyecto y use la ventana Buscar y reemplazar. Para obtener más información, vea Buscar y reemplazar (Ventana). |
Quitar los márgenes |
En la Vista de diseño, seleccione todos los elementos a los que se quitarán los márgenes. En la ventana Propiedades, escriba 0 para la propiedad Margin. |
Cambiar el tamaño de un formulario después de colocar un control |
Puesto que cambiar el tamaño de la ventana puede cambiar el tamaño del contenido, utilice el proceso siguiente. Seleccione todos los elementos y después corte. A continuación, cambie el tamaño de la ventana y luego pegue. |
Establecer el texto para los controles Button, Label, CheckBox, RadioButton |
En la ventana Propiedades, establezca la propiedad Content. Otra posibilidad es establecer el texto en la vista XAML. |
Etiquetas inteligentes |
No se admite. |
Información sobre herramientas |
Sin presentación visual en tiempo de diseño. Utilice la clase ToolTip en la vista XAML. |
Sin presentación visual en tiempo de diseño. Utilice la vista XAML. |
|
Herencia visual |
No se admite. |
Sin presentación visual en tiempo de diseño. Utilice la vista XAML. |
|
Orden z |
Seleccione y mueva la etiqueta de elemento en la vista XAML o seleccione Orden en el menú contextual en la Vista de diseño. Utilice la ventana Esquema del documento para confirmar el orden z del elemento. |
Vea también
Conceptos
Controles de formularios Windows Forms y controles equivalentes de WPF
Información general sobre WPF y Silverlight Designer