Flex - Controllo VideoPlayer

introduzione

Il controllo Video supporta la riproduzione di file FLV e F4v. Questo controllo contiene un'interfaccia utente con funzionalità complete per il controllo della riproduzione video.

Dichiarazione di classe

Di seguito è riportata la dichiarazione per spark.components.VideoPlayer classe -

public class VideoPlayer 
   extends SkinnableComponent

Proprietà pubbliche

Suor n	Proprietà e descrizione
1	autoDisplayFirstFrame : Boolean Se autoPlay = false, autoDisplayFirstFrame controlla se il video viene caricato quando viene impostata la sorgente.
2	autoPlay : Boolean Specifica se la riproduzione del video inizia immediatamente quando viene impostata la proprietà della sorgente.
3	autoRewind : Boolean Specifica se il file FLV deve tornare indietro al primo fotogramma quando la riproduzione si interrompe, chiamando il metodo stop () o raggiungendo la fine del flusso.
4	bytesLoaded : Number [sola lettura] Il numero di byte di dati che sono stati scaricati nell'applicazione.
5	bytesTotal : Number [sola lettura] La dimensione totale in byte dei dati scaricati nell'applicazione.
6	currentTime : Number [sola lettura] Tempo corrente dell'indicatore di riproduzione, misurato in secondi, dall'inizio della riproduzione del video.
7	duration : Number [sola lettura] Durata della riproduzione del video, in secondi.
8	loop : Boolean Indica se il supporto deve essere riprodotto di nuovo al termine della riproduzione.
9	mediaPlayerState : String [sola lettura] Lo stato corrente del video.
10	muted : Boolean Imposta su true per disattivare l'audio del video, false per riattivare l'audio del video.
11	pauseWhenHidden : Boolean Controlla se il video continua a essere riprodotto quando è "nascosto".
12	playing : Boolean [sola lettura] Contiene true se il video è in riproduzione o sta tentando di riprodurlo.
13	scaleMode : String La proprietà scaleMode descrive diversi modi di ridimensionare il contenuto video.
14	source : Object La sorgente video.
15	videoObject : Video [sola lettura] L'oggetto flash player flash.media.Video sottostante.
16	volume : Number Il livello del volume, specificato come valore compreso tra 0 e 1.

Metodi pubblici

Suor n	Metodo e descrizione
1	VideoPlayer() Costruttore.
2	pause():void Mette in pausa la riproduzione senza spostare la testina di riproduzione.
3	play():void Fa sì che il video venga riprodotto.
4	seek(time:Number):void Cerca il tempo dato nel video.
5	stop():void Arresta la riproduzione del video.

Metodi protetti

Suor n	Metodo e descrizione
1	formatTimeValue(value:Number):String Formatta un valore di tempo, specificato in secondi, in una stringa che viene utilizzata per currentTime e la durata.

Eventi

Suor n	Metodo e descrizione
1	bytesLoadedChange Inviato quando i dati vengono ricevuti mentre è in corso un'operazione di download.
2	complete Inviato quando la testina di riproduzione raggiunge la durata del supporto riproducibile.
3	currentTimeChange Inviato quando la proprietà currentTime di MediaPlayer è cambiata.
4	durationChange Inviato quando la proprietà della durata del supporto è cambiata.
5	mediaPlayerStateChange Inviato quando lo stato di MediaPlayer è cambiato.

Metodi ereditati

Questa classe eredita i metodi dalle seguenti classi:

spark.components.supportClasses.SkinnableComponent
mx.core.UIComponent
mx.core.FlexSprite
flash.display.Sprite
flash.display.DisplayObjectContainer
flash.display.InteractiveObject
flash.display.DisplayObject
flash.events.EventDispatcher
Object

Esempio di controllo di Flex VideoPlayer

Seguiamo i seguenti passaggi per verificare l'utilizzo del controllo di VideoPlayer in un'applicazione Flex creando un'applicazione di prova:

Passo	Descrizione
1	Crea un progetto con un nome HelloWorld sotto un pacchetto com.tutorialspoint.client come spiegato nel capitolo Flex - Crea applicazione .
2	Aggiungi una cartella video alla cartella src . E aggiungi un video di esempio.
3	Modifica HelloWorld.mxml come spiegato di seguito. Mantieni il resto dei file invariato.
4	Compilare ed eseguire l'applicazione per assicurarsi che la logica aziendale funzioni secondo i requisiti.

Di seguito è riportato il modo per incorporare un video in un'applicazione flessibile.

<s:VideoPlayer source = "video/just for laugh magic trick.flv"
   width = "350" height = "250" loop = "true" />

Di seguito è riportato il contenuto del file mxml modificato src/com.tutorialspoint/HelloWorld.mxml.

<?xml version = "1.0" encoding = "utf-8"?>
<s:Application xmlns:fx = "http://ns.adobe.com/mxml/2009"
   xmlns:s = "library://ns.adobe.com/flex/spark"
   xmlns:mx = "library://ns.adobe.com/flex/mx
   width = "100%" height = "100%" minWidth = "500" minHeight = "500">
   
   <fx:Style source = "/com/tutorialspoint/client/Style.css" />	   
   <s:BorderContainer width = "630" height = "480" id = "mainContainer" 
      styleName = "container">
      
      <s:VGroup width = "100%" height = "100%" gap = "50" 
         horizontalAlign = "center" verticalAlign = "middle">
         <s:Label id = "lblHeader" text = "Complex Controls Demonstration" 
            fontSize = "40" color = "0x777777" styleName = "heading" />
            
            <s:Panel id = "videoPlayerPanel" title = "Using VideoPlayer" 
               width = "500" height = "300" >
               <s:layout>
                  <s:HorizontalLayout  gap = "10" verticalAlign = "middle" 
                     horizontalAlign = "center" />	
               </s:layout>				
               
               <s:VideoPlayer source = "video/just for laugh magic trick.flv"
                  width = "350" height = "250" loop = "true" />				
            </s:Panel>
      </s:VGroup>	 
   </s:BorderContainer>	
</s:Application>

Una volta che sei pronto con tutte le modifiche apportate, compiliamo ed eseguiamo l'applicazione in modalità normale come abbiamo fatto nel capitolo Flex - Crea applicazione . Se tutto va bene con la tua applicazione, produrrà il seguente risultato: [ Provalo online ]

↰ Previous page