Reprodução de vídeo no modo de tela cheia

Flash Player 9 e posterior, Adobe AIR 1.0 e posterior

O Flash Player e o AIR permitem criar um aplicativo em tela cheia para a reprodução de vídeos e dão suporte ao dimensionamento de vídeo em tela cheia.

Para conteúdo do AIR em execução em modo de tela cheia na área de trabalho, o protetor de tela do sistema e as opções de economia de energia ficam desativados durante a reprodução até que a entrada de vídeo pare ou que o usuário saia do modo de tela cheia.

Para obter detalhes sobre como usar o modo de tela cheia, consulte Trabalho com o modo de tela cheia .

Ativação do modo de tela cheia do Flash Player em um navegador

Para que você possa implementar o modo de tela cheia do Flash Player em um navegador, ative-o através do modelo Publish do seu aplicativo. Os modelos que permitem o modo de tela cheia incluem as tags <object> e <embed> que contêm um parâmetro allowFullScreen . O exemplo a seguir mostra o parâmetro allowFullScreen em uma tag <embed> .

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" 
    id="fullScreen" width="100%" height="100%" 
    codebase="http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab"> 
    ... 
    <param name="allowFullScreen" value="true" /> 
    <embed src="fullScreen.swf" allowFullScreen="true" quality="high" bgcolor="#869ca7" 
        width="100%" height="100%" name="fullScreen" align="middle" 
        play="true" 
        loop="false" 
        quality="high" 
        allowScriptAccess="sameDomain" 
        type="application/x-shockwave-flash" 
        pluginspage="http://www.adobe.com/go/getflashplayer"> 
    </embed> 
    ... 
</object>

No Flash, selecione Arquivo -> Configurações de publicação e, na aba HTML da caixa de diálogo Configurações de publicação, selecione o modelo Somente Flash - Permitir tela cheia.

No Flex, verifique se o modelo HTML inclui as tags <object> e <embed> que dão suporte a tela cheia.

Inicialização do modo de tela cheia

Para conteúdo Flash Player executado em um navegador, você inicia o modo de tela cheia para vídeo em resposta a um clique do mouse ou a um pressionamento de tecla. Por exemplo, você pode iniciar o modo de tela cheia quando o usuário clica em um botão chamado Tela cheia ou seleciona um comando Tela cheia em um menu de contexto. Para responder ao usuário, adicione um ouvinte de eventos ao objeto no qual ocorre a ação. O seguinte código adiciona um ouvinte de eventos a um botão no qual o usuário clica para entrar no modo de tela cheia:

var fullScreenButton:Button = new Button(); 
fullScreenButton.label = "Full Screen"; 
addChild(fullScreenButton); 
fullScreenButton.addEventListener(MouseEvent.CLICK, fullScreenButtonHandler); 
 
function fullScreenButtonHandler(event:MouseEvent) 
{ 
    stage.displayState = StageDisplayState.FULL_SCREEN;     
 
}

O código inicia o modo de tela cheia definindo a propriedade Stage.displayState como StageDisplayState.FULL_SCREEN . Este código dimensiona todo o palco em tela cheia, sendo que o vídeo é dimensionado proporcionalmente ao espaço que ocupa no palco.

A propriedade fullScreenSourceRect permite especificar uma determinada área do palco a ser dimensionada para tela cheia. Primeiro, defina o retângulo que você deseja dimensionar para tela cheia. Depois, atribua-o à propriedade Stage.fullScreenSourceRect . Esta versão da função fullScreenButtonHandler() adiciona duas linhas a mais de código que dimensionam somente o vídeo para tela cheia.

private function fullScreenButtonHandler(event:MouseEvent) 
{ 
    var screenRectangle:Rectangle = new Rectangle(video.x, video.y, video.width, video.height); 
    stage.fullScreenSourceRect = screenRectangle; 
    stage.displayState = StageDisplayState.FULL_SCREEN; 
}

Embora este exemplo chame um manipulador de eventos em resposta a um clique do mouse, a técnica de entrar no modo de tela cheia é a mesma para o Flash Player e o AIR. Defina o retângulo que você deseja dimensionar e configure a propriedade Stage.displayState . Para obter mais informações, consulte Referência do ActionScript® 3.0 para Adobe® Flash® Platform .

O exemplo completo, mostrado a seguir, adiciona um código que cria a conexão e o objeto NetStream para o vídeo e começa a reproduzi-lo.

package 
{ 
    import flash.net.NetConnection; 
    import flash.net.NetStream; 
    import flash.media.Video; 
    import flash.display.StageDisplayState; 
    import fl.controls.Button; 
    import flash.display.Sprite; 
    import flash.events.MouseEvent; 
    import flash.events.FullScreenEvent; 
    import flash.geom.Rectangle; 
     
    public class FullScreenVideoExample extends Sprite 
    {     
        var fullScreenButton:Button = new Button(); 
        var video:Video = new Video(); 
 
        public function FullScreenVideoExample() 
        { 
            var videoConnection:NetConnection = new NetConnection(); 
            videoConnection.connect(null); 
             
            var videoStream:NetStream = new NetStream(videoConnection); 
            videoStream.client = this; 
 
            addChild(video); 
             
            video.attachNetStream(videoStream); 
             
            videoStream.play("http://www.helpexamples.com/flash/video/water.flv"); 
             
            fullScreenButton.x = 100; 
            fullScreenButton.y = 270; 
            fullScreenButton.label = "Full Screen"; 
            addChild(fullScreenButton); 
            fullScreenButton.addEventListener(MouseEvent.CLICK, fullScreenButtonHandler); 
        } 
 
        private function fullScreenButtonHandler(event:MouseEvent) 
        {  
            var screenRectangle:Rectangle = new Rectangle(video.x, video.y, video.width, video.height); 
            stage.fullScreenSourceRect = screenRectangle; 
            stage.displayState = StageDisplayState.FULL_SCREEN;  
        }     
         
        public function onMetaData(infoObject:Object):void 
        { 
            // stub for callback function 
        } 
    } 
}

A função onMetaData() é uma função de retorno de chamada que manipula os metadados do vídeo, se houver. Uma função de retorno de chamada é a função que o tempo de execução chama em resposta a algum tipo de ocorrência ou evento. Neste exemplo, a função onMetaData() é um stub que atende ao requisito de fornecer a função. Para obter mais informações, consulte Criação de métodos de retorno de chamada para metadados e pontos de sinalização

Saída do modo de tela cheia

Um usuário pode sair do modo de tela cheia usando um dos atalhos de teclado, como a tecla Escape. Você pode encerrar o modo de tela cheia no ActionScript definindo a propriedade Stage.displayState como StageDisplayState.NORMAL . O código do exemplo a seguir finaliza o modo de tela cheia quando ocorre o evento NetStream.Play.Stop netStatus .

videoStream.addEventListener(NetStatusEvent.NET_STATUS, netStatusHandler); 
 
private function netStatusHandler(event:NetStatusEvent) 
{ 
    if(event.info.code == "NetStream.Play.Stop") 
        stage.displayState = StageDisplayState.NORMAL; 
}

Aceleração de hardware em tela cheia

Quando você dimensiona novamente a área retangular do palco para o modo de tela cheia, o Flash Player ou o AIR usa aceleração por hardware caso ela esteja disponível e ativada. O tempo de execução usa o adaptador de vídeo do computador para acelerar o dimensionamento do vídeo ou de uma parte do palco para o tamanho de tela cheia. Nessas circunstâncias, os aplicativos do Flash Player frequentemente se beneficiam alternando da classe Video para a classe StageVideo (ou classe Camera; Flash Player 11.4/AIR 3.4 e superior).

Para obter mais informações sobre aceleração de hardware no modo de tela cheia, consulte Trabalho com o modo de tela cheia . Para obter mais informações sobre StageVideo, consulte Uso da classe StageVideo para apresentação acelerada por hardware .