Diseño visual comparado con la escritura de XAML y de código

Editar el marcado XAML o el código puede ser una tarea compleja para los diseñadores. Microsoft Expression Blend se ha ideado para personas creativas. Puede crear aplicaciones completas basadas en Windows Presentation Foundation (WPF) o en Microsoft Silverlight en la Vista de diseño de Expression Blend. Puede importar activos de material gráfico y XAML exportados desde Microsoft Expression Design, e importar plantillas de codificación de Silverlight generadas por Microsoft Expression Encoder.

Expression Blend también se ha diseñado teniendo en cuenta el desarrollo en equipo. A menudo, los equipos de desarrollo de software se componen de diseñadores que trabajan en la interfaz de usuario y de programadores que trabajan en el código subyacente de la interfaz de usuario. Por este motivo, Expression Blend incluye características para generar un mínimo de código que se pueda pasar a los desarrolladores, así como características que permiten recuperar código existente como controladores de eventos o controles personalizados que pueden usarse de la misma forma que los controles ya existentes.

¿Qué tareas de proyecto pueden llevarse a cabo en Expression Blend?

• Crear una solución que contenga un proyecto para una aplicación basada en WPF (.exe), una aplicación basada en Silverlight (.exe), una aplicación basada en Silverlight con un sitio web, o un biblioteca de controles (.dll).

• Agregar un nuevo archivo de Lenguaje de marcado de aplicaciones extensible (XAML), y su archivo correspondiente de código subyacente, para crear una ventana de nivel superior en la aplicación, un control de usuario, una página navegable dentro de la aplicación, o un diccionario de recursos que puede contener estilos reutilizables, plantillas de control, recursos de pincel, etc.

• Agregar archivos existentes al proyecto o vincular a archivos existentes, como archivos de imagen, XML, vídeo, audio, licencia, código o XAML.

• Agregar referencias a controles personalizados existentes incluidos en archivos .dll. Los controles personalizados también pueden incluirse en archivos de código fuente existentes (.vb o .cs). Después de agregar un control personalizado al proyecto de Expression Blend, puede usarlo de la misma forma que los controles incluidos en Expression Blend.

  Para obtener un ejemplo de un control personalizado contenido en un archivo .cs, vea Inténtelo: crear un control personalizado con propiedades personalizadas.

  Sugerencia:
  Cuando se agregan archivos de código fuente que contienen controles personalizados a un proyecto de Expression Blend, es preciso crear el proyecto para poder ver los controles en la categoría Controles del panel Activos.

• Agregar un proyecto nuevo a una solución. En un proyecto de WPF de Expression Blend, puede agregar proyectos o establecer vínculos con proyectos existentes.

• Abrir cualquier archivo que se encuentre en el proyecto. Los archivos XAML se abren en la mesa de trabajo para su edición, los archivos de imagen se pueden insertar en el documento activo y los archivos de sonido y de vídeo se abren en una escala de tiempo de animación. Los archivos de código subyacente se abren en la mesa de trabajo en un editor de texto. Todos los archivos pueden abrirse en un editor externo asignado al tipo de archivo. Por ejemplo, si hace doble clic en un archivo .xml en el panel Proyectos de Expression Blend, lo más probable es que el archivo se abra en el Bloc de notas. Los archivos de código se abrirán en el editor de texto de Expression Blend, pero también puede abrirlos en Microsoft Visual Studio 2010 si está instalado.

  Para obtener más información, vea Modificar un archivo de código subyacente.

• Abrir un proyecto o solución de Visual Studio 2010 para una aplicación de WPF o Silverlight y crear la interfaz de usuario.

• Depurar la aplicación mediante su generación (CTRL+MAYÚS+B) o ejecución (F5) y resolver los mensajes de error que pueda recibir en el panel Resultados.

• Agregar archivos de código para clases personalizadas de las que pueda crear instancias en la aplicación.

  Para obtener un ejemplo, vea Inténtelo: crear un control personalizado con propiedades personalizadas.

• Editar archivos de código. Si hace doble clic en un archivo de código en el panel Proyectos de Expression Blend, el archivo se abrirá en la mesa de trabajo en un editor de texto que incluye funcionalidad de búsqueda y sustitución e IntelliSense.

  Para obtener más información, vea Modificar un archivo de código subyacente.

¿Qué se puede crear en Expression Blend sin utilizar código?

• Diseñar el aspecto (interfaz de usuario) de la aplicación mediante la incorporación y transformación de objetos del panel Herramientas y la aplicación de estilos mediante el uso de pinceles y otras propiedades del panel Propiedades.

  Para obtener más información, vea los temas siguientes:

  • Elegir y usar controles interactivos

  • Dibujar formas y trazados

  • Organizar objetos

  • Establecer colores, pinceles y máscaras

• Animar objetos de la aplicación.

  Para obtener más información, vea Animar objetos.

• Modificar las escalas de tiempo de archivos de vídeo o audio del proyecto después de agregarlos a la mesa de trabajo.

  Para obtener más información, vea Insertar imágenes y material gráfico y Insertar audio y vídeo.

• Desencadenar escalas de tiempo de animaciones, archivos de audio y archivos de vídeo a partir de acciones del usuario, como hacer clic en un botón o mover el puntero sobre un objeto.

  Para obtener más información, vea Escribir código que responda a eventos.

• Agregar interactividad a la aplicación mediante el uso de controles de comportamiento que están disponibles en el panel Activos. Los controles de comportamiento son fragmentos genéricos de código empaquetado que se pueden arrastrar a cualquier objeto para ajustarlos después mediante la modificación de sus propiedades.

  Para obtener más información, vea Trabajar con comportamientos.

• Crear y diseñar controles de usuario personalizados. Un control de usuario es un tipo de proyecto que puede crear en Expression Blend. Los controles de usuario pueden usarse de la misma forma que los controles personalizados que se desarrollan en Visual Studio 2010.

  Para obtener un ejemplo, vea Crear un control de usuario vacío y Crear un control de usuario a partir de objetos existentes.

• Personalizar el aspecto de un control existente y aplicar la plantilla de estilo resultante a otros controles del mismo tipo. También puede agregar animación a una plantilla de control.

  Para obtener ejemplos, vea los temas que se incluyen en Sugerencias para la aplicación de estilos a Simple Styles de WPF y Sugerencias para la aplicación de estilos a controles Silverlight comunes.

• Crear otros recursos reutilizables, como recursos de pincel, haciendo clic en el nombre de una propiedad en el panel Propiedades y, después, haciendo clic en Convertir en nuevo recurso.

  Para obtener un ejemplo, vea Crear un recurso de pincel o de color.

• Convertir objetos en botones y recursos de pincel, o convertir imágenes en objetos 3D, con las opciones del menú Herramientas.

  Para obtener ejemplos, vea Crear un control a partir de objetos existentes y Convertir una imagen 2D en 3D.

• Enlazar una propiedad de un objeto al valor incluido en otra propiedad. Esto resulta útil en muchos casos, como para hacer que el ancho de un objeto se corresponda con una barra deslizante.

  Para obtener un ejemplo, vea Enlazar un objeto con datos proporcionados por el usuario o con otros valores internos.

• Enlazar una propiedad de un objeto a un origen de datos, como un archivo XML (solo WPF) o un objeto CLR (Common Language Runtime), o datos de ejemplo que puede generar mediante las herramientas del panel Datos.

  Para obtener más información, vea Mostrar datos.

¿Qué puede hacerse únicamente con código?

• Definir un comportamiento más complejo en controladores de eventos cuando un usuario interactúa con los elementos de la interfaz de usuario de la aplicación. Puede programar controladores de eventos para responder a teclas presionadas, acciones del mouse, etc. Son distintos de los desencadenadores de eventos para animaciones y elementos multimedia. Por ejemplo, los controladores de eventos le permiten usar ecuaciones matemáticas para programar el comportamiento de la aplicación.

  Para obtener un ejemplo, vea Crear un nuevo método de control de eventos.

  Para obtener una lista de eventos, vea los vínculos en Referencia de controles, propiedades y eventos.

• Personalizar el comportamiento de controles existentes o crear nuevos controles personalizados.

  Para obtener un ejemplo de un control personalizado basado en el control WPF Button , vea Inténtelo: crear un control personalizado con propiedades personalizadas.

• Cargar datos, como por ejemplo datos de Microsoft SQL Server, en una tabla de datos y convertirlos en un objeto de datos CLR que pueda usarse en Expression Blend.

  Para obtener un ejemplo, vea Inténtelo: mostrar datos de una base de datos SQL de ejemplo.

• Crear un convertidor de valores para agregar lógica personalizada a un enlace de datos. Esto resulta útil si desea enlazar una propiedad de un objeto con una propiedad de un tipo de datos incompatible.

  Para obtener un ejemplo, vea Inténtelo: convertir datos de un tipo a otro.

¿Qué puede hacerse únicamente en Visual Studio 2010?

• Depurar la aplicación mediante su examen línea por línea mientras se está ejecutando.

  Sugerencia:
  Puede tener el mismo archivo de proyecto abierto simultáneamente en Expression Blend y en Visual Studio 2010 en el mismo equipo. Si guarda un cambio en un archivo en un sistema, recibirá una notificación cuando pase al otro sistema y se le preguntará si desea volver a cargar el archivo.

  Para obtener más información, vea Depurar aplicaciones de Expression Blend en Visual Studio 2010.

¿Cómo ayuda Expression Blend a agregar código?

• De manera opcional, Expression Blend crea un archivo de código subyacente correspondiente para cualquier archivo XAML que cree mediante el asistente para Agregar nuevo elemento. Si hace doble clic en un archivo de código en el panel Proyectos de Expression Blend, el archivo se abrirá en la mesa de trabajo en un editor de texto que incluye funcionalidad de búsqueda y sustitución e IntelliSense.

  Para obtener más información, vea Modificar un archivo de código subyacente.

• Expression Blend genera código para un método de control de eventos vacío al hacer doble clic en un evento de la vista Eventos del panel Propiedades.

  Para obtener más información, vea Escribir código que responda a eventos.

  Sugerencia:

  Si necesitan trabajar en el mismo proyecto varios usuarios al mismo tiempo, es recomendable usar un sistema de control de código fuente como Microsoft Team Foundation. Los sistemas de control de código fuente mantienen un repositorio central de los archivos del proyecto que puede desproteger y editar de forma local en el equipo. Para obtener más información, vea Trabajar con el control de código fuente de Team Foundation.

¿Dónde puedo obtener ayuda para escribir código?

Si necesita ayuda para escribir código para la aplicación Expression Blend, puede usar uno de los recursos indicados en Recursos de la comunidad y aprendizaje. Se incluyen, entre otros recursos, vínculos a foros de discusión y tutoriales.

Copyright © 2011 de Microsoft Corporation. Reservados todos los derechos.