Face à la déferlante vidéo sur le web, Adobe a intégré au player 9 une fonctionnalité de plein écran. Elle permet à une animation Flash de quitter son étroite fenêtre de navigateur pour passer en fullscreen complet : aucune bordure de fenêtre de navigateur, aucun menu, aucun bouton ne subsistent ; et aucun rechargement de la page html n’est nécessaire. Au-delà de la vidéo, cette fonctionnalité permet à tout type d’animations (jeux, démos, e-learning…) de plonger l’utilisateur en immersion totale.

Pour en bénéficier, l’internaute doit disposer de la version 9,0,28,0 du player (ou supérieure). Pour des raisons de sécurité, certaines limitations sont imposées en mode fullscreen (par exemple : la saisie des champs textes est interdite tant que l’animation reste en fullscreen). Par ailleurs, le mode fullscreen ne peut être activé que sur clic (onPress ou onRelease). Pas question, donc, de tenter de piéger l’internaute en plein écran dès son arrivée sur la page. D’ailleurs, le player Flash affiche en superposition, dès le passage en plein écran, une instruction pour le retour au mode normal (qui disparaît après quelques instants) : « Appuyez sur la touche Echap pour quitter le mode plein écran. »

Côté développeur, que faut-il savoir ?

Dans Flash, il est préférable d’ajouter une nouvelle propriété à la classe Actionscript « Stage » afin d’éviter les erreurs Actionscript à la compilation. Pour cela, il suffit d’ouvrir le fichier :

C:\Program Files\Macromedia\Flash 8\fr\First Run\Classes\FP8\Stage.as

et d’y ajouter une ligne juste devant les autres propriétés :

static var displayState:String;

Dans le code Actionscript, le mode plein écran sera activé par :

Stage["displayState"] = "fullScreen";

et désactivé par :

Stage["displayState"] = "normal";

Adobe conseille d’utiliser la syntaxe :

Stage["displayState"] = "fullScreen";

plutôt que celle de :

Stage.displayState = "fullScreen";

Au final, un nouveau paramètre doit être intégré à la page html contenant le Flash. Il s’agit de allowFullScreen, qui doit prendre la valeur true pour autoriser le passage en plein écran. Pour une intégration avec la méthode standard, cela donne une balise <param name="allowFullScreen" value="true" /> dans la balise object, et un paramètre allowFullScreen="true" dans la balise embed. Pour une intégration avec la méthode Swfobject, cela se concrétise par la ligne :

so.addParam("allowFullScreen", "true");

Il est intéressant de noter que, d’après mes tests, le paramètre allowFullScreen semble incompatible avec wmode (quelle que soit sa valeur). Supprimez donc le paramètre wmode pour autoriser le plein écran. Il est de toute façon logique de rester en wmode standard si l’animation est destinée à passer en plein écran (sans le fond de page html, donc).

La logique de redimensionnement en plein écran reste identique à celle du Flash dans la page (définie par le paramètre scaleMode).

Quelques liens :

Une archive à télécharger, contenant un fla et quelques bouts d’Actionscript, permettant de passer en plein écran par un bouton, ou par le biais du menu contextuel du player Flash. Le champ de texte éditable placé sur la scène vous permettra de vérifier le blocage en fullscreen.

http://iis-lyon.sqli.com/agency/ecreativegarden/fullscreen_flash/fullscreen_flash.zip

Tout les détails par Adobe :

http://www.adobe.com/devnet/flashplayer/articles/full_screen_mode.html

Une page de démos d’animations avec un passage en fullscreen :

http://labs.adobe.com/wiki/index.php/Flash_Player:9:Update:Full-Screen_Mode:Demos

avec notamment le très impressionnant tunnel tridimensionnel :

http://www.mrdoob.com/lab/PV3D/panorama_anim.html

Cette entrée a été publiée le Mercredi 31 janvier 2007 à 10 h 25 min, et rangée dans Richmédia. Vous pouvez suivre les réponses à cette entrée via son flux RSS 2.0. Vous pouvez laisser un commentaire, ou faire un rétrolien depuis votre site.