Nota:
El acceso a esta página requiere autorización. Puede intentar iniciar sesión o cambiar directorios.
El acceso a esta página requiere autorización. Puede intentar cambiar los directorios.
El Diseñador XAML de Visual Studio te permite editar visualmente documentos XAML para proyectos de WPF y UWP. Al habilitar y personalizar las opciones del Diseñador, puede simplificar el flujo de trabajo y adaptar la experiencia de edición a sus necesidades. Este artículo le guía a través de la habilitación del Diseñador y la configuración de sus opciones clave.
Prerrequisitos
- Visual Studio instalado
- Un proyecto basado en XAML (como WPF o UWP)
Habilitar el Diseñador XAML
Habilite el Diseñador XAML para acceder a las características de edición visual y a IntelliSense avanzado para documentos XAML.
- Inicie Visual Studio y seleccione Opciones de herramientas > en el menú principal.
En el panel Opciones , expanda la sección Todos los ajustes>XAML Designer>General .
Active la casilla Habilitar diseñador XAML .
Reinicie Visual Studio para que los cambios surtan efecto.
- En el cuadro de diálogo Opciones, expanda la secciónGeneral del > XAML.
Active la casilla Habilitar diseñador XAML y, a continuación, seleccione Aceptar.
Reinicie Visual Studio para que los cambios surtan efecto.
Establecimiento de la vista de documento predeterminada
Elija cómo aparecen los documentos XAML al abrirse, incluido el código fuente XAML, la vista de diseño visual del código o ambos.
- Abra el panel de Herramientas>Opciones y expanda la sección Todos los ajustes>Diseñador XAML>General.
- Abra el cuadro de diálogo Opciones de herramientas> y expanda la secciónGeneral del> XAML.
Use la lista desplegable y establezca el valor de la configuración predeterminada de la vista de documento :
- Vista de origen: muestra solo el código fuente XAML.
- Vista diseño: muestra solo el diseñador visual.
- Vista dividida: muestre tanto el diseñador visual como el código fuente en paralelo.
- Selecciona Aceptar.
Cambiar orientación de la división
Ajuste el diseño de la vista dividida para que se adecúe a su flujo de trabajo.
- Abra el panel de Herramientas>Opciones y expanda la sección Todos los ajustes>Diseñador XAML>General.
- Abra el cuadro de diálogo Opciones de herramientas> y expanda la secciónGeneral del> XAML.
Utilice la lista desplegable y establezca el valor de la configuración orientación de división:
- Vertical: muestra el código fuente en el panel izquierdo y el diseñador visual en el panel derecho.
- Horizontal: muestre el diseñador visual en el panel superior y el código fuente del panel inferior.
- Valor predeterminado: use la orientación recomendada por la plataforma.
- Selecciona Aceptar.
Configuración del comportamiento del zoom
Establezca cómo acercar el Diseñador XAML para facilitar la navegación.
- Abra el panel de Herramientas>Opciones y expanda la sección Todos los ajustes>Diseñador XAML>General.
- Abra el cuadro de diálogo Opciones de herramientas> y expanda la secciónGeneral del> XAML.
Use la lista desplegable y establezca el valor de Zoom mediante la configuración:
- Rueda del mouse
- Ctrl + rueda del mouse
- Alt + rueda del mouse
- Selecciona Aceptar.
Para obtener más información sobre cómo restablecer la configuración de Visual Studio, vea Restablecer la configuración.
Configuración de zoom predeterminada
Usa esta configuración para determinar el valor de zoom predeterminado para ver el documento XAML.
- Abra el panel de Herramientas>Opciones y expanda la sección Todos los ajustes>Diseñador XAML>General.
- Abra el cuadro de diálogo Opciones de herramientas> y expanda la secciónGeneral del> XAML.
Use la lista desplegable y establezca el valor de la opción Configuración de zoom predeterminada :
- Último usado: usa el último valor de zoom usado para todos los documentos XAML de forma predeterminada. Cuando se abre un documento XAML por primera vez, la configuración "Ajustar todo" solo se usa por primera vez.
- Ajustar todo: usa esta opción para establecer el valor de zoom en "Ajustar todo" para el diseñador XAML. Cuando se cierra y vuelve a abrir un documento XAML, el último valor establecido persiste para esa sesión, pero para sesiones diferentes, se usa "Ajustar todo" de forma predeterminada.
- Selecciona Aceptar.
Valores del editor
Esta configuración determina el comportamiento del diseñador visual al editar un documento XAML.
| Nombre | Description |
|---|---|
| Asignar automáticamente un nombre a los elementos interactivos en la creación | Especifica si se proporciona un nombre predeterminado para un nuevo elemento interactivo al agregar uno al diseñador. |
| Insertar automáticamente propiedades de diseño en la creación de elementos | Especifica si se proporcionan propiedades de diseño para un nuevo elemento al agregar una al diseñador. Las propiedades de diseño son aquellas que afectan al diseño de un control, por ejemplo, Margin y VerticalAlignment. El código XAML siguiente muestra cómo se crea un botón con y sin esta opción seleccionada:<Button Content="Button" HorizontalAlignment="Left" Margin="245,56,0,0" Grid.Row="1" VerticalAlignment="Top" Width="75"/><Button Content="Button" Grid.Row="1"/> |
| Uso del diseño basado en cuadrantes | Especifica si el control seleccionado se alinea con los bordes más cercanos del contenedor primario. Si esta casilla está desactivada, las alineaciones de control no cambian durante una operación de movimiento o creación. |
| Rellenar automáticamente los elementos del cuadro de herramientas | Especifica si los controles de usuario y los controles personalizados de la solución actual se muestran automáticamente en el Cuadro de herramientas. |
| Agregar automáticamente datos de ejemplo en la creación de elementos | Especifica si se van a agregar automáticamente datos de ejemplo para el nuevo elemento interactivo al agregar uno al diseñador. |
| Habilitación de acciones rápidas del diseñador | Permite usar acciones rápidas de teclado para acceder a las características del Cuadro de herramientas. |
Configuración (solo Blend)
Usa estas opciones para acceder a la configuración única al editar archivos XAML mediante Blend.
En Blend, abra el panel Herramientas>Opciones y expanda la sección Todos los ajustes>Diseñador XAML>General.
En Blend, abra el cuadro de diálogo Opciones de herramientas> y expanda la secciónGeneral del> XAML.
Hay una propiedad específica de Blend:
- Unidades de tipo: especifica si las medidas del diseñador se basan en puntos o píxeles. Dado que las aplicaciones universales de Windows no admiten puntos, las unidades se convierten automáticamente en píxeles al seleccionar Puntos.
Mesa de trabajo (solo Blend)
Usa esta configuración para determinar el comportamiento del Diseñador XAML al editar documentos XAML en Blend.
En Blend, abra el panel Herramientas>Opciones y expanda la sección Todas las configuraciones>XAML Designer>Artboard.
En Blend, abra el cuadro de diálogo Opciones de > y expanda la sección Diseñador XAML>Cuadro de trabajo.
En las secciones siguientes se describen las propiedades disponibles del lienzo de trabajo.
Ajuste
| Nombre | Description |
|---|---|
| Mostrar cuadrícula de encaje | Especifique si las líneas de cuadrícula aparecen en el diseñador para ayudarle a alinear los controles. Los controles agregados en el diseñador se aseguran a estas líneas de cuadrícula cuando se selecciona la opción Ajustar a líneas de cuadrícula. |
| Ajustar a líneas de cuadrícula | Cuando los controles se agregan o se mueven alrededor del diseñador, se acoplan a las líneas de cuadrícula. |
| Espaciado de cuadrícula | Especifica el espaciado entre las líneas de cuadrícula en píxeles o puntos (según lo determinado por la configuración Unidades de tipo). |
| Ajustar a líneas de ajuste | Especifica si los controles se ajustan a las líneas de acoplamiento. |
| Margen predeterminado | Cuando se habilita Ajustar a las líneas guía, especifica el espaciado entre el control y las líneas guía en píxeles o puntos (según la configuración Unidades de tipo). |
| Relleno predeterminado | Cuando se habilita Snap to snaplines (Ajustar a líneas de ajuste), especifica el espaciado adicional entre el control y las líneas de acoplamiento en píxeles o puntos (como se determina en la configuración de Unidades de Tipo). |
Animación
Use la opción Animación para determinar si aparece una advertencia cuando las animaciones dependientes (nonaccelerated) están habilitadas en Blend.
Efectos
Usa la configuración Efectos para determinar si los efectos se representan al editar archivos XAML en el Diseñador XAML cuando trabajas en Blend.
| Nombre | Description |
|---|---|
| Efectos de renderizado | Especifica si los efectos se representan al editar archivos XAML en el Diseñador XAML mediante Blend. |
| Umbral de zoom | Especifica el porcentaje de zoom en el que se representan los efectos cuando está activada la casilla Representar efectos . Si amplías más allá de esta configuración, los efectos ya no se representan en el Diseñador XAML. |