Sunday, February 24, 2008

ASP.NET 3.5: Skin MediaPlayer

. Sunday, February 24, 2008


Come già accennato qui le estensioni di ASP.NET 3.5 aggiungono una serie di funzionalità, tra cui alcuni controlli come per esempio il MediaPlayer, da utilizzare in applicazioni che necessitano di Silverlight.

mediaPlayer1Per poter utilizzare il controllo è necessario avere nella pagina un controllo ScriptManager.
Questo componente introdotto con ASP.NET Ajax  si occupa di rendere disponibile sul client il codice Javascript necessario al funzionamento della libreria.
Il controllo MediaPlayer espone una property MediaSource, attraverso la quale possiamo definire il file audio o video da lanciare.
I formati utilizzabili: mp3, wmv, wma, asx.
Modificare l'aspetto del player è molto semplice, basta impostare la property MediaSkin scegliendo tra i vari skin presenti:

mediaPlayer2AudioGray,
Basic,
Classic,
Console,
Expression,
Professional,
Simple.

 

 

Ma è possibile spingersi oltre, dato che possiamo creare il nostro personale skin tramite XAML ( non ci dobbiamo meravigliare di questo dato che Silverlight è basato su XAML). 
Per fare un piccolo esempio possiamo partire da una "base già pronta", cioè estrapolando il markup XAML da uno degli skin già menzionati in precedenza.
Per far ciò utilizziamo la voce Save a Copy presente nel MediaPlayerTasks:

mediaPlayer3

A questo punto possiamo modificare l'interfaccia:

mediaPlayer4In questo preciso caso ho usato Expression Blend, cambiando banalmente colore e forma del pulsante play.
Dopo aver apportato le nostre modifiche grafiche possiamo dare in pasto al contollo MediaPlayer il nuovo XAML settando la property Source:

 


   1: <asp:MediaPlayer ID="mplayer" runat="server" Height="640px" Width="480px"
   2:   MediaSource="path audio" AutoPlay="true"
   3:   Source="~/media/MySkin.xaml">
   4: </asp:MediaPlayer>

Risultato finale:
mediaPlayer5

0 commenti:

Post a Comment