Alessandro Del Sole's Blog

{ A programming space about Microsoft® .NET® }
posts - 1909, comments - 2047, trackbacks - 352

My Links

News

Your host

This is me! Questo spazio è dedicato a Microsoft® .NET®, di cui sono molto appassionato :-)

Cookie e Privacy

Disabilita cookie ShinyStat

Microsoft MVP

My MVP Profile

Microsoft Certified Professional

Microsoft Specialist

Xamarin Certified Mobile Developer

Il mio libro su VB 2015!

Pre-ordina il mio libro su VB 2015 Pre-ordina il mio libro "Visual Basic 2015 Unleashed". Clicca sulla copertina per informazioni!

Il mio libro su WPF 4.5.1!

Clicca sulla copertina per informazioni! E' uscito il mio libro "Programmare con WPF 4.5.1". Clicca sulla copertina per informazioni!

These postings are provided 'AS IS' for entertainment purposes only with absolutely no warranty expressed or implied and confer no rights.
If you're not an Italian user, please visit my English blog

Le vostre visite

I'm a VB!

Guarda la mia intervista a Seattle

Follow me on Twitter!

Altri spazi

GitHub
I miei progetti open-source su GitHub

Article Categories

Archives

Post Categories

Image Galleries

Privacy Policy

Windows Phone: elencare e riprodurre video da YouTube (con Visual Basic)

In un'app che sto sviluppando per Windows Phone 7.5 avevo la necessità di integrare un elenco di video proveniente da uno specifico canale di YouTube, visualizzando tale elenco in una ListBox e permettendo la riproduzione del video selezionato dall'utente.

Non avendolo mai fatto e cercando un po', mi sono imbattuto in questo interessante articolo su Visual Studio Magazine che mi ha messo sulla strada giusta e che, ovviamente, ho riadattato alle mie esigenze (non ultimo il passaggio del codice a Visual Basic ).

La prima cosa da fare è determinare l'indirizzo Web del feed contenente l'elenco dei video desiderati. Ci sono URL diversi a seconda del fatto che si voglia interrogare un canale o una categoria. In questo esempio mostrerò come interrogare un canale, che poi si traduce nell'interrogare tutti i video caricati da uno specifico utente.

YouTube mette a disposizione delle specifiche API per fare questo, atteso che i feed RSS non sono più disponibili come una volta. La developer guide di YouTube è disponibile qui.

Supponiamo di voler elencare tutti i video nel canale YouTube dei Queen, ma la mia rock band preferita. Il feed per questo elenco è così conformato:

http://gdata.youtube.com/feeds/api/users/queenofficial/uploads?orderby=updated

Potete banalmente verificarlo digitando il link nel vostro browser. Come fare ora per utilizzarlo in Windows Phone? Innanzitutto ci vuole un DataTemplate per la ListBox che utilizzeremo. In questo template decidiamo di mostrare la thumbnail del video e la descrizione:

    <phone:PhoneApplicationPage.Resources>
        <DataTemplate x:Key="SearchResultsItemTemplate">
            <StackPanel Margin="0,0,0,30" Orientation="Horizontal">
                <Image Source="{Binding VideoImageUrl}" HorizontalAlignment="Left" Width="100"   
         Height="90" Stretch="UniformToFill" VerticalAlignment="Top"/>
                <TextBlock Text="{Binding Title}" VerticalAlignment="Top" Width="300"
         HorizontalAlignment="Left" Margin="10,0,0,0" TextWrapping="Wrap"/>
            </StackPanel>
        </DataTemplate>
    </phone:PhoneApplicationPage.Resources>

Successivamente ci vuole la ListBox... molto semplice:

                <ListBox x:Name="ResultsList" 
                         
                         ItemTemplate="{StaticResource SearchResultsItemTemplate}" 
                         ItemsSource="{Binding}" SelectionChanged="VideoListSelectionChanged" />

Come vedete viene specificato il template per gli elementi. Ora ci sono tre cose da fare. La prima è definire una classe che rappresenti un video. In forma semplificata, per le informazioni che servono a noi, questo può essere un esempio:

Public Class YouTubeVideo
    Public Property Title As String
    Public Property VideoImageUrl As String
    Public Property VideoId As String
End Class

La seconda cosa da fare è stabilire il caricamento dell'elenco dei video. Il posto all'interno dell'applicazione varia a seconda delle vostre esigenze, diciamo che il frammento di codice necessario è, a livello generale, simile al seguente:

Dim w As New WebClient
AddHandler w.DownloadStringCompleted, Sub(sender As Object, e As DownloadStringCompletedEventArgs)
Dim atomns = XNamespace.Get("http://www.w3.org/2005/Atom")
Dim medians = XNamespace.Get("http://search.yahoo.com/mrss/")
Dim xml = XElement.Parse(e.Result)
Dim videos = (From entry In xml.Descendants(atomns.GetName("entry"))
              Select New YouTubeVideo With {.VideoId = entry.Element(atomns.GetName("id")).Value,
              .VideoImageUrl = (From thumbnail In entry.Descendants(medians.GetName("thumbnail"))
              Where thumbnail.Attribute("height").Value = "90"
              Select thumbnail.Attribute("url").Value).FirstOrDefault(),
              .Title = entry.Element(atomns.GetName("content")).Value}).ToArray()
                                                        ResultsList.ItemsSource = videos
 
searchUri = "http://gdata.youtube.com/feeds/api/users/queenofficial/uploads?orderby=updated"
w.DownloadStringAsync(New Uri(searchUri))

 Il feed RSS è sempre un contenuto XML, di conseguenza usiamo LINQ to XML per analizzare il contenuto del feed e per creare un'istanza della classe YouTubeVideo, popolandola con le relative proprietà, per ciascun elemento nel feed. Non ho utilizzato gli XML Literals di VB in questo caso per due ragioni: la prima è che dobbiamo fare riferimento a un namespace diverso nei descendants e la seconda è che tanto lo so che anche chi usa C# capita di qua

Fatto questo l'ultimo step è gestire l'evento changed sulla selezione nella ListBox. Ecco il codice:

    Private Sub VideoListSelectionChanged(sender As System.Object, e As System.Windows.Controls.SelectionChangedEventArgs)
        Dim video = CType(ResultsList.SelectedItem, YouTubeVideo)
        If video IsNot Nothing Then
            Dim parsed = video.VideoId.Split(CChar("/"))
            Dim id = parsed(parsed.Length - 1)
            Dim playbackUrl = "vnd.youtube:" + id
 
            Dim task As New WebBrowserTask With {.Uri = New Uri(playbackUrl)}
            task.Show()
        End If
    End Sub

In sostanza l'elemento selezionato viene convertito in un'istanza della classe YouTubeVideo della quale vengono lette le proprietà e con queste viene costruito l'URL del video, che viene avviato tramite il launcher WebBrowserTask.

A questo punto entra in gioco quello che secondo me è l'unico neo di questa tecnica: per riprodurre il video è necessario avere sul device l'app per YouTube, che è quella gratuita di Microsoft. Neo nel senso che la riproduzione avverrà, a causa del formato di video, tramite un'app esterna che comunque rimane gratuita e comunque, se non disponibile, sarà il dispositivo a suggerire all'utente di installarla. Questo ha anche un'implicazione: l'emulatore non permette il download dal Market Place, di conseguenza sarete in grado di visualizzare l'elenco ma per riprodurre un video dovrete fare il test sul device fisico.

Nonostante queste piccolezze, si tratta di una tecnica molto efficace soprattutto se dovete visualizzare video che non avete in altro formato ma che sapete siano disponibili su YouTube.

Alessandro

Print | posted on mercoledì 11 gennaio 2012 12:36 | Filed Under [ Visual Basic Silverlight e Windows Phone ]

Powered by:
Powered By Subtext Powered By ASP.NET