Configuración de las propiedades de Stage

Flash Player 9 y posterior, Adobe AIR 1.0 y posterior

La clase Stage sustituye la mayoría de las propiedades y métodos de la clase DisplayObject. Si se llama a una de estas propiedades o métodos sustituidos, Flash Player o AIR emiten una excepción. Por ejemplo, el objeto Stage no tiene propiedades x ni y porque su posición es fija como el contenedor principal de la aplicación. Las propiedades x e y hacen referencia a la posición de un objeto de visualización con respecto a su contenedor; como Stage no se incluye en ningún otro contenedor de objeto de visualización, estas propiedades no se aplican.

Nota: algunas propiedades y métodos de la clase Stage solo están disponibles para los objetos de visualización que se encuentran en el mismo entorno limitado de seguridad que el primer archivo SWF cargado. Para obtener información, consulte Seguridad del objeto Stage .

Control de la velocidad de fotogramas de reproducción

La propiedad framerate de la clase Stage se utiliza para definir la velocidad de fotogramas de todos los archivos SWF cargados en la aplicación. Para obtener más información, consulte Referencia de ActionScript 3.0 para la plataforma de Adobe Flash .

Control del ajuste de escala del escenario

Cuando la parte de la pantalla que representan Flash Player o AIR cambia de tamaño, el motor de ejecución ajusta automáticamente el contenido de Stage para realizar una compensación. La propiedad scaleMode de la clase Stage determina cómo se ajustará el contenido del escenario. Esta propiedad se puede establecer en cuatro valores distintos, definidos como constantes en la clase flash.display.StageScaleMode:

  • StageScaleMode.EXACT_FIT escala el archivo SWF para rellenar las nuevas dimensiones del escenario sin tener en cuenta la relación de aspecto del contenido original. Puede que los factores de escala no sean los mismos para la anchura y la altura, por lo que el contenido puede aparecer comprimido o expandido si cambia la relación de aspecto del escenario.

  • StageScaleMode.SHOW_ALL escala el archivo SWF para ajustarse por completo a las nuevas dimensiones del escenario sin cambiar la relación de aspecto del contenido. Este modo de escala muestra todo el contenido, pero puede generar bordes de “pantalla ancha”, como las barras negras que aparecen al ver una película de pantalla ancha en una televisión estándar.

  • StageScaleMode.NO_BORDER escala el archivo SWF para ajustarse por completo a las nuevas dimensiones del escenario sin cambiar la relación de aspecto del contenido. Este modo de escala hace un uso completo del área de visualización de escenario, pero puede suponer un recorte.

  • StageScaleMode.NO_SCALE : no escala el archivo SWF. Si las nuevas dimensiones del escenario son más pequeñas, el contenido se recorta; si son mayores, el espacio añadido está en blanco.

    Solo en el modo de escala StageScaleMode.NO_SCALE , las propiedades Width y Height de la clase Stage, se pueden utilizar para determinar las dimensiones en píxeles reales del escenario cuyo tamaño ha cambiado. (En los otros modos de escala, las propiedades stageWidth y stageHeight siempre reflejan la anchura y la altura originales del archivo SWF.) Además, si se establece scaleMode en StageScaleMode.NO_SCALE y se ajusta el tamaño del archivo SWF, se distribuye el evento resize de la clase Stage, lo que permite realizar los ajustes necesarios.

    Por consiguiente, si establece scaleMode en StageScaleMode.NO_SCALE , tendrá mayor control sobre el ajuste del contenido de la pantalla al cambiar el tamaño de la ventana. Por ejemplo, en un archivo SWF que contiene un vídeo y una barra de control, puede que desee que la barra de control mantenga el mismo tamaño cuando se cambie el tamaño del escenario y modificar únicamente el tamaño de la ventana de vídeo para adaptarla al cambio de tamaño del escenario. Esto se ilustra en el siguiente ejemplo: 

    // mainContent is a display object containing the main content; 
// it is positioned at the top-left corner of the Stage, and 
// it should resize when the SWF resizes. 
 
// controlBar is a display object (e.g. a Sprite) containing several 
// buttons; it should stay positioned at the bottom-left corner of the 
// Stage (below mainContent) and it should not resize when the SWF 
// resizes. 
 
import flash.display.Stage; 
import flash.display.StageAlign; 
import flash.display.StageScaleMode; 
import flash.events.Event; 
 
var swfStage:Stage = mainContent.stage; 
swfStage.scaleMode = StageScaleMode.NO_SCALE; 
swfStage.align = StageAlign.TOP_LEFT; 
swfStage.addEventListener(Event.RESIZE, resizeDisplay); 
 
function resizeDisplay(event:Event):void 
{ 
    var swfWidth:int = swfStage.stageWidth; 
    var swfHeight:int = swfStage.stageHeight; 
 
    // Resize the main content area 
    var newContentHeight:Number = swfHeight - controlBar.height; 
    mainContent.height = newContentHeight; 
    mainContent.scaleX = mainContent.scaleY; 
     
    // Reposition the control bar. 
    controlBar.y = newContentHeight; 
}

Definición del modo de escala del escenario para las ventanas de AIR

La propiedad scaleMode del escenario determina el modo en que el escenario escala y recorta los objetos de visualización secundarios cuando una ventana cambia de tamaño. Únicamente el modo noScale se debe utilizar en AIR. En este modo, no se aplica escala al escenario. En cambio, el tamaño del escenario cambia directamente con los límites de la ventana. Los objetos se pueden recortar si se reduce el tamaño de la ventana.

Los modos de escala de escenario se designan para su uso en entornos como, por ejemplo, un navegador web donde no siempre se tiene control sobre la proporción de tamaño o aspecto del escenario. Los modos permiten seleccionar la opción más adecuada cuando el escenario no coincide con la relación de aspecto o tamaño ideal de la aplicación. En AIR, siempre se tiene control del escenario, por lo que en la mayoría de los casos con la nueva distribución del contenido o el ajuste de las dimensiones de la ventana, se obtendrán mejores resultados que activando el ajuste de escala del escenario.

En el navegador y para la ventana de AIR inicial, la relación entre el tamaño de la ventana y el factor de escala inicial se leen desde el archivo SWF cargado. No obstante, cuando se crea un objeto NativeWindow, AIR selecciona una relación arbitraria entre el tamaño de la ventana y el factor de escala de 72:1. De este modo, si la cuenta con 72x72 píxeles, un rectángulo de 10x10 añadido a la ventana se dibuja con el tamaño correcto de 10x10 píxeles. Sin embargo, si la ventana presenta 144x144 píxeles, a un rectángulo de 10x10 píxeles se le aplica una escala de 20x20 píxeles. Si se utiliza scaleMode en lugar de noScale para un escenario de la ventana, la compensación se puede realizar estableciendo el factor de escala de cualquier objeto de visualización de la ventana en una relación de 72 píxeles en la anchura y altura actual del escenario. Por ejemplo, el siguiente código calcula el factor de escala necesario para un objeto de visualización denominado client : 

if(newWindow.stage.scaleMode != StageScaleMode.NO_SCALE){ 
client.scaleX = 72/newWindow.stage.stageWidth; 
client.scaleY = 72/newWindow.stage.stageHeight; 
}
Nota: las ventanas de Flex y HTML establecen automáticamente el valor scaleMode del escenario en noScale . Al cambiar el valor scaleMode , se interrumpen los mecanismos de diseño automático en estos tipos de ventanas.

Trabajo con el modo de pantalla completa

El modo de pantalla completa permite establecer un escenario de película para rellenar el monitor completo de un espectador sin ningún borde de contenedor o menú. La propiedad displayState de la clase Stage se utiliza para activar y desactivar el modo de pantalla completa para un archivo SWF. La propiedad displayState puede establecerse en uno de los valores definidos por las constantes de la clase flash.display.StageDisplayState. Para activar el modo de pantalla completa, debe establecerse la propiedad displayState en StageDisplayState.FULL_SCREEN : 

stage.displayState = StageDisplayState.FULL_SCREEN;

Para activar el modo de pantalla completa(novedad en Flash Player 11.3), establezca la propiedad displayState en StageDisplayState.FULL_SCREEN_INTERACTIVE : 

stage.displayState = StageDisplayState.FULL_SCREEN_INTERACTIVE;

En Flash Player, el modo de pantalla completa solo puede iniciarse a través de ActionScript como respuesta a un clic del ratón (incluido el clic con el botón derecho) o una pulsación de tecla. El contenido de AIR que se ejecuta en el entorno limitado de seguridad de la aplicación no requiere que se indique el modo de pantalla completa como respuesta a un gesto del usuario.

Para salir del modo de pantalla completa, debe establecerse la propiedad displayState en StageDisplayState.NORMAL . 

stage.displayState = StageDisplayState.NORMAL;

Asimismo, el usuario puede optar por salir del modo de pantalla completa cambiando a una ventana diferente o utilizando una de las distintas combinaciones de teclas: tecla Esc (todas las plataformas), Control-W (Windows), Comando-W (Mac) o Alt-F4 (Windows).

Activación del modo de pantalla completa en Flash Player

Para activar el modo de pantalla completa en un archivo SWF incorporado en una página HTML, el código HTML para incorporar Flash Player debe incluir una etiqueta param y un atributo embed con el nombre allowFullScreen y el valor true , como en el siguiente código: 

<object> 
    ... 
    <param name="allowFullScreen" value="true" /> 
    <embed ... allowFullScreen="true" /> 
</object>

En la herramienta de edición de Flash, seleccione Archivo -> Configuración de publicación y en el cuadro de diálogo Configuración de publicación, en la ficha HTML, seleccione la plantilla Solo Flash - Permitir pantalla completa.

En Flex, asegúrese de que la plantilla HTML incluya las etiquetas <object> y <embed> que son compatibles con la pantalla completa.

Si se utiliza JavaScript en una página web para generar las etiquetas de incorporación de SWF, se debe modificar JavaScript para añadir el atributo/etiqueta de parámetro allowFullScreen. Por ejemplo, si la página HTML utiliza la función AC_FL_RunContent() (que se usa en páginas HTML generadas en Flash Professional y Flash Builder), se debe añadir el parámetro allowFullScreen a dicha llamada de función, del siguiente modo: 

AC_FL_RunContent( 
    ... 
    'allowFullScreen','true', 
    ... 
    ); //end AC code

Esto no se aplica a los archivos SWF que se ejecutan en el reproductor Flash Player autónomo.

Nota: si el modo de ventana (wmode en HTML) se establece en Opaco sin ventanas (opaco) o Transparente sin ventanas (transparente), la ventana de pantalla completa siempre es opaca.

También existen limitaciones relacionadas con la seguridad al utilizar el modo de pantalla completa de Flash Player en un navegador. Estas limitaciones se describen en el capítulo Seguridad .

Activación del modo de pantalla completa en Flash Player 11.3 y versiones posteriores

Flash Player 11.3 y versiones posteriores admite el modo de pantalla completa, que acepta todas las teclas del teclado (salvo Esc , que sale del modo de pantalla completa). El modo interactivo de pantalla completa resulta útil para jugar (por ejemplo, para permitir juegos con varios jugadores o controles de teclado WASD en jugadores que disparan en primera persona).

Para activar el modo de pantalla completa en un archivo SWF incorporado en una página HTML, el código HTML para incorporar Flash Player debe incluir una etiqueta param y un atributo embed con el nombre allowFullScreenInteractive y el valor true , como el siguiente código: 

<object> 
    ... 
    <param name="allowFullScreenInteractive" value="true" /> 
    <embed ... allowFullScreenInteractive="true" /> 
</object>

En la herramienta de edición de Flash, seleccione Archivo -> Configuración de publicación y en el cuadro de diálogo Configuración de publicación, en la ficha HTML, seleccione la plantilla Solo Flash - Permitir pantalla completa.

En Flash Builder y en Flex, asegúrese de que las plantillas HTML incluyen etiquetas <object> y <embed> que admitan el modo de pantalla completa.

Si se utiliza JavaScript en una página web para generar las etiquetas de incorporación de SWF, se debe modificar el JavaScript para añadir el atributo/etiqueta allowFullScreenInteractive param . Por ejemplo, si la página HTML utiliza la función AC_FL_RunContent() (que se usa en páginas HTML generadas en Flash Professional y Flash Builder), se debe añadir el parámetro allowFullScreenInteractive a dicha llamada de función, del siguiente modo: 

AC_FL_RunContent( 
    ... 
    'allowFullScreenInteractive','true', 
    ... 
    ); //end AC code

Esto no se aplica a los archivos SWF que se ejecutan en el reproductor Flash Player autónomo.

Escala y tamaño del escenario en pantalla completa

Las propiedades Stage.fullScreenHeight y Stage.fullScreenWidth devuelven la altura y la anchura del monitor que se utiliza cuando se pasa al tamaño de pantalla completa, si ese estado se introduce de forma inmediata. Estos valores pueden ser incorrectos si el usuario tiene la oportunidad de mover el navegador de un monitor a otro después de recuperar estos valores pero antes de pasar al modo de pantalla completa. Si se recuperan estos valores en el mismo controlador de eventos en el que se estableció la propiedad Stage.displayState como StageDisplayState.FULL_SCREEN , los valores son correctos. Para usuarios de varios monitores, el contenido de SWF solo se expandirá para llenar un monitor. Flash Player y AIR usan una métrica para determinar el monitor que contiene la mayor parte del archivo SWF y utiliza dicho monitor en el modo de pantalla completa. Las propiedades fullScreenHeight y fullScreenWidth solo reflejan el tamaño del monitor que se utiliza para el modo de pantalla completa. Para obtener más información, consulte Stage.fullScreenHeight y Stage.fullScreenWidth en Referencia de ActionScript 3.0 para la plataforma de Adobe Flash .

El comportamiento de ajuste de escala del escenario en el modo de pantalla completa es el mismo que en el modo normal; el ajuste de escala se controla con la propiedad scaleMode de la clase Stage. Si la propiedad scaleMode se establece en StageScaleMode.NO_SCALE , las propiedades stageWidth y stageHeight de Stage cambian para reflejar el tamaño del área de la pantalla ocupada por el archivo SWF (toda la pantalla en este caso); si se visualiza en el navegador, el parámetro HTML controla la configuración.

Se puede utilizar el evento fullScreen de la clase Stage para detectar cuándo se activa y desactiva el modo de pantalla completa, y para responder ante ello. Por ejemplo, puede ser que se desee volver a colocar, añadir o quitar elementos de la pantalla al activar o desactivar el modo de pantalla completa, como en el ejemplo: 

import flash.events.FullScreenEvent; 
 
function fullScreenRedraw(event:FullScreenEvent):void 
{ 
    if (event.fullScreen) 
    { 
        // Remove input text fields. 
        // Add a button that closes full-screen mode. 
    } 
    else 
    { 
        // Re-add input text fields. 
        // Remove the button that closes full-screen mode. 
    } 
} 
 
mySprite.stage.addEventListener(FullScreenEvent.FULL_SCREEN, fullScreenRedraw);

Tal y como se muestra en este código, el objeto del evento fullScreen es una instancia de la clase flash.events.FullScreenEvent, que incluye una propiedad fullScreen que indica si el modo de pantalla completa está activado ( true ) o no ( false ).

Compatibilidad con el teclado en modo de pantalla completa

Cuando Flash Player se ejecuta en un navegador, todo el código ActionScript relacionado con el teclado, como los eventos de teclado y la introducción de texto en instancias de TextField, se desactiva en modo de pantalla completa. Las excepciones (teclas que permanecen activadas) son:

  • Determinadas teclas que no afectan a la impresión, como las teclas de flecha, la barra espaciadora o el tabulador

  • Métodos abreviados de teclado que cierran el modo de pantalla completa: Esc (Windows y Mac), Control-W (Windows), Comando-W (Mac) y Alt-F4

Estas restricciones no se aplican a contenido de SWF ejecutado en el reproductor autónomo de Flash Player o en AIR. AIR admite un modo interactivo de pantalla completa que permite la entrada del teclado.

Compatibilidad con el ratón en modo de pantalla completa

De forma predeterminada, los eventos de ratón en modo de pantalla completa funcionan del mismo modo que cuando no se está en pantalla completa. Sin embargo, en modo de pantalla completa, si se desea es posible establecer la propiedad Stage.mouseLock para activar el bloqueo del ratón. El bloqueo del ratón desactiva el cursor y permite el movimiento ilimitado del ratón.

Nota: solo es posible activar el bloqueo del ratón en el modo de pantalla completa en las aplicaciones para escritorio. Si se activa cuando no se está en modo de pantalla completa, o en aplicaciones para dispositivos móviles, se emitirá una excepción.

El bloqueo del ratón se desactiva automáticamente y el cursor del ratón se hace de nuevo visible cuando:

  • El usuario sale del modo de pantalla completa mediante el uso de la tecla Escape (todas las plataformas), Control-W (Windows), Comando-W (Mac) o Alt-F4 (Windows).

  • La ventana de la aplicación deja de estar seleccionada.

  • Cualquier interfaz de configuración es visible, incluidos todos los cuadros de diálogo de privacidad.

  • Se visualiza un cuadro de diálogo nativo, por ejemplo, un cuadro de diálogo carga de archivos.

Los eventos asociados al movimiento del ratón, como el evento mouseMove , utilizan la clase MouseEvent para representar al objeto de evento. Si está desactivado el bloqueo del ratón, utilice las propiedades MouseEvent.localX y MouseEvent.localY para determinar la ubicación del ratón. Si está activado el bloqueo del ratón, utilice las propiedades MouseEvent.movementX y MouseEvent.movementY para determinar la ubicación del ratón. Las propiedades movementX y movementY contienen cambios de posición del ratón desde el último evento, no las coordenadas absolutas de la ubicación del ratón.

Escala de hardware en modo de pantalla completa

La propiedad fullScreenSourceRect de la clase Stage se puede utilizar para establecer que Flash Player o AIR escalen una región específica del escenario al modo de pantalla completa. La escala de hardware en Flash Player y AIR, en caso de estar disponible, se activa en la tarjeta gráfica y de vídeo del equipo y suele mostrar el contenido con mayor rapidez que la escala de software.

Para aprovechar la escala de hardware, debe establecer todo el escenario o parte del mismo en modo de pantalla completa. El siguiente código ActionScript 3.0 establece todo el escenario en modo de pantalla completa: 

import flash.geom.*;  
{ 
    stage.fullScreenSourceRect = new Rectangle(0,0,320,240); 
    stage.displayState = StageDisplayState.FULL_SCREEN; 
}

Cuando esta propiedad se establece en un rectángulo válido y la propiedad displayState se define en modo de pantalla completa, Flash Player y AIR aplican escala al área especificada. El tamaño real del escenario expresado en píxeles dentro de ActionScript no cambia. Flash Player y AIR aplican un límite mínimo para el tamaño del rectángulo de modo que se ajuste al mensaje estándar “Press Esc to exit full-screen mode” (Presione Esc para salir del modo de pantalla completa). Este límite suele ser de 260 x 30 píxeles, pero puede variar según la plataforma y la versión de Flash Player.

La propiedad fullScreenSourceRect solo se puede definir cuando Flash Player o AIR no estén en modo de pantalla completa. Para utilizar esta propiedad correctamente, primero debe establecerse y, seguidamente, definir la propiedad displayState en modo de pantalla completa.

Para activar la escala, establezca la propiedad fullScreenSourceRect en un objeto rectangle. 

stage.fullScreenSourceRect = new Rectangle(0,0,320,240);

Para desactivar la escala, establezca la propiedad fullScreenSourceRect en null . 

stage.fullScreenSourceRect = null;

Para aprovechar íntegramente las funciones de aceleración de hardware con Flash Player, actívela mediante el cuadro de diálogo Configuración de Flash Player. Para cargar el cuadro de diálogo, haga clic con el botón derecho del ratón (Windows) o presione Control y haga clic (Mac) dentro del contenido de Flash Player en el navegador. Seleccione la ficha Visualización, que es la primera ficha, y active la casilla de verificación: Activar aceleración de hardware.

Modos de ventana directo y de composición con GPU

Flash Player 10 introduce dos modos de ventana, directo y composición por GPU, que se pueden habilitar desde la configuración de publicación de la herramienta de edición de Flash. Estos modos no se admiten en AIR. Para poder utilizar estos modos, es preciso activar la aceleración de hardware para Flash Player.

El modo directo utiliza la ruta más rápida y directa para introducir gráficos en pantalla, lo que resulta apropiado para la reproducción de vídeo.

La composición con GPU utiliza la unidad de procesamiento de gráficos de la tarjeta de vídeo para acelerar la composición. La composición de vídeo es el proceso de organización en capas de varias imágenes para crear una sola imagen de vídeo. Cuando la composición se acelera con la GPU, es posible mejorar el rendimiento de la conversión YUV, la corrección de color, la rotación o la escala, así como la fusión. La conversión YUV hace referencia a la conversión de color de las señales analógicas del compuesto, que se utilizan para la transmisión, en el modelo de color RGB (rojo, verde, azul) que utilizan las pantallas y las cámaras de vídeo. El uso de la GPU para acelerar la composición reduce la demanda del equipo y la memoria que se aplica a la CPU. También supone una reproducción más suavizada para el vídeo de definición estándar.

Sea cuidadoso al implementar estos modos de ventana. El uso de la composición con GPU puede resultar costoso en términos de recursos de CPU y memoria. Si algunas operaciones (por ejemplo, modos de fusión, recorte o enmascaramiento) no se pueden llevar a cabo en la GPU, se realizan mediante el software. Adobe recomienda la limitación a un archivo SWF por página HTML cuando se utilicen estos modos, que no deben se habilitar para banners. La función Probar película de Flash no utiliza la aceleración de hardware, pero puede emplearla mediante la opción Vista previa de publicación.

La definición de una velocidad de fotogramas en el archivo SWF que sea superior a 60, velocidad máxima de actualización de pantalla, no resulta útil. El establecimiento de la velocidad de fotogramas de 50 a 55 permite fotogramas eliminados, lo cual puede suceder por distintos motivos en algunas ocasiones.

Para poder utilizar el modo directo, es preciso disponer de Microsoft DirectX 9 con VRAM de 128 MB en Windows y OpenGL para Apple Macintosh, Mac OS X v10.2 o versiones posteriores. El modo de composición por GPU requiere compatibilidad con Microsoft DirectX 9 y Pixel Shader 2.0 en Windows con 128 MB de VRAM. En Mac OS X y Linux, la composición por GPU requiere OpenGL 1.5 y diversas extensiones de OpenGL (objeto framebuffer, objetos multitexture y shader, lenguaje de sombreado y sombreados de fragmentos).

Puede activar los modos de aceleración directo y gpu por archivo SWF mediante el cuadro de diálogo de configuración de publicación de Flash, utilizando el menú de aceleración de hardware de la ficha Flash. Si selecciona Ninguno, el modo de ventana vuelve a los valores predeterminado , transparente u opaco , tal y como se especifica en la configuración del modo de ventana en la ficha HTML.