Inicio > Datos > Crear un lector de noticias RSS

Crear un lector de noticias RSS

• Crear el origen de datos
• Enlazar a campos de datos arrastrándolos desde el panel Proyecto
• Usar un contexto de datos para enlazar varios controles a los mismos datos

Las fuentes Web, como las fuentes de noticias o podcasts, suelen usar archivos con formato XML para su contenido. Puede usar programas denominados lectores o agregadores para suscribirse a las fuentes Web y leerlas. A menudo, los lectores permanecen abiertos en el equipo y se actualizan con contenido nuevo cada vez que se actualiza la fuente Web. El mecanismo de entrega más común de las fuentes Web se denomina Really Simple Syndication (RSS).

Los siguientes procedimientos muestran cómo crear un lector RSS sencillo mediante Microsoft® Expression Blend™ y una fuente RSS. El lector RSS puede servir para leer cualquier origen de datos XML, incluso un archivo local o un archivo XML de su sitio Web.

En los siguientes procedimientos, se presupone que dispone de una conexión activa a Internet.

Crear el origen de datos

1. En Expression Blend, haga clic en Nuevo proyecto en el menú Archivo y, a continuación, haga clic en Aplicación estándar (.exe).
   Se creará un nuevo proyecto.
2. En Datos, en el panel Proyecto, haga clic en +XML.
   Se abrirá la ventana Agregar origen de datos XML.
3. En el campo Nombre de conexión, escriba "rssDS" y, en el campo URL para datos XML, escriba la dirección URL de una fuente RSS. Por ejemplo, para crear un origen de datos XML para la fuente de información meteorológica de MSNBC, debería escribir "http://rss.msnbc.msn.com/id/3032127/device/rss/rss.xml". Haga clic en Aceptar.

   Puede usar cualquier URL o ruta de acceso local a un archivo XML en el campo URL para datos XML. Si desea usar otra fuente RSS, puede encontrar la URL buscando el vínculo a las fuentes RSS en el sitio Web de un proveedor (por ejemplo, http://www.msnbc.com). Normalmente, el sitio Web mostrará las fuentes disponibles y los botones que le permiten suscribirse a ellas. Busque un vínculo al archivo XML de la fuente que desea.

4. Se agregará un origen de datos denominado rssDS en Datos, en el panel Proyecto. Expanda los nodos y examine los distintos campos del origen de datos. No se muestran los datos, sino sólo los nombres de los campos que contienen los datos y su estructura.
   Ahora ya puede enlazar controles de la aplicación a los datos.

Panel Datos después de agregar el origen de datos XML

Enlazar a campos de datos arrastrándolos desde el panel Proyecto

Existen diversas formas de enlazar controles a elementos de un origen de datos. El siguiente procedimiento muestra cómo arrastrar campos de origen de datos desde el panel Proyecto hasta el área de diseño para crear dos controles nuevos. También se pueden arrastrar campos de origen de datos a controles existentes para enlazar los datos a propiedades de estos controles.

1. En Datos, en el panel Proyecto, expanda los nodos rss, channel e image. Arrastre el nodo url : (String) al área de diseño, en la esquina superior izquierda. En la lista desplegable que se muestra, haga clic en el control Image.
   Se creará un objeto Image en el área de diseño y se abrirá el cuadro de diálogo Crear enlace de datos.
2. Seleccionar campo especifica la propiedad del objeto Image al que desea enlazar el elemento de datos URL. La selección predeterminada (Source) es correcta, por lo que puede hacer clic en Aceptar.
   El objeto Image del área de diseño refleja la imagen correspondiente a la URL del elemento de datos. Use la herramienta Selección para arrastrar el objeto Image a la esquina superior izquierda del área de diseño y reducir su tamaño a escala.

   

   Área de diseño tras la adición de un objeto Image y su enlace al elemento de datos URL (la apariencia de la imagen habrá cambiado)

3. En Datos, en el panel Proyecto, expanda los nodos rssDS, rss y channel. Arrastre el nodo title : (String) al área de diseño, a la derecha del objeto Image. En la lista desplegable que se muestra, haga clic en el control Label. La propiedad predeterminada que figura junto a Seleccionar campo en el cuadro de diálogo Crear enlace de datos es correcta (Content), por lo que puede hacer clic en Aceptar.
   Aparecerá el cuadro de diálogo Crear plantilla de datos.
4. Está seleccionada la opción Nueva plantilla de datos y campos para mostrar y está configurada para crear una plantilla de datos que mostrará el elemento de datos title o en un control TextBlock. Haga clic en Aceptar.
   El título de la fuente de noticias se muestra en el nuevo control Label en el área de diseño. La herramienta Selección sirve para mover y escalar el objeto Label, mientras que las propiedades de las categorías Texto y Pinceles del panel Propiedades sirven para cambiar la apariencia del texto.

   No verá el control TextBlock en Objetos y escala de tiempo porque este control forma parte de la plantilla de datos Contenido generado que sirve para diseñar la apariencia del control cuando se enlaza a datos. Para obtener información sobre las plantillas, vea Editar una plantilla de control.

   

   Área de diseño tras la adición de un objeto Label y su enlace al elemento de datos title (la apariencia del área de diseño habrá cambiado)

Usar un contexto de datos para enlazar varios controles a los mismos datos

La asignación de un contexto de datos a un objeto principal permite usar la misma instantánea de datos en varios objetos secundarios. Esto es útil cuando se desea crear un diseño de tipo maestro/detalles en el que, si se hace clic en un elemento de la lista (el panel maestro), la información sobre dicho elemento aparece en otro objeto (panel de detalles).

1. Cree un panel Grid que ocupe el área situada bajo la imagen y el título. El objeto Grid será el objeto principal en el que se establece el contexto de datos.
2. En Objetos y escala de tiempo, haga clic en el nuevo objeto Grid para seleccionarlo y, a continuación, busque la propiedad DataContext en Propiedades comunes, en el panel Propiedades.
3. Haga clic en el botón Opciones avanzadas de la propiedad que está asociado a la propiedad DataContext y, a continuación, haga clic en Enlace de datos.
   Se abrirá el cuadro de diálogo Crear enlace de datos.
4. En la ficha Campo de datos (la predeterminada) de Orígenes de datos, haga clic en rssDS. En Campos, expanda los nodos rss y channel, haga clic en item (Array) y, a continuación, haga clic en Finalizar.
   Ha asignado la colección item del origen de datos al nuevo objeto Grid. Ahora todos los elementos secundarios del objeto Grid pueden usarse con la misma instantánea de la colección item.
5. Con la herramienta Selección, haga doble clic en el nuevo objeto Grid para activarlo y poder agregar objetos secundarios.
6. En el Cuadro de herramientas, seleccione el control ListBox y dibuje un ListBox que ocupe la mitad izquierda de la cuadrícula.
7. Seleccione el ListBox mediante la herramienta Selección y busque la propiedad ItemsSource en Propiedades comunes, en el panel Propiedades.

   La propiedad ItemsSource puede establecerse en cualquier colección de elementos. Las propiedades ItemsSource e Items no pueden usarse de forma simultánea. La propiedad ItemsSource suele usarse para enlazar a una colección de elementos generados. La propiedad Items puede usarse para agregar elementos individuales de forma manual mediante el botón Editar elementos de esta colección.

8. Haga clic en el botón Opciones avanzadas de la propiedad que está asociado a la propiedad ItemsSource y, a continuación, haga clic en Enlace de datos.
   Se abrirá el cuadro de diálogo Crear enlace de datos.
9. Haga clic en la ficha Contexto de datos explícito. En Campos, expanda los nodos rss y channel y, a continuación, haga clic en item (Array). Haga clic en el botón Definir plantilla de datos.
   Se abrirá el cuadro de diálogo Crear plantilla de datos.
10. Active la tercera opción Nueva plantilla de datos y campos para mostrar (la predeterminada). Desactive la casilla de verificación junto a item para desactivar todas las casillas rápidamente. Active la casilla de verificación junto a title y haga clic en Aceptar.
    El objeto ListBox, que ahora está enlazado a los datos de item (Array), muestra la lista de noticias.

    

    Área de diseño tras la adición de un objeto ListBox y su enlace a la colección de datos item(Array) (la apariencia del área de diseño habrá cambiado)

11. En el Cuadro de herramientas, seleccione el control TextBlock y dibuje un TextBlock que ocupe la mitad derecha de la cuadrícula.
12. Seleccione el TextBlock mediante la herramienta Selección y busque la propiedad Text en Propiedades comunes, en el panel Propiedades. Haga clic en el botón Opciones avanzadas de la propiedad que está asociado a la propiedad Text y, a continuación, haga clic en Enlace de datos.

    Cuando se agrega un control de texto al área de diseño, Expression Blend entra en el modo de edición para el control. Esto significa que puede escribir contenido inmediatamente en el control, pero no puede obtener acceso a todas las propiedades del mismo. Para salir del modo de edición para el control, presione Esc o haga clic en la herramienta Selección.

    Se abrirá el cuadro de diálogo Crear enlace de datos.
13. Haga clic en la ficha Contexto de datos explícito. En Campos, expanda los nodos rss, channel e item (Array) y, a continuación, haga clic en description : (String). Haga clic en Finalizar.
    El objeto TextBlock, que ahora está enlazado a los datos de description del elemento que está seleccionado en el ListBox porque ambos controles comparten el mismo contexto de datos, muestra la descripción.

    

    Área de diseño tras la adición de un objeto TextBlock y su enlace al elemento de datos description (la apariencia del área de diseño habrá cambiado)

14. Presione F5 para ejecutar la aplicación y, a continuación, haga clic en el ListBox en la aplicación para cambiar la selección y poder leer distintas descripciones de noticias.

    Algunos elementos podrían incluir texto HTML. Puede crear un convertidor de valores que quite los elementos HTML de la cadena Description y, a continuación, aplicar ese convertidor de valores en el cuadro de diálogo Crear enlace de datos. Para obtener información sobre cómo crear un convertidor de valores, vea Crear y aplicar un convertidor de valores.