Mostrar datos

Los datos son el corazón de todas las interfaces de usuario. Desde los sitios web de reservas de hotel a la consulta del mercado de valores, las interfaces de usuario normalmente permiten visualizar e interactuar con algunos tipos de datos. La elección de los componentes de la interfaz de usuario que van a estar visibles y la forma de disponerlos para que proporcionen un flujo de trabajo útil dependen principalmente de la naturaleza de los datos con los que se va a trabajar.

Orígenes de datos

Es posible que la aplicación tenga que trabajar sólo con orígenes de datos internos, quizá para realizar cálculos con números que un usuario ha escrito en un formulario. Es posible que otras aplicaciones que haya creado tengan que obtener acceso a orígenes de datos externos, como bases de datos, fuentes o servicios web, o archivos locales que contienen información. Microsoft Expression Blend admite los siguientes tipos de orígenes de datos:

• Origen de datos XML    Archivo XML local o remoto que puede suministrar datos a la aplicación en formato XML. Puede usar un archivo XML que haya agregado al proyecto o puede establecer el origen de datos en la dirección URL de un archivo XML de un sitio web.

  Para obtener más información, vea Usar un origen de datos XML activos.

  [!NOTA]

  Microsoft Silverlight no es compatible con orígenes de datos XML activos. No obstante, puede obtener información acerca de cómo trabajar con datos XML en Análisis de datos XML en Silverlight  en MSDN.

• Origen de datos de objeto    Objeto que contiene propiedades públicas a las que puede enlazar las propiedades de destino. En aplicaciones WPF, puede usar una biblioteca de clases de Microsoft .NET Framework que convierta los datos de una base de datos en ObservableCollection.

  Para obtener más información, vea los temas Usar un origen de datos de objeto para conectarse a una base de datos y Inténtelo: mostrar datos de una base de datos SQL de ejemplo, o bien Información general sobre el enlace de datos  en MSDN. Para aplicaciones Silverlight, vea el tema Enlace de datos de Silverlight  en MSDN.

  [!NOTA]

  Microsoft Expression Blend no admite una clase de origen de datos de objeto CLR que incluya parámetros en el constructor.

• Orígenes de datos de ejemplo    Conjunto de archivos locales que crea el usuario mediante las herramientas Crear datos de ejemplo en el panel Datos. Dado que en la mesa de trabajo no se pueden ver datos externos, Expression Blend admite datos de ejemplo que el usuario puede usar al diseñar una aplicación.

  Para obtener más información, vea Crear datos de ejemplo.

Lista de orígenes de datos del panel Datos

Los orígenes de datos que están asociados con el documento activo en Expression Blend se enumeran en Este documento, en el panel Datos. Los orígenes de datos que están disponibles para todos los documentos de un proyecto se enumeran en Proyecto, en el panel Datos. Puede crear orígenes de datos mediante los botones situados en la parte superior del panel Datos. Es posible arrastrar elementos de datos a la mesa de trabajo para crear controles que estén enlazados a los datos de los elementos.

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

Enlace de datos

El enlace de datos es el proceso de conectar elementos de un origen de datos a componentes de la interfaz de usuario (controles). Esto significa que siempre que los datos cambian, los componentes de la interfaz, opcionalmente, reflejarán esos cambios y viceversa. El ejemplo más sencillo de enlace de datos sería un control de barra deslizante enlazado internamente al ancho de un rectángulo. Al mover la barra deslizante, el tamaño del rectángulo se agranda o se reduce a escala.

Expression Blend proporciona una manera sencilla y uniforme de enlazar los objetos de una aplicación a diferentes orígenes de datos, y de configurar los objetos que muestran los datos y modificar dichos datos. Un enlace se construye básicamente entre un origen y un destino. El origen suele ser un origen de datos u otro control, y el destino es un control. En el ejemplo de la barra deslizante, el origen es la propiedad Value del control de barra deslizante y el destino es la propiedad Width del rectángulo.

Puede crear enlaces con el botón Opciones avanzadas  que está asociado a las propiedades del panel Propiedades, o bien arrastrando elementos desde el panel Datos a la mesa de trabajo.

Para obtener más información, vea Enlazar un objeto a datos.

Cuadro de diálogo Crear enlace de datos con la sección Opciones avanzadas expandida

El cuadro de diálogo Crear enlace de datos presenta tres opciones básicas para seleccionar un origen de datos y también opciones avanzadas:

• Campo de datos   Esta opción presenta los orígenes de datos XML y los objetos CLR creados en el proyecto y sus campos asociados. Puede agregar un nuevo origen de datos XML u origen de datos de objeto CLR, o usar conexiones existentes que ya hayan sido creadas. Para seleccionar un campo con el que enlazar, seleccione un elemento en Orígenes de datos y, a continuación, seleccione un elemento de datos en Campos. El tipo de elemento de datos debe coincidir con el tipo de propiedad con la que se está enlazando, a menos que tenga un convertidor de valores que pueda aplicar (vea "Opciones avanzadas" más adelante en este tema). Una vez creado el enlace de datos, el valor de la propiedad del destino se rellena con el elemento de datos.

• Propiedad del elemento   Esta opción habilita el enlace de una propiedad de un objeto a otra propiedad del objeto en el mismo archivo XAML (lenguaje de marcado de aplicaciones extensible). Esto es algo similar a enlazar la propiedad Width de un rectángulo a la propiedad Value de una barra deslizante en el ejemplo citado anteriormente en este tema. Para crear este enlace, siga uno de estos procedimientos:

  • Busque la propiedad de destino (en este caso, la propiedad Width de un rectángulo) en el panel Propiedades, haga clic en Opciones avanzadas  y, a continuación, haga clic en Enlace de datos. Haga clic en la ficha Propiedad del elemento, examine los objetos del panel izquierdo para encontrar la barra deslizante (objeto de origen) y, a continuación, busque en la lista de propiedades del panel derecho la propiedad Value y selecciónela.

  • Busque la propiedad de destino (en este caso, la propiedad Width de un rectángulo) en el panel Propiedades, haga clic en Opciones avanzadas  y, a continuación, haga clic en Enlazando propiedad de elemento. Tenga en cuenta que el cursor ha cambiado al ****Selector de elementos de la mesa de trabajo ****. Haga clic en el objeto de la mesa de trabajo al que desee enlazar la propiedad. En el cuadro desplegable Crear enlace de datos, seleccione la propiedad Value .

• Contexto de datos explícito   Esta opción permite enlazar a un origen de datos en el contexto especificado para el objeto actual o uno de sus objetos primarios. Un contexto de datos es una manera cómoda de compartir datos entre varios controles estableciendo un ámbito dentro del cual todas las propiedades enlazadas con datos heredan un origen común. Por ejemplo, puede asignar un contexto de datos a un objeto de cuadrícula que contenga un objeto ListBox y un objeto TextBlock , y enlazar las propiedades de ambos objetos a diferentes elementos de datos en el mismo contexto. Esto es útil cuando se desea crear un diseño de tipo lista/detalles en el que si se hace clic en un elemento de la lista (recuadro de lista), la información sobre dicho elemento aparece en otro objeto (recuadro de detalles). El recuadro Campos de la ficha Contexto de datos explícito muestra una lista de los campos de conexión de datos disponibles del contexto de datos heredado, en el cual se puede seleccionar el más apropiado para la propiedad de destino.

  También puede tener acceso a información de contexto de datos en la categoría Contexto de datos en la parte inferior del panel Datos. Si un objeto seleccionado en la mesa de trabajo está enlazado a datos, la categoría Contexto de datos muestra la propiedad de contexto de datos ( DataContext ) o la propiedad de contexto de datos de tiempo de diseño ( d:DataContext ) para la selección o el ámbito actual.

  

  La categoría Contexto de datos muestra los cambios cuando se cambia entre Modo de lista y Modo de detalles en el panel Datos. También puede crear un enlace de datos arrastrando los datos que desee directamente desde la categoría Contexto de datos hasta un elemento de la mesa de trabajo.

  [!NOTA]

  Puede escribir una ruta personalizada o una expresión de lenguaje de rutas XML (XPath) para el enlace de datos. El campo XPath se rellena automáticamente con la ruta del elemento que seleccione en Campos. No obstante, puede anexar a la ruta para restringir los datos aportados desde el origen de datos (por ejemplo, mediante la identificación de los nodos específicos en los datos XML que desee, como un elemento de una matriz). Para obtener más información acerca de cómo usar XPath, vea los temas Sintaxis de XPath  y Cómo: Enlazar a datos XML mediante XMLDataProvider y consultas XPath  en MSDN.

• Mostrar propiedades avanzadas   La sección de propiedades avanzadas del cuadro de diálogo, a la que puede obtener acceso si hace clic en el botón de expansión de la parte inferior , permite configurar propiedades avanzadas, como la dirección del flujo de datos (vea "Flujo de datos" más adelante en este tema), un valor predeterminado para la propiedad de destino, un convertidor de valores y un parámetro de convertidor. Los convertidores de valores son métodos de clase de .NET Framework que se usan para convertir valores de un tipo a otro, y que se necesitan cuando las propiedades de origen y de destino no son del mismo tipo. Para agregar un convertidor de valores, haga clic en Agregar nuevo convertidor de valores , junto al cuadro del convertidor de valores y, a continuación, seleccione uno en el cuadro de diálogo Agregar convertidor de valores. Puede especificar también un parámetro de convertidor (por ejemplo, para convertir de doble a decimal, es posible que tenga que especificar un valor para el número de dígitos que deberán mostrarse detrás del separador de decimales).

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

Flujo de datos

El flujo de datos se define como la dirección en la que fluyen los datos entre el origen y el destino. En el caso de la barra deslizante que escala un rectángulo, solo se necesita un enlace en una dirección, desde la barra deslizante (origen) al rectángulo (destino). Se admiten las siguientes configuraciones de enlace para el flujo de datos:

• Valor predeterminado    El valor predeterminado es OneWay . Los cambios que se realizan en el origen actualizan automáticamente el destino, pero los cambios en el destino no actualizan el origen.

• OneWay    Los cambios que se realizan en el origen actualizan automáticamente el destino, pero los cambios en el destino no actualizan el origen.

• TwoWay    Los cambios que se realizan en el origen actualizan automáticamente el destino y viceversa.

• OneWayToSource    Los cambios que se realizan en el destino actualizan automáticamente el origen, pero los cambios en el origen no actualizan el destino. Este es el valor contrario a OneWay . Esta opción es útil en casos especiales en los que la propiedad de destino no se puede ver en el panel Propiedades, algo que puede ocurrir si no se trata de una propiedad de dependencia. El enlace OneWayToSource permite configurar el enlace de datos en el destino. Esta opción no está disponible en proyectos de Silverlight.

• **OneTime   ** No se realizan cambios. El destino se establece en el valor del origen cuando la aplicación se inicializa. Después de eso, el destino no se actualiza.

Para ver el flujo de datos en acción, observe el siguiente ejemplo de una interfaz de usuario que contiene un control Slider (origen) y un control TextBox (destino):

Flujo de datos entre tipos de enlace

En esta ilustración, el enlace se configura en el cuadro de texto (destino) mediante el siguiente procedimiento:

1. En el panel Propiedades, haga clic en el botón Opciones avanzadas  que está asociado a la propiedad Text (en Propiedades comunes) de TextBox y, a continuación, haga clic en Enlace de datos.

2. En el cuadro de diálogo Crear enlace de datos que aparece, en la ficha Propiedad del elemento, seleccione la propiedad Value del nodo Slider.

En la siguiente tabla se describe el comportamiento de enlace de este ejemplo según el tipo de enlace:

Para obtener un procedimiento que ilustre este caso, vea Enlazar un objeto con datos proporcionados por el usuario o con otros valores internos.

Métodos de enlace a orígenes de datos

Flujo de trabajo 1: enlace del origen al destino

Una vez creado el origen de datos externo, puede enlazar ese origen de datos a los controles de la interfaz de usuario. Esto puede hacerse de dos maneras:

• Enlazar un control existente    Si el control ya se encuentra en el documento, puede enlazarlo a los datos si arrastra el nodo de datos desde el panel Datos al control. Según arrastre el nodo de datos, aparecerá un mensaje para indicarle la propiedad del objeto a la que estarán enlazados los datos.

  

  Si desea especificar otra propiedad, puede presionar la tecla MAYÚS antes de soltar el botón del mouse.

  

• Crear un control    Puede arrastrar cualquier nodo de datos desde el panel Datos a un documento. Con esta opción se insertará un control nuevo en el documento.

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

• Enlazar un objeto a datos

• Crear un enlace de datos de tipo lista/detalles

Flujo de trabajo 2: enlace del destino al origen

Aunque el flujo de trabajo anterior empezaba en el origen de datos y terminaba en el control de destino, puede invertir el proceso si ya ha creado el control y sabe qué propiedad desea enlazar al origen de datos, o a otra propiedad del control. Este flujo de trabajo es especialmente útil en el enlace de objeto a objeto.

Para obtener más información, vea Enlazar un objeto con datos proporcionados por el usuario o con otros valores internos.

Junto al editor del valor de cada propiedad en el panel Propiedades, encontrará el botón Opciones avanzadas , que permite configurar opciones avanzadas, incluido el enlace de datos. Al hacer clic en Enlace de datos en el menú de opciones avanzadas, se abre el mismo cuadro de diálogo Crear enlace de datos que se describe en el Flujo de trabajo 1, anteriormente en este tema.

Plantillas de datos

Es posible que se encuentre en situaciones en las que deseará mostrar una lista de elementos del origen de datos. Un elemento de datos que contiene una lista de elementos se identifica mediante "(Matriz)" en el nombre del elemento. Cuando arrastre un nodo de lista del panel Datos a un control DataGrid , los datos se mostrarán en objetos cuya plantilla se puede modificar.

Para obtener ejemplos de cómo modificar plantillas de datos, vea los temas siguientes:

• Aplicar estilo a un control que muestra datos

• Usar el control DataGrid

• Usar el control TreeView

Las plantillas de datos se almacenan como recursos, del mismo modo que cualquier otro estilo o plantilla. Si desea modificar una plantilla de datos existente, puede hacer clic en el botón Editar recurso, situado junto a la plantilla de datos en el panel Recursos. Expression Blend cambia al modo de edición de plantilla y muestra la estructura de la plantilla en Objetos y escala de tiempo. En este modo de edición, puede agregar controles a la plantilla y usar enlaces de datos del panel Propiedades para enlazar las propiedades de dichos controles a los elementos nuevos del origen de datos.

Comportamientos de datos

Además de poder arrastrar propiedades a la mesa de trabajo para enlazarlas a un objeto existente, cree un nuevo objeto enlazado o establezca un contexto de datos de tiempo de diseño. También puede arrastrar comandos y métodos del panel Datos a objetos de la mesa de trabajo.

Cuando se arrastra un comando a un objeto, Expression Blend crea una acción InvokeCommandAction para invocar el comando. A continuación, puede configurar cómo el objeto desencadenará el comando en el panel Propiedades. De forma similar, cuando se arrastra un método a la mesa de trabajo, Expression Blend crea una acción CallMethodAction que se puede configurar de la misma manera.

Para obtener más información acerca de InvokeCommandAction y CallMethodAction , vea InvokeCommandAction y CallMethodAction.

Vea también

Conceptos

Aplicar estilos a objetos
Organizar objetos

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