Creación de vídeo a pantalla completa con Flash

Una de las ventajas de trabajar con la tecnología Flash Vídeo es que puedes colocar un botón en tu página web para que el vídeo se visualice a pantalla completa ocultando el navegador o cualquier otro elemento del escritorio. En realidad lo que ocupa la pantalla completa es el fichero SWF por lo que si quieres colocar cualquier otro contenido, que no sea necesariamente vídeo, también lo puedes hacer. Lo único que hay que tener en cuenta son los siguientes comportaminetos.

  1. La instrucción para reproducir la película a pantalla completa en el navegador debe colocarse como un evento de botón. Por restricciones de seguridad no se permite ejecutarla directamente en una línea de tiempo para que de esta forma sea el usuario el que decida o no pasar a pantalla completa
  2. Los eventos de teclado (los recogidos por la clase key de Action Script dejan de funcionar salvo para la tecla escape.

La instrucción que habría que asignarle a un botón para que alterne entre el modo de pantalla completa y el modo normal en Action Script 2.0, sería el siguiente.

on(release){

Stage.displayState= Stage.displayState==”normal”? “fullscreen”: “normal”;}

Como podéis ver no es nada complicado. También habría que añadir el parámetro “Full Screen” a las etiquetas “object” y “embed” de la página web que incluye el fichero SWF como se muestra en el ejemplo.

param name=”allowFullScreen” value=”true” /> … <embed src=”example.swf” allowFullScreen=”true” … >

21 Respuestas a “Creación de vídeo a pantalla completa con Flash”


  1. 1 Pablo 27 Enero, 2008 a las 10:39 pm

    Hola, bueno he provado con el codigo que me decis, primero un boton y despues con F9, inserto el codigo que facilitais y no funciona. El video que intento ampliar a toda pantalla es un FLV. No se por que pero no funciona. Si me pudierais ayudar ……… Gracias

  2. 2 uklanor 27 Enero, 2008 a las 11:10 pm

    Recuerda que también hay que habilitar el parámetro “allowfullscreen” de java Script de la página HTML donde se inserte el SWF. Esto se consigue o bien editando a mano el código de la etiquetea “object” o “embed” correspondiente o bien utilizando Dreamweaver para crear la página web donde se inserte el fichero SWF y activando los párametros directamente en panel de propiedades de Dreamweaver con la película flash seleccionada en la página que se esté diseñando.

  3. 3 Pablo 28 Enero, 2008 a las 11:16 am

    Gracias por la respuesta. El problema es que no quiero utilizar Dreamweaver y no se editar desde flash las etiquetas “object” o “embed”. Si pudieras explicarme como …… Gracias anticipadas. Ponme un ejemplo, si no es mucho pedir.

    Te explico, solo utilizo un arcchivo HTML, para cargar la pelicula principal. Una vez en ella, llamo a diferentes peliculas flash, que no van incluidad en ningun archivo .HTML. Quizas ese sea el problema.

  4. 4 uklanor 28 Enero, 2008 a las 11:28 am

    Efectivamente, ese es problema.

    Sin HTML no hay pantalla completa ya que es un comando de Java Script el que lo provoca.

    Las etiquetas “embed” y/o “object” no se editan en Flash sino en un editor HTML.

    En breve procuraré colgar un ejemplo.

  5. 5 Pablo 28 Enero, 2008 a las 11:52 am

    Muchas gracias poe el interes que has demostrado por responderme tan pronto. ¿ Crees que si añado las etiquetas “embed” y “objet” en el index Html de carga, afectara al resto de la Web y podre utilizarlo solo en los videos que estan colgados ?. Espero no abusar.
    Gracias po anticipado Uklanor.

    Pablo

  6. 6 uklanor 28 Enero, 2008 a las 3:47 pm

    Esas etiquetas son las que se necesitan para insertar un objeto Flash en una página web. Si quieres ver cual es la sintaxis correcta publica un fichero HTML desde el propio Flash y copia y pega el código. Luego solamente habrá que añadir el parametro allowfullscreen tal y como se comenta en el artículo. Esta etiqueta no afecta al resto de la página web.

  7. 7 Pablo 28 Enero, 2008 a las 8:48 pm

    Vale ya lo tengo. Funciona perfectamente. Muchas gracias tio, me has hecho un favor. Esto mejorarara, notablemente el proyecto que estoy realizando en estos momentos.

    Atentamente:

    Pablo Sánchez.

  8. 8 emguepo 13 Marzo, 2008 a las 5:14 pm

    Mi pregunta es la siguiente, Yo quiero que en el menu del vídeo aparezca un botón que me permita agrandar y minimizar el vídeo, así como en youtube.

    Explico mejor:

    El problema es que no está en ninguna web, sino en un proyecto multimedia que estoy trabajando, el cual el principal es un .exe que es donde están los botones y cada botón llama a un SWF.

    entonces un botón es el de “vídeos”, este llama al swf que contiene dos vídeos con los menús prediseñados de Flash CS3, lo que quiero es que en el menú, esté el botón de ampliar y reducir (como Youtube), para que cuando vean los vídeos, los vean bien.

    Gracias, espero me hallas entendido

  9. 9 uklanor 15 Marzo, 2008 a las 11:47 pm

    Todo lo explicado en el artículo se refiere a una versión del fichero SWF sobre página web y no es aplicable a un proyector .exe creado con Flash. En ese caso deberías utilizar el FSCommand “fullscreen” disponible para proyectores autoejecutables. Refiérete al manual de tu Flash CS3 para conocer los detalles de utilización de es FSCommand

  10. 10 nelson 22 Abril, 2008 a las 3:57 am

    hola podrias poner un ejemplo para que sea mas facil gracias

  11. 11 luis disidente 4 Mayo, 2008 a las 1:33 am

    Qué tal, gracias por el tutorial.
    una duda:
    el script que debo poner en mi HTML “param name=”allowFullScreen” value=”true” /> … “, en la parte que dice ”example.swf” se refiere a mi SWF?

    Si deseo cargar videos diferentes “FLV” en el mismo HTML, ¿Cual es el script que debo poner en mi HTML?

    Gracias, espero haberme explicado.

  12. 12 luis disidente 4 Mayo, 2008 a las 1:52 am

    Estoy probando el botón con el script:
    on(release){

    Stage.displayState= Stage.displayState==”normal”? “fullscreen”: “normal”;}

    Aparece un error de sintaxis, según Flash.

  13. 13 uklanor 5 Mayo, 2008 a las 6:49 pm

    Hay que incluir los parámetros “allowFullScreen” en cada etiqueta “object” o “embed” de los SWF que hayas insertado en tu fichero HTML sean estos 1 o n. Efectivamente “example.swf” se refiere al nombre que tenga tu fichero SWF.

    En cuanto a la sintaxis del script, el error se debe a las comillas. Deben utilizarse comillas recta como en el siguiente ejemplo. En tu script tienes otro tipo de comillas.

    on(release){
    Stage.displayState= Stage.displayState==”normal”? “fullscreen”: “normal”;}

  14. 14 Pablo 18 Mayo, 2008 a las 2:34 am

    Me ha servido de mucho. De echo el proyecto ha mejorado notablemente, gracias al modo de pantalla completa. Te estoy agradecido uklanor. Muchas gracias por todo

  15. 15 Antonio García 10 Junio, 2008 a las 9:14 pm

    Hola buenas… Estoy viendo que varios de los que aquí escriben se están intentando enbarcar en ciertos dilemas sin conocer aspectos mínimos de Flash…

    Siendo así, me atrevo a comentaros que participo como docente en un proyecto de formación al que os invito a consultar… ya que los resultados de profesionales lanzados en el mercado laboral han sido abundantes.

    Sí, esto podría se un poco de Spam, o publicidad… per una publicidad recomendada donde los principales beneficiades serán los que se aprovechen de ello. En cualquier caso, entrad y suscribiros al boletín que lanzamos mensualmente.

    Mi empresa es Aunamedia (www.aunamedia.es) pero el centro de formación es Método Profesional (www.metodoprofesional.com) especializada en formación en flash, y donde están publicados alumnos ya profesionales a los que poder consultar la experiencia en los cursos.

    Repito: no he entrado para hacer publicidad, sólo estaba consultando temas de la pantalla completa.

    Sin más, y por no dejarme e irme en vano, anoto un apunte que os puede confundir…

    Es sobre el Object y el Embed… Tened en cuenta que ya hace unos 3 años se implantó un nuevo sistema que solucionaba ciertos aspectos de problemas de licencia con los ActiveX y otros plugins en Internet Explorel. Soluciones que adoptó adobe y se refleja en la exportación por defecto de los HTML (F12 en flash).

    Eso nos lleva a que tenemos que pasar del Object y Embed, y poner los parámetros como los tienen puesto en lo que veamos (impar: variable, par:valor). Y sólo una vez.

    El Embed y Object queda ya para los navegadores que no tienen activado el JavaScript.

    Saludos y suerte en vuestra trajectoria.

  16. 16 Juan 18 Junio, 2008 a las 11:53 pm

    Hola, lo que yo quiero hacer es que despues de apretar el boton y que cambie a pantalla completa, vaya y cargue otra movie, como lo hace el sitio de Ironman: http://ironmanmovie.marvel.com/ lo que yo puse en el boton es:

    on (release) {
    Stage.displayState = “fullscreen”;
    this.loadMovie(”main_site.swf”);
    }

    Al apretar el boton, se hace fullscreen, pero no carga el swf. Ya en fullscreen, vuelves a apretar el boton y ya lo carga. Intenté tambien hacer la carga en otro frame y despues del fullscreen llamar con goandplay al otro frame.. mismo resultado. Hay que dar dos clicks.

    Sé que se puede hacer porque lo hace el sitio de Ironman al darle “Enter Fullscreen”.. como puedo lograr eso?

    Gracias y saludos!

  17. 17 uklanor 25 Junio, 2008 a las 3:29 pm

    Hay varias formas de poder realizar lo que dices.
    Quizá una de las más sencillas sería poner la orden de “fullscreen” bajo un evento del tipo “onPress” en lugar de “onRelease” y añadir la orden de carga en el “onRelease”.

    En Action Script 3 sería la misma idea pero añadiendo los eventos correpondientes a los Event Listeners

  18. 18 Nicola 27 Junio, 2008 a las 3:36 pm

    hola, he hecho el efecto de fullscreen pero tengo un porblema y quisiera que me ayuden porfa, puse el codigo y me funciona correctamenmte, osea si me sale el fullscreen pero cuando apretos scape para volver al stado normal mi pelicula se vuelve negra y no se ve nada

    gracias

  19. 19 Nicola 27 Junio, 2008 a las 4:04 pm

    hola otra vez…… saben me funciona correctamente en todos los navegadores de PC, pero en todos los navegadores de MAC no me funciona…… si me fnciona el fullscreen pero cuando apreto scape se pone todo negro

    porque sera?

  20. 20 mica 11 Julio, 2008 a las 3:02 pm

    El problema que encuentro con esto, es que yo quiero hacer el mismo efecto que un youtube, tengo varios elementos en el escenario y quiero agrandar la pantalla a fullscreen y llevar el video al 100% de la pantalla, lo logre trabajando con el alto y ancho del video, hasta ahi todo ok! el problema es la restauración, desde un botón logro llevar todo al tamaño inicial, pero desde el botón escape, no tengo el mismo efecto, obviamente me restaura la pantalla pero NO el video. Alguien tiene alguna idea de como hacer, exactametne lo mismo que hace un youtube, tener varios elementos y agrandar solo el video y volver a restaurarlo desde un boton como desde la tecla escape.

    Gracias!!
    MICA

  21. 21 carlos 12 Julio, 2008 a las 6:09 pm

    como hago para ampliar un video en la pantalla completa

Escribe un comentario




Estoy empleado en Adobe pero las opiniones y afirmaciones vertidas en este blog son totalmente personales y no reflejan necesariamente la postura de la compañía

 

Enero 2008
L M X J V S D
« Dic   Feb »
 123456
78910111213
14151617181920
21222324252627
28293031  

Flickr Photos

WaterRocket_17

WaterRocket_16

WaterRocket_15

More Photos