I controlli di Silverlight 2.0

MediaElement

Il controllo MediaElement, già presente nella prima release di Silverlight, consente di riprodurre contenuti multimediali in streaming all'interno di uno UserControl Silverlight assegnandone l'URI alla proprietà Source.

<MediaElement x:Name="player" Margin="10" Source="http://localhost:52272/Butterfly.wmv" />

Chi si aspetta un player built-in con tutti i crismi, però, rischia di rimanere parzialmente deluso: MediaElement, infatti, si limita a visualizzare il file selezionato nell'area cliente, esponendo però tutta una serie di API, sotto forma di metodi, proprietà ed eventi, che possono essere utilizzati dallo sviluppatore per controllarne il playback, fornire feedback sullo stato di download del file, del buffering, sulla sua durata, ecc... Insomma, realizzare un player più interattivo, simile a quello mostrato in figura

è solo questione di scrivere un po' di codice. In questo esempio si è voluto innanzitutto consentire all'utente di interrompere o riprendere la visualizzazione del filmato utilizzando due pulsanti che, al click, invocano rispettivamente i metodi Pause e Play,

private void btnPlay_Click(object sender, RoutedEventArgs e) 
{ 
    this.media.Play(); 
} 
 
private void btnPause_Click(object sender, RoutedEventArgs e) 
{ 
    this.media.Pause(); 
} 

mentre il riavvolgimento si ottiene resettando la proprietà Position:

private void btnRewind_Click(object sender, RoutedEventArgs e) 
{ 
    this.media.Position = new TimeSpan(); 
} 

Nella pagina è presente anche un controllo Slider che può essere trascinato dall'utente per modificare la posizione corrente del filmato; questo effetto si ottiene in maniera piuttosto semplice gestendo gli eventi di MouseDown e MouseUp per individuare l'inizio e la fine dell'operazione di trascinamento, calcolando poi il nuovo valore per la proprietà Position ad ogni cambio di valore:

private bool repositioning; 
private void timeline_MouseLeftButtonDown(object sender, MouseButtonEventArgs e) 
{ 
    repositioning = true; 
} 
 
private void timeline_MouseLeftButtonUp(object sender, MouseButtonEventArgs e) 
{ 
    repositioning = false; 
} 
 
private void timeline_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e) 
{ 
    if (repositioning) 
    { 
        this.media.Position = 
            new TimeSpan(Convert.ToInt64( 
                this.timeline.Value / 100 * this.media.NaturalDuration.TimeSpan.Ticks)); 
    } 
} 

Mostrare invece tramite lo stesso oggetto il progresso della riproduzione, richiede qualche considerazione in più. Sebbene l'idea più semplice sia quella di effettuare un Binding tra la proprietà Position del MediaElement e Slider.Value, in realtà non si tratta di un percorso praticabile: Position, infatti, viene aggiornata ad intervalli estremamente piccoli, dell'ordine della frazione del millisecondo, e un tale approccio finirebbe per generare un inutile sovraccarico sull'applicazione Silverlight. Per questa ragione nell'applicazione di esempio è stato utilizzato un controllo Timer, instanziato nel costruttore, per interrogare ogni 100 millisecondi tale proprietà e aggiornare la corrispondente posizione nello slider:

public InteractiveMediaPlayer() 
{ 
    InitializeComponent(); 
 
    Timer timer = new Timer(new TimerCallback(positionPolling), null, 0, 100); 
} 
 
private void positionPolling(object state) 
{ 
    this.Dispatcher.BeginInvoke( 
        delegate() 
        { 
            if (!repositioning) 
            { 
                double ratio = this.media.Position.TotalMilliseconds / 
                    this.media.NaturalDuration.TimeSpan.TotalMilliseconds * 100; 
 
                this.timeline.Value = ratio; 
            } 
        } 
    ); 
} 

Una nota importante riguarda l'utilizzo dell'oggetto Dispatcher. Chi è abituato alla programmazione di applicazioni Windows in scenari multithreaded, sa bene che una regola fondamentale è che gli elementi dell'interfaccia non possono essere acceduti da thread diversi da quello principale; dato che l'oggetto Timer esegue il metodo positionPolling in un thread secondario, è necessario utilizzare l'oggetto Dispatcher per far sì che il codice che interagisce con i controlli visuali venga eseguito nel thread corretto. Si tratta di un concetto complesso che esula dagli scopi di questo articolo, ma è doveroso far notare che Silverlight 2 solleva un'eccezione nel caso in cui non si proceda nei termini corretti.

Conclusioni

In questo articolo si è voluto dare una panoramica generale, condita da codice ed esempi, della libreria di controlli contenuta in Silverlight 2, che costituisce il vero e proprio fiore all'occhiello di questa nuova tecnologia di Microsoft. E' doveroso ricordare che si tratta di un framework ancora in corso di sviluppo (a tutt'oggi è stata pubblicata la seconda release in Beta) e che prima della sua versione finale sicuramente aggiungerà ulteriori caratteristiche e funzionalità. In ogni modo, già allo stato attuale ci si trova davanti un prodotto maturo, che sicuramente farà parlare di sé nel campo delle Rich Internet Applications, soprattutto grazie all'immediatezza di utilizzo per tutti coloro che sono già abituati a lavorare nell'ambiente .Net.

Sullo stesso argomento

Commenti

Per inserire un commento, devi avere un account.

Fai il login e torna a questa pagina, oppure registrati alla nostra community.

Segnala su: