Suporte de tela cheia

A versão do ActionScript 3.0 do componente FLVPlayback oferece suporte ao modo de tela cheia, o que requer o Flash Player 9.0.28.0 ou posterior e também que o HTML esteja configurado corretamente para exibição em tela cheia. Algumas capas previamente criadas incluem um botão de alternância para alternar entre o modo de tela cheia ligado e desligado. O ícone FullScreenButton é exibido do lado direito da barra de controle na ilustração a seguir.

Ícone Tela cheia na barra de controle

Ocorre suporte de tela cheia apenas se a propriedade fullScreenTakeOver estiver configurada como true , que é o padrão.

O suporte de tela cheia pode ocorrer com ou sem suporte para aceleração de hardware. Para obter mais informações sobre o suporte para aceleração de hardware, consulte Aceleração por hardware .

Para implementar o suporte de tela cheia de FLVPlayback:

  1. Adicione o componente FLVPlayback ao seu aplicativo e atribua um arquivo de vídeo a ele.

  2. Selecione uma capa para o componente FLVPlayback que tenha o botão de tela cheia (por ex., SkinUnderPlaySeekFullscreen.swf) ou adicione o componente FullScreenButton da interface do usuário ao componente FLVPlayback na seção Video do painel Componentes.

  3. Selecione Arquivo > Configurações de publicação.

  4. Na caixa de diálogo Configurações de publicação, clique na guia HTML.

  5. Na guia HTML, selecione Flash com suporte para tela cheia, no menu pop-up Modelo.

  6. Além disso, na guia HTML, selecione a caixa de seleção Detectar versão do Flash e especifique uma versão de 9.0.28 ou posterior, dependendo da versão de Flash Player que estiver usando.

  7. Selecione a guia Formatos e certifique-se de que as opções Flash (.swf) e HTML (.html) estejam selecionadas. Você pode substituir os nomes de arquivo padrão.

  8. Clique em Publicar e, em seguida, clique em OK.

    Como alternativa para a etapa 7, você pode clicar em OK e, em seguida, selecionar Arquivo > Publicar visualização > Padrão - (HTML) para abrir automaticamente o arquivo HTML exportado em seu navegador padrão. Ou abra o arquivo HTML exportado com o navegador para testar a opção de tela cheia.

    Para adicionar o componente FLVPlayback com suporte de tela cheia à sua página da Web, abra o arquivo HTML exportado e copie o código que incorpora o arquivo SWF no arquivo HTML de sua página da Web. Este código deve se parecer com o exemplo a seguir:

    //from the <head> section 
     
    <script language="javascript"> AC_FL_RunContent = 0; </script>  
    <script language="javascript"> DetectFlashVer = 0; </script>  
    <script src="AC_RunActiveContent.js" language="javascript"></script> 
    <script language="JavaScript" type="text/javascript">  
    <!--  
    // -----------------------------------------------------------------------------  
    // Globals  
    // Major version of Flash required  
    var requiredMajorVersion = 9;  
    // Minor version of Flash required  
    var requiredMinorVersion = 0;  
    // Revision of Flash required  
    var requiredRevision = 28;  
    // -----------------------------------------------------------------------------  
    // -->  
    </script>  
     
    //and from the <body> section 
     
    <script language="JavaScript" type="text/javascript">  
    <!--  
    if (AC_FL_RunContent == 0 || DetectFlashVer == 0) {  
        alert("This page requires AC_RunActiveContent.js.");  
    } else {  
        var hasRightVersion = DetectFlashVer(requiredMajorVersion, 
            requiredMinorVersion, requiredRevision);  
        if(hasRightVersion) { // if we&apos;ve detected an acceptable version  
            // embed the Flash movie  
            AC_FL_RunContent(  
                &apos;codebase&apos;, &apos;http://download.macromedia.com/pub/ 
                    shockwave/cabs/flash/swflash.cab#version=9,0,28,0&apos;,  
                &apos;width&apos;, &apos;550&apos;,  
                &apos;height&apos;, &apos;400&apos;, 
                &apos;src&apos;, &apos;fullscreen&apos;,  
                &apos;quality&apos;, &apos;high&apos;,  
                &apos;pluginspage&apos;, &apos;http://www.macromedia.com/go/ 
                    getflashplayer&apos;,  
                &apos;align&apos;, &apos;middle&apos;,  
                &apos;play&apos;, &apos;true&apos;,  
                &apos;loop&apos;, &apos;true&apos;,  
                &apos;scale&apos;, &apos;showall&apos;,  
                &apos;wmode&apos;, &apos;window&apos;,  
                &apos;devicefont&apos;, &apos;false&apos;,  
                &apos;id&apos;, &apos;fullscreen&apos;,  
                &apos;bgcolor&apos;, &apos;#ffffff&apos;,  
                &apos;name&apos;, &apos;fullscreen&apos;,  
                &apos;menu&apos;, &apos;true&apos;, 
                &apos;allowScriptAccess&apos;,&apos;sameDomain&apos;, 
                &apos;allowFullScreen&apos;,&apos;true&apos;,  
                &apos;movie&apos;, &apos;fullscreen&apos;,  
                &apos;salign&apos;, &apos;&apos; ); //end AC code  
        } else { // Flash is too old or we can&apos;t detect the plug-in.  
            var alternateContent = &apos;Alternative HTML content should be placed 
                    here.&apos;  
                + &apos;This content requires Adobe Flash Player.&apos;  
                + &apos;<a href=http://www.macromedia.com/go/getflash/>Get Flash</a> 
                        &apos;;  
            document.write(alternateContent); // Insert non-Flash content.  
        }  
    }  
    // -->  
    </script>  
    <noscript>  
        // Provide alternative content for browsers that do not support scripting  
        // or for those that have scripting disabled.  
        Alternative HTML content should be placed here. This content requires Adobe Flash Player.  
        <a href="http://www.macromedia.com/go/getflash/">Get Flash</a>  
    </noscript>

    Como alternativa, você pode usar o arquivo HTML exportado como modelo para sua página da Web e adicionar a ele outro conteúdo. Porém, se fizer isso, altere o nome do arquivo HTML para não sobregravá-lo acidentalmente caso exporte posteriormente o arquivo HTML FLVPlayback do Flash outra vez.

    De um ou outro modo, você também deve carregar o arquivo AC_RunActiveContent.js para o servidor Web, que é exportado para a mesma pasta do arquivo HTML.

    O suporte do ActionScript para o modo de tela cheia inclui as propriedades fullScreenBackgroundColor , fullScreenSkinDelay, e fullScreenTakeOver e o método enterFullScreenDisplayState() . Para obter informações sobre esses elementos do ActionScript, consulte a Referência do ActionScript 3.0 para Flash Professional .

Uso de enterFullScreenDisplayState()

Você também pode chamar o modo de tela cheia, chamando o método enterFullScreenDisplayState() do ActionScript, conforme mostra o exemplo a seguir.

function handleClick(e:MouseEvent):void { 
    myFLVPlybk.enterFullScreenDisplayState(); 
} 
myButton.addEventListener(MouseEvent.CLICK, handleClick);

Neste exemplo, o modo de tela cheia não é chamado clicando no botão de alternância de tela cheia em uma capa FLVPlayback, mas, em vez disso, clicando em um botão (MyButton) que o criador da página da Web incluiu para chamar o modo de tela cheia. Clicar no botão aciona o manipulador de eventos handleClick , que chama o método enterFullScreen DisplayState() .

O método enterFullScreenDisplayState() define a propriedade Stage.displayState para StageDisplayState.FULL_SCREEN e, portanto, carrega as mesmas restrições da propriedade displayState . Para obter mais informações sobre o método enterFullScreenDisplayState() e a propriedade Stage .propriedade displayState , consulte a Referência do ActionScript 3.0 para Flash Professional .

Aceleração por hardware

O Flash Player 9.0.115.0 e versões superiores incluem o código que aproveita o hardware de vídeo disponível para melhorar o desempenho e a fidelidade de arquivos FLV que o FLVPlayback reproduz no modo de tela cheia. Se os pré-requisitos forem atendidos e a propriedade fullScreenTakeOver estiver definida como true , o Flash Player usará a aceleração de hardware para dimensionar o arquivo de vídeo, em vez de dimensioná-lo por meio de software. Se o componente FLVPlayback for executado em uma versão anterior de Flash Player ou se não houver pré-requisitos de aceleração de hardware, o Flash Player dimensionará o próprio arquivo de vídeo, como fez anteriormente.

Para aproveitar a aceleração de hardware no suporte de tela cheia, o computador deve ter uma placa de vídeo compatível com DirectX 7 com 4 MB ou mais de VRAM (RAM de vídeo). Esse suporte de hardware está disponível no Windows 2000 ou no Mac OS X 10.2 e versões posteriores desses sistemas operacionais. O Direct X® fornece APIs que formam uma interface entre o software e o hardware de vídeo para acelerar gráficos tridimensionais e bidimensionais, entre outras coisas.

Para aproveitar o modo de aceleração de hardware, você também deve chamar o modo de tela cheia de uma das seguintes maneiras:

  • Uso do botão de alternância de tela cheia em uma capa FLVPlayback

  • Usar o controle de vídeo FullScreenButton

  • Usar o método enterFullScreenDisplayState() do ActionScript. Para obter mais informações, consulte Uso de enterFullScreenDisplayState() .

    Se você chamar o modo de tela cheia definindo a propriedade Stage.displayState como StageDisplayState.FULLSCREEN , o FLVPlayback não usará a aceleração de hardware, mesmo que o hardware de vídeo e a memória estejam disponíveis.

    Uma conseqüência de usar a aceleração de hardware para suporte de tela cheia é que as capas FLVPlayback são dimensionadas juntamente com o player de vídeo e o arquivo de vídeo. A imagem seguinte mostra o efeito do modo de tela cheia com aceleração de hardware na capa FLVPlayback, um detalhe mostrado aqui em resolução total.

    Modo de tela cheia em um monitor de 1600 x 1200 com vídeo de 320x240 pixels
    Modo de tela cheia em um monitor de 1600 x 1200 com vídeo de 320x240 pixels

    Essa imagem mostra o resultado de usar o modo tela de cheia em um monitor 1600 x 1200 com um arquivo de vídeo que tenha largura de 320 e altura de 240, as dimensões padrão do FLVPlayback. O efeito de distorção na capa é mais pronunciado nos arquivos FLV com dimensões menores ou em um monitor maior. Por outro lado, o efeito de distorção é menos pronunciado em arquivos FLV maiores ou em monitores menores. Por exemplo, alterar de 640 x 480 para 1600 x 1200 ainda aumenta o tamanho da capa, mas ela parece menos distorcida.

    Você pode definir a propriedade skinScaleMaximum para limitar o dimensionamento da capa FLVPlayback. O valor padrão é 4,0 ou 400%. Porém, limitar o dimensionamento da capa requer uma combinação de hardware e software para dimensionar o FLV e isso pode afetar de forma adversa o desempenho em FLVs com dimensões grandes que sejam codificados em taxas de bits maiores. Se o vídeo for grande (por exemplo, 640 pixels de largura ou mais, 480 pixels de altura ou mais), você não deve definir skinScaleMaximum para um valor pequeno, pois isso pode causar problemas de desempenho em monitores grandes. A propriedade skinScaleMaximum permite gerenciar a compensação entre desempenho e qualidade e a aparência de uma capa grande.

Sair do modo de tela cheia

Para sair do modo de tela cheia, clique novamente no botão de tela cheia ou pressione a tecla Esc.

Se você definir as propriedades a seguir e chamar os métodos a seguir, poderão ocorrer alterações no layout que causam a saída do componente FLVPLayback do modo de tela cheia: height , registrationHeight , registrationWidth , registrationX , registrationY , scaleX , scaleY , width , x , y , setScale() ou setSize() .

Se você define as propriedades align ou scaleMode , o FLVPlayback as define como center e maintainAspectRatio até sair do modo de tela cheia.

Alterar o valor da propriedade fullScreenTakeOver de true para false quando você estiver usando o modo de aceleração de hardware de tela cheia, também faz com que o Flash saia do modo de tela cheia.