FLV Flash Fullscreen Player

Ich habe gerade den FLV Flash Fullscreen Video Player (Open Source) auf Version 1.9.5 aktualisiert. Neu ist eine wichtige Schnittstelle für Flashentwickler, damit man den Player in AS3 instanzieren und dynamisch aktualisieren kann.

Player auf die Bühne bringen

Die Klassen des FLV Players werden mit import org.FLVPlayer.*; importiert. Mit var myFLVPlayer:FLVPlayer = new FLVPlayer(); und addChild(myFLVPlayer) erstellt man eine neue Instanz des Players und fügt man sie der Bühne hinzu. Die FLVPlayer-Klasse erweitert übrigens die Klasse MovieClip, weshalb der Player wie ein gewöhnliche MovieClip genutzt werden kann (z.B. myFLVPlayer.x = 250;).

Eigenschaften festlegen

Jetzt benötigt der Player Informationen, was er darstellen soll. Dafür gibt es die Klasse Param. Mit var myParam1:Param = new Param(); erstellt man eine neue Instanz. Diese gilt es nun zu befüllen: myParam1.video = "demo-video.flv" legt die Videodatei fest, myParam1.preview = "demo-preview.jpg" definiert das Vorschaubild und so weiter. Eine komplette Übersicht der Eigenschaften des Param-Objekt findet man in der Dokumentation des Players, denn es sind die gleichen, die auch über HTML festgelegt werden können. Einziger Unterschied: Während die Parameter in HTML komplett kleingeschrieben sind (z.B. autoscale), schreibt man in ActionScript die Flash-typische Schreibweise (autoScale).

Player initieren und aktualisieren

Jetzt kann man den FLV Player mit dem gerade erstellten Param-Objekt starten: myFLVPlayer.start(myParam1)

Um den Inhalt des Players zur Laufzeit zu ändern, gibt es die Funktion updatePlayer(p:Param). Dies bedeutet, dass man ein neues/aktualisiertes Param-Objekt an der Player übergeben kann und dieser sich damit neu initiert (z.B.myFLVPlayer.updatePlayer(myParam2)).

Beispiel

Das Beispiel zeigt, wie man den Player in ActionScript 3 einsetzt. Anhand einer angedeuteten Playlist wird auch die neue Update-Funktion gezeigt. Im Folgenden der Code des Beispiels (Link siehe unten). Die Flashdatei (.fla) befindet im Download der aktuellen Version des Players.

Link: Beispiel anschauen

Actionscript:
  1. import org.FLVPlayer.*;
  2.  
  3. import fl.controls.DataGrid;
  4. import fl.controls.dataGridClasses.DataGridColumn;
  5. import fl.data.DataProvider;
  6. import fl.events.*;
  7.  
  8. // create new player and add to stage
  9. var myFLVPlayer:FLVPlayer = new FLVPlayer();
  10. addChild(myFLVPlayer);
  11. myFLVPlayer.x = 250;
  12. myFLVPlayer.y = 15;
  13.  
  14. // new param objects
  15. var myParam1:Param = new Param();
  16. var myParam2:Param = new Param();
  17. var myParam3:Param = new Param();
  18.  
  19. // param 1
  20. myParam1.contentPath = "content";
  21. myParam1.video = "demo-video.flv";
  22. myParam1.preview = "demo-preview.jpg";
  23. myParam1.skinColor = 0x004460;
  24.  
  25. // param 2
  26. myParam2.contentPath = "content";
  27. myParam2.video = "demo-ad.flv";
  28. myParam2.preview = "content/demo-preview.jpg";
  29. myParam2.skin = "skin-applestyle.swf";
  30.  
  31. // param 3
  32. myParam3.contentPath = "content";
  33. myParam3.video = "demo-video.flv";
  34. myParam3.preview = "demo-preview.jpg";
  35. myParam3.skin = "skin-applestyle.swf";
  36. myParam3.autoScale = false;
  37. myParam3.videoWidth = 640;
  38. myParam3.videoHeight = 480;
  39.  
  40. // start with first param
  41. myFLVPlayer.start(myParam1);
  42.  
  43. //
  44. function onClick(evt:ListEvent) {
  45.    
  46.     if (evt.rowIndex == 0)  myFLVPlayer.updatePlayer(myParam1);
  47.     if (evt.rowIndex == 1)  myFLVPlayer.updatePlayer(myParam2);   
  48.     if (evt.rowIndex == 2)  myFLVPlayer.updatePlayer(myParam3);   
  49.  
  50.        
  51. }
  52.  
  53.  
  54.  
  55. // ::::: DATAGRID ::::
  56.  
  57. // new data provider
  58. var dp:DataProvider = new DataProvider();
  59.  
  60. // drei einträge hinzufügen
  61. dp.addItem({Playlist:"My demo video"});
  62. dp.addItem({Playlist:"My demo ad"});
  63. dp.addItem({Playlist:"My demo video (big)"});
  64.  
  65.  
  66. // den data provider als datenquelle festlegen
  67. myDataGrid.dataProvider = dp;
  68.  
  69. // event listener
  70. myDataGrid.addEventListener(ListEvent.ITEM_CLICK, onClick);

Link: Beispiel anschauen
Link: FLV Flash Fullscreen Video Player