Esercitazione: creare un lettore di news RSS

Cc294852.bf9c77b1-ba7a-4f3b-8380-d05728d208d1(IT-IT,Expression.30).png

Per il contenuto di feed Web, ad esempio newsfeed o podcast, vengono spesso utilizzati file in formato XML. È possibile utilizzare programmi detti lettori o aggregatori per sottoscrivere feed Web e leggerli. Un lettore viene spesso lasciato in esecuzione per consentirne l'aggiornamento con il nuovo contenuto quando il feed Web viene aggiornato. Il meccanismo più comune di recapito di feed Web è detto RSS (Really Simple Syndication).

Nelle procedure seguenti viene illustrato come creare un semplice lettore RSS utilizzando Microsoft Expression Blend e un feed RSS. È possibile utilizzare il lettore RSS con qualsiasi origine dati XML, che può anche essere un file locale o un file XML del sito Web personale dell'utente.

[!NOTA]

Per le procedure seguenti è necessaria una connessione Internet attiva.

[!NOTA]

Microsoft Silverlight non supporta le origini dati XML. È possibile reperire informazioni sull'utilizzo dei dati XML in Dati XML su MSDN.

Per creare l'origine dati

  1. Nel pannello Dati, fare clic su Aggiungi origine dati attiva Cc294852.601d2ab6-5e4b-49ab-bb3c-064456dc8184(IT-IT,Expression.30).png, quindi fare clic su Definisci nuova origine dati XML.

    Verrà visualizzata la finestra di dialogo Definisci nuova origine dati XML.

  2. Accanto a Nome origine dati, digitare "rssDS".

  3. Accanto alla casella di testo URL da dati XML, digitare "http://rss.msnbc.msn.com/id/3032127/device/rss/rss.xml".

    Cc294852.alert_tip(IT-IT,Expression.30).gifSuggerimento:

    Nel campo URL da dati XML è possibile inserire qualsiasi URL o percorso locale di un file XML. Per utilizzare un diverso feed RSS, è possibile individuare l'URL aprendo il sito Web del provider (ad esempio, http://www.msnbc.com) in un browser Web e cercare un link per i feed RSS. Nei siti Web sono in genere visualizzati l'elenco dei feed disponibili e i pulsanti per la sottoscrizione ai feed desiderati. Cercare il collegamento al file XML corrispondente al feed desiderato.

  4. In Create data source in eseguire una delle operazioni seguenti:

    • Per rendere i dati disponibili per tutti i documenti dell'applicazione, selezionare Progetto.

    • Per rendere i dati disponibili solo per il documento corrente, selezionare Documento corrente.

  5. Fare clic su OK.

    L'origine dati denominata rssDS è stata aggiunta nel pannello Dati. Espandere i nodi ed esaminare i diversi campi dell'origine dati. Non sono visualizzati i dati, ma solo i nomi dei campi che contengono i dati e la relativa struttura.

    È ora possibile associare i controlli presenti nell'applicazione ai dati.

    Pannello Dati dopo l'aggiunta dell'origine dati XML

    Cc294852.8ce5d9eb-ca88-4eb9-8ad1-4719fdc0514e(IT-IT,Expression.30).png

Per creare un'associazione a campi dati trascinandoli dal pannello Progetti

Per associare i controlli agli elementi di un'origine dati sono disponibili modi diversi. Nella procedura seguente viene illustrato come creare due nuovi controlli trascinando i campi dell'origine dati dal pannello Dati alla tavola da disegno. In alternativa, è possibile trascinare i campi dell'origine dati all'interno di controlli esistenti per associare i dati alle proprietà desiderate dei controlli in questione.

  1. Nel pannello Strumenti fare clic su Asset Cc294852.0d8b8d29-1af9-418f-8741-be3097d76eab(IT-IT,Expression.30).png.

  2. Nel pannello Asset, selezionare Tutti nella categoria Controlli.

  3. Fare clic su Controlli, selezionare Controlli di sistema e quindi il controllo ImageCc294852.adb61060-da5f-4279-8c0d-3681bfeb145c(IT-IT,Expression.30).png.

  4. Con l'ausilio del mouse, disegnare un controllo di immagine sulla tavola da disegno, di circa 100 pixel di larghezza per 100 pixel in altezza, nell'angolo in alto a sinistra.

  5. Nel pannello Dati, espandere i nodi rss, channel e image. Trascinare il nodo l'url : (String) sul nuovo oggetto dell'immagine.

    L'oggetto dell'immagine visualizza l'immagine dal sito Web MSNBC. Il pannello Dati visualizza una rettangolo di selezione giallo intorno all'origine dati per indicare la parte dei dati che è associata a un controllo.

    La tavola da disegno dopo l'aggiunta dell'oggetto Image e l'associazione di quest'ultimo all'elemento di dati URL. È possibile che la tavola da disegno visualizzata dall'utente sia diversa.

    Cc294852.eb3b12e1-64d7-4a49-b2a8-fc433a34ca2f(IT-IT,Expression.30).png

  6. Nel pannello Dati, espandere i nodi rssDS, rss e channel. Trascinare il nodo title: (String) nella tavola da disegno a destra dell'oggetto immagine.

    Un controllo TextBlock è creato per visualizzare il titolo del newsfeed. Con lo strumento Selezione spostare e modificare la scala dell'oggetto blocco di testo e modificare l'aspetto del testo visualizzato mediante le proprietà presenti nelle categorie Testo e Pennelli del pannello Proprietà.

    La tavola da disegno dopo l'aggiunta di un oggetto blocco di testo e l'associazione di quest'ultimo all'elemento di dati title. È possibile che l'immagine visualizzata dall'utente sia diversa.

    Cc294852.f5b9f7c7-e622-4f62-a151-1e449c6d4588(IT-IT,Expression.30).png

Per associare più controlli agli stessi dati utilizzando un contesto dei dati

Un contesto dei dati quando assegnato a un oggetto padre, consente di utilizzare lo stesso snapshot di dati in più oggetti figlio. Questo è utile quando si desidera creare un progetto master-dettagli, nel quale, se si seleziona un elemento in un elenco (il riquadro master), i dettagli su tale elemento vengono visualizzati in un altro oggetto (il riquadro dettagli).

  1. Creare un contenitore di layout GridCc294852.a87ee957-7fbf-4135-a6ab-6de7e63160aa(IT-IT,Expression.30).png con dimensioni uguali a quelle dell'area sotto l'immagine e il titolo. L'oggetto griglia risultante sarà l'oggetto padre in cui impostare automaticamente il contesto dei dati con il passaggio seguente.

  2. Selezionare il nuovo oggetto griglia nel pannello Oggetti e sequenza temporale per attivarlo e aggiungere oggetti figlio.

  3. Nel pannello Dati, accertarsi che Modalità elenco Cc294852.9ad55afc-08ac-4f9a-ab3a-d55d0cf184d3(IT-IT,Expression.30).png sia selezionata. Gli elementi trascinati dal pannello Dati in modalità elenco creano un controllo master.

  4. Espandere i nodi rss, channel e item (Array). Trascinare il nodo title: (String) nell'angolo in basso a sinistra dell'oggetto griglia.

    Un controllo ListBox è creato e inserito con i titoli di tutte le nuove storie presenti nella raccolta item (Array). Se si seleziona l'oggetto griglia e si cerca nel pannello Proprietà, verrà visualizzato un rettangolo di selezione giallo intorno alla proprietà DataContext per mostrare che è collegato ai dati. Se si seleziona l'oggetto casella di elenco, verrà visualizzata la proprietà ItemsSource associata ai dati.

    [!NOTA]

    Per la proprietà ItemsSource è possibile impostare qualsiasi insieme di elementi. È consentito utilizzare solo una proprietà ItemsSource o Items alla volta. La proprietà ItemsSource viene di solito utilizzata per creare un'associazione a un insieme di elementi generati. È possibile utilizzare la proprietà Items per aggiungere manualmente elementi singoli tramite il pulsante Modifica elementi in questo insieme.

    La tavola da disegno dopo l'aggiunta di un oggetto ListBox e l'associazione di quest'ultimo all'insieme di dati item(Array). È possibile che l'immagine visualizzata dall'utente sia diversa.

    Cc294852.6e02aab9-751f-49ee-ac12-65d92eb432ef(IT-IT,Expression.30).png

  5. Nel pannello Dati, fare clic su Modalità dettagliCc294852.7786ee28-da1d-41b2-93fd-b4caeb75ab98(IT-IT,Expression.30).png.

  6. Espandere i nodi rss, channel e item (Array). Trascinare il nodo description : (String) nell'angolo in basso a destra dell'oggetto griglia.

    Un oggetto griglia è creato con un oggetto blocco testo all'interno che visualizza la descrizione delle nuove storie selezionate. Se si seleziona l'oggetto blocco di testo e si cerca nel pannello Proprietà, verrà visualizzato un rettangolo di selezione giallo intorno alla proprietà Text per mostrare che è collegato ai dati. Per visualizzare le specifiche del collegamento dati, fare clic su Opzioni di proprietà avanzate Cc294852.e3343378-f63e-4d8f-9847-97c1a58aadc5(IT-IT,Expression.30).png accanto alla proprietà Text e fare clic su Associazione dati.

    La tavola da disegno dopo l'aggiunta di un oggetto TextBlock e l'associazione di quest'ultimo all'elemento di dati Description. È possibile che l'immagine visualizzata dall'utente sia diversa.

    Cc294852.7e00a38f-ea59-47a3-84cd-3caf57c6d805(IT-IT,Expression.30).png

  7. Premere F5 per eseguire l'applicazione e quindi fare clic su un elemento qualsiasi nella casella di riepilogo per selezionare elementi diversi e visualizzare le descrizioni corrispondenti.

    [!NOTA]

    Alcuni elementi possono includere testo HTML. È possibile creare un convertitore di valori per rimuovere gli elementi HTML dalla stringa Description e applicare il convertitore nella finestra di dialogo Crea associazione dati. Per ulteriori informazioni sulla creazione di un convertitore di valori, vedere Esercitazione: convertire dati da un tipo a un altro.