Con le precedenti versioni di FlashLite (1.* e 2.*) la visualizzazione di filmati all’interno di un’applicazione mobile, era limitato ai formati supportati dal telefonino in cui veniva utilizzata e non era possibile, inoltre, effettuare semplici operazioni sui video come la rotazione, l’applicazione di maschere o ad esempio il controllo del volume.

E’ facile comprendere, quindi, come il supporto ai video FLV sia una delle features più attese nella release 3 di FlashLite e, anche se il software è ancora in versione beta (disponibile su Adobe Lab) i test che abbiamo effettuato hanno avuto esito positivo e hanno confermato una certa stabilità e maturità del prodotto.

In questo articolo spiegheremo come realizzare un semplice player per visualizzare un filmato in formato FLV con la tecnica del “progressive download”, sia in locale che in remoto, posizionato quindi sia sul proprio telefonino che su un hosting tradizionale.
E’ inoltre possibile visualizzare video in streaming (anche in tempo reale) sfruttando Flash Media Server 3.

Realizziamo quindi il nostro video player in pochi semplici passi:

1)
Innanzitutto è necessario scaricare dal sito Adobe Lab l’ultima versione del player FlashLite 3, attualmente certificato per funzionare solo su dispositivi Nokia N95, ma che dovrebbe funzionare su tutti i Nokia S60 3rd edition: 3250, 5500 Sport, 5700, 6110 Navigator, 6120 Classic, 6121 Classic, 6290, E50, E51, E60, E61, E61i, E62, E65, E70, E90, N71, N73, N73 Music Edition, N75, N76, N77, N80, N80 IE, N81, N81 8GB, N82, N91, N91 8GB, N92, N93, N93i, N95, N95 US 3G, N95 8GB.
Ho infatti utilizzato senza intoppi un Nokia E65, sfruttando la modalità Wi-Fi per effettuare i test in remoto.

2)
Per creare l’applicazione dovrete necessariamente utilizzare Adobe Flash CS3, ma sarà necessario scaricare l’ultimo aggiornamento disponibile sul sito Adobe, attualmente la 9.02 (marzo 2008), che tra le varie novità estende il supporto alla versione 3 di FlashLite.

3)
Create quindi un nuovo documento Flash File (mobile) settando la proprietà Player Version in Flash Lite 3.0. Selezionate poi il dispositivo per il quale volete sviluppare il video player, scegliendo l’opportuna risoluzione. Nel mio caso, disponendo di un Nokia E65, ho selezionato il device FlashLite 3.0 240×320px 16.

4) Create quindi quattro livelli:
- As: che conterrà il codice utile al funzionamento del player
- Video: contiene l’oggetto video nel quale verrà visualizzato il filmato FLV
- Testi: tutte le descrizioni inserite nell’applicazione (ovvero dei campi di testo statici)
- BackGround: che contiene le bande grigie situate sotto i testi

NOTA: COME CREARE UN NUOVO OGGETTO VIDEO
Per creare un nuovo oggetto video è necessario aprire il menu della libreria, selezionare l’opzione New Video, e trascinare l’oggetto sullo Stage, posizionandolo alle coordinate (x: 0, y:100) e settando una dimensione adatta a visualizzare i video che andrete a proporre.
Nel mio caso 240 x 129 pixel, visto che il video che ho usato in questo esempio ha tali dimensioni.

5)
In sostanza, tramite il nostro player, l’utente potrà avviare un video cliccando sul tasto SOFT KEY 1 (vedi immagine seguente) e uscire dall’applicazione premente il tasto SOFT KEY2.

Copiate quindi il seguente codice ActionScript 2.0 all’interno del livello AS e testate l’applicazione premendo CTRL+ENTER, avviando automaticamente il DEVICE CENTRAL.
Lo script è spiegato passo-passo attraverso commenti posizionati in ogni punto del codice.

// =========================================================
// FS Commands
// =========================================================
// Abilitiamo l'utilizzo delle SOFT Keys
fscommand2("SetSoftKeys", "", "Exit");
 
// Qualità Alta
fscommand2("SetQuality", "high");
 
// Modalità FullScreen Attivata
fscommand2("Fullscreen", "true");
 
// =========================================================
// Dichiarazione variabili
// =========================================================
 
// Path filmato FLV Locale:
var videos:String = "divani&divani_spot_S60.flv";
 
// Path filmato FLV Remoto:
// var videos:String = "http://augitaly.fabiobiondi.com/UM/4_FLite3Video/divani&divani_spot_S60.flv";
 
// NetConnection
var nc:NetConnection;
 
// Flusso stream
var ns:NetStream;
 
// =========================================================
// Gestione pressione Tasti
// =========================================================
var tmpObj:Object = {};
tmpObj.onKeyDown = function():Void  {
 
	switch(Key.getCode())
	{
 
		// SOFT KEY SINISTRA
		// == > Play Video
		case ExtendedKey.SOFT1:
			playVideo(videos);
			break;
 
		// SOFT KEY DESTRA
		// == > Chiudi l'applicazione
		case ExtendedKey.SOFT2:
			fscommand2("Quit");
			break;
	}
};
Key.addListener(tmpObj);
 
// =========================================================
// Visualizzazione del Video .flv
// =========================================================
 
function playVideo(file:String):Void {
 
	// Creiamo una nuova connessione NetConnection (solo la prima volta)
	if (!nc)
	{
		nc = new NetConnection();
		nc.connect(null);
	}
 
	// Creiamo un nuovo flusso Stream (solo la prima volta)
	if (!ns)
		ns = new NetStream(nc);
 
	// Abbiniamo il flusso stream all'oggetto video presente su Stage
	video_obj.attachVideo(ns);
 
	// Play File
	ns.play(file);
 
}
 
stop();

NOTA: Per visualizzare video FLV posizionati su server remoti, eliminate il commento alla riga precedente, e abilitate l’opzione “Local playback security” in “Access network only”, che trovate in fondo nelle impostazioni di pubblicazione (File -> Publish settings).

Download Source Code