Editar XAML

  • Artículo

Aunque se puede usar cualquier editor de texto para editar documentos de lenguaje de marcado de aplicaciones extensible (XAML), el uso de Microsoft Expression Blend ofrece una serie de ventajas:

  • En Expression Blend, puede generar y ejecutar fácilmente los documentos XAML (F5) para ver los resultados de los cambios.

  • Expression Blend actualiza los errores de sintaxis en el recuadro Resultados cuando se guarda el archivo o cuando se cambia de una vista a otra (vista Diseño y vista XAML).

  • En la vista XAML, los elementos XAML están codificados por colores para facilitar su identificación. Además, puede usar la característica Buscar para encontrar un texto específico o usar la característica Ira para desplazarse a una línea determinada.

  • En la vista Diseño, puede diseñar la aplicación visualmente y dejar que Expression Blend genere el código XAML. Asimismo, puede usar la característica Ver XAML para desplazarse rápidamente al XAML y encontrar cualquier elemento del documento.

[!NOTA]

Se recomienda tener experiencia previa con XAML antes de empezar a editar documentos XAML en un editor de texto o en la vista XAML de Expression Blend. La edición directa de XAML puede producir errores de análisis en la aplicación que deberá solucionar para que Expression Blend pueda mostrar correctamente los documentos en la mesa de trabajo en la vista Diseño o para poder generar y ejecutar la aplicación.

Si tiene en cuenta estas precauciones, el trabajo alternando las vistas Diseño y XAML puede ser un método eficaz para conocer los aspectos básicos de XAML.

[!NOTA]

Además, puede editar documentos XAML en Microsoft Visual Studio 2008, que incluye las mismas características que la vista XAML en Expression Blend.

Editar XAML en la vista XAML de Expression Blend

Puede usar la vista XAML de Expression Blend para realizar cambios en el XAML de los proyectos de Expression Blend. Para obtener acceso a la vista XAML, haga clic en la ficha XAML en el lado derecho de la mesa de trabajo en el área de trabajo de Expression Blend. Los cambios que realice en la vista XAML se actualizan automáticamente en la vista Diseño.

Ficha de la vista XAML (con la ficha de la Vista de diseño oculta)

Cc294525.9c6c58bb-f156-4394-a4e2-dc30bfcb7369(ES-ES,Expression.30).png

En la vista XAML, puede escribir el código de nuevos elementos o seleccionar código existente para cortarlo o copiarlo y pegarlo en dicha vista del mismo modo que en un programa de procesamiento de texto. En la siguiente imagen se muestra texto seleccionado en la vista XAML.

Texto seleccionado en la vista XAML

Cc294525.200569f5-655e-43de-bd34-f0799678fec1(ES-ES,Expression.30).png

Además de las tareas normales del Portapapeles que puede realizar en la vista XAML, también puede ir a líneas específicas del XAML o buscar y reemplazar texto mediante los comandos Ira, Buscar, Buscar siguiente y Reemplazar del menú Edición. Para obtener más información, vea Buscar y reemplazar y Ir a una línea específica en este Manual del usuario.

Para conocer la sintaxis de los controles individuales, vea el tema sobre la biblioteca de controles (puede estar en inglés) en MSDN o busque los atributos y elementos XAML en la referencia de la biblioteca de clases (puede estar en inglés) en MSDN.

Editar XAML en la Vista de diseño de Expression Blend

Cuando se trabaja en la vista Diseño, Expression Blend genera XAML automáticamente. En la Vista de diseño, puede agregar nuevos elementos en el panel Herramientas, enlazar datos a estos elementos, cambiarles el estilo, aplicarles animación, configurarlos para que respondan a las acciones del usuario, etc. Expression Blend actualizará el código XAML para cada elemento del diseño.

Para obtener acceso a la vista Diseño, haga clic en la ficha Diseño en el lado derecho de la mesa de trabajo en el área de trabajo de Expression Blend. Los cambios que realice en la vista Diseño se actualizan automáticamente en la vista XAML.

En la siguiente imagen se muestra Expression Blend con la vista Diseño en el lado izquierdo y con la vista XAML en el lado derecho. En esta imagen, se ha agregado un Rectángulo al documento en la vista Diseño y Expression Blend ha generado el código XAML del rectángulo en la vista XAML.

Cc294525.b5f7566b-7d9a-4cff-a898-53b96c3bba7c(ES-ES,Expression.30).png

Conexión entre la vista Diseño y la vista XAML de Expression Blend

Cuando trabaje en la Vista de diseño, si desea ver al instante el código XAML de un elemento específico, haga clic con el botón secundario en el elemento en la mesa de trabajo o en el panel Objetos y escala de tiempo y elija Ver XAML. De este modo, se cambiará automáticamente a la vista XAML y se resaltará el XAML del objeto seleccionado.

Para obtener más información acerca de la creación de aplicaciones en la vista Diseño de Expression Blend, vea Organizar objetos, Dibujar formas y trazados, Insertar objetos 3D y otros temas relacionados en este Manual del usuario.