Avec AIR 2.5, il est possible de détecter les boutons BACK, MENU et SEARCH du téléphone.

Pour ce faire, il faut appliquer un écouteur sur l'évènement KEY_DOWN du clavier :

stage.addEventListener( KeyboardEvent.KEY_DOWN, onKeyDown);

private function onKeyDown( pEvt: KeyboardEvent ):void
{
    switch( pEvt.keyCode )
    {
        case Keyboard.BACK:
            // sur la pression du bouton retour
            break;
        case Keyboard.MENU:
            // sur la pression du bouton menu
            break;
        case Keyboard.SEARCH:
            // sur la pression du bouton recherche
            break;
    }
}

Cependant, avec le code précédent, une pression sur un des trois bouton va quitter l'application AIR.

Pour éviter cela, il faut utiliser la méthode preventDefault sur l'évènement du clavier :

case Keyboard.BACK:
    // sur la pression du bouton retour
    pEvt.preventDefault();
    break;

Lire la suite >>

Depuis la disponibilité du Flash Player 10.1 et de AIR 2.0, nous pouvons accéder à l'accéléromètre.

Plusieurs jeux et applications, principalement sur téléphone mobile l'utilise déjà depuis un certain temps.

Voici comment l'utiliser.

La classe Accelerometer se trouve dans le package flash.sensors :

import flash.sensors.Accelerometer;
import flash.events.AccelerometerEvent;

La classe Accelerometer fournie une variable permettant de déterminer si la fonction est prise en charge par l'appareil, ce qui permet, dans le cas contraire, ajouter un controle différent (clavier par exemple).

if (Accelerometer.isSupported)
    trace('Accelerometer supported');
else
    trace('Accelerometer not supported');

Lire la suite >>

Gedit étant mon éditeur préféré, il se devait d'y avoir un fichier de coloration pour AS3 et MXML.

En cherchant un peu, j'ai trouvé les fichiers de coloration pour Flex (comprenant bien évidement AS3 et MXML) ici.

Seul souci, lors du passage à Flex 4, le code compris dans les balises < fx:Script > apparait surligné en rouge :

Pas très joli me direz-vous.

Pour modifier ce petit désagrément, il suffit de rajouter le code suivant :

Lire la suite >>

Lorsque nous développons une application sous Flex, nous avons souvent besoin d'utiliser des icones.
La solution la plus simple évidement est la suivante :
 

< mx:Button label="Delete" icon="@Embed(source='assets/images/delete.png')"/>

Mais lorsque cet icone apparait plein de fois dans l'application, on ne va pas la réimporter à chaque fois, sinon le code va vide devenir lourd, et ça pour rien.
 
La meilleure solution, est de créer une classe qui va ne s'occuper que de ça. Nous allons l'appeler IconLibrary (original non ?)
 

package fr.revolugame.assets  
{
    /**
     * Les icones utilisées dans l'application
     */
    [Bindable]
    public final class IconLibrary
    {
        [Embed(source="assets/images/delete.png")]
        public static const DELETE:Class;
        
        // ...
    }
}

Et lorsque nous voulons l'utiliser dans un mxml :
 

< ![CDATA[
    import fr.revolugame.assets.IconLibrary;
]]>

< mx:Button label="Delete" icon="{IconLibrary.DELETE}"/>
 

Cela permettra d'avoir un code nettement plus propre et probablement moins lourd sur de grosses applications.
 
Si nous voulons encore plus optimiser la chose, il est recommandé de compiler cette librairie dans un swc et de l'importer ensuite dans notre application. Car de ce fait, nous n'aurons pas besoin de recompiler toutes les icones a chaque fois, et pourrons réutiliser cette librairie dans d'autre application.

Lire la suite >>

[Embed(source = 'monImage.png')] private var MonImg:Class;
var pic : Bitmap = new MonImg();

var bmp1 : BitmapData = pic.bitmapData; // récuperation des données
var bmp2 : BitmapData = new BitmapData(18, 16, true); // création de données, avec la taille de l'image finale
var rect : Rectangle = new Rectangle(0, 0, 18, 16); // création de la zone de découpage
var pt : Point = new Point(0, 0); // création du point de fixation de la zone découpée sur la nouvelle image
bmp2.copyPixels(bmp1, rect, pt); // on copie les pixels dans la nouvelle zone
var bmp : Bitmap = new Bitmap(bmp2); // création de notre nouvelle image

Et voilà, nous pouvons maintenant utiliser notre image comme nous le souhaitons, en l'ajoutant à la liste d'affichage par exemple.

Lire la suite >>

Récupération de l'API

Pour pouvoir utiliser l'API dans votre application, il est nécessaire de faire une requete pour recuperer le swc sur le serveur de YouTube. Pour ce faire :

_loader = new Loader();
_loader.contentLoaderInfo.addEventListener(Event.INIT, onLoaderInit);
_loader.load(new URLRequest("http://www.youtube.com/apiplayer?version=3"));

Utilisation de l'API

Une fois que la librairie à été chargéé, nous pouvons la récuperer et ajouter les écouteurs sur les différentes actions :

private function onLoaderInit(event:Event):void {
    addChild(_loader);
    _loader.content.addEventListener("onReady", onPlayerReady);
    _loader.content.addEventListener("onError", onPlayerError);
    _loader.content.addEventListener("onStateChange", onPlayerStateChange);
    _loader.content.addEventListener("onPlaybackQualityChange", onVideoPlaybackQualityChange);
}

Une fois que notre lecteur est prêt, nous pouvons charger et lancer la vidéo :

private function onPlayerReady(event:Event):void {
    // Récupération de l'API youtube.
    _player = _loader.content;
    // On lance notre vidéo à partir de son identifiant
    _player.loadVideoById(VIDEO_ID);
    // On définie la taille de la vidéo
    _player.setSize(480, 270);
}

Lire la suite >>

La classe TextField permet d'ajouter du texte dans une application Flash, zone de texte ou zone de saisie. Mais lorsqu'on souhaite utiliser beaucoup d'occurrence de celle-ci, et des les animer, il se peut que les performances en prennent un gros coup. Pour optimiser tout ceci, il suffit de passer par la classe Bitmap.

La classe Bitmap permet, quand à elle, de représenter des objets d'affichage. Elle va donc nous permettre de transformer nos textes en images. Voici comment faire :

import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.text.TextField;

var monTexte : TextField = new TextField();
monTexte.text = "Hello World";
monTexte.autosize = flash.text.TextFieldAutoSize.LEFT;

var bmp : BitmapData = new BitmapData(monTexte.width, monTexte.height);
bmp.draw(monTexte);

var bitmap : Bitmap = new Bitmap(bmp);
addChild(bitmap);

Une petite optimisation qui peut vraiment être utile lors du développement de grosses applications utilisant beaucoup de zone de texte.

Lire la suite >>

La partie graphique

Pour commencer, notre classe a besoin de plusieurs paramètres, tel
que son parent, sa couleur, ou encore son contenu.

Voici la signature de notre classe :

public function PopUp(_parent:Stage, _color:uint, content:MovieClip):void

Dans le constructeur, nous instancions les différentes parties de notre fenêtre, puis nous dessinons le cadre et l'entête.

Lire la suite >>

import flash.ui.Mouse;
import flash.ui.MouseCursor;

Mouse.cursor = MouseCursor.HAND;

Lire la suite >>

Dans ce tutoriel, nous allons voir comment créer une classe réutilisable pour faire une scrollbar horizontale. Elle permettra de déplacer un contenu dynamique (texte, image, ...).

Aspect visuel : la classe graphics

private function draw():void {
    var bg : Shape = new Shape();
    bg.graphics.beginFill(_bgColor);
    bg.graphics.lineStyle(0x000000);
    bg.graphics.drawRect(0, 0, _largeur, _hauteur);
    bg.graphics.endFill();
    addChild(bg);
} 

private function drawScroller():void {
    // petite vérification, pour ne pas dessiner de scroller s'il n'y en a pas besoin               
    if (_scrollContent.height > _hauteur) {
        var coeff : Number = _scrollContent.height / _hauteur;
        var tmp_scroll_height : Number = _hauteur / coeff; // pour verif que le scroller n'est pas trop petit
        if (tmp_scroll_height < 20) tmp_scroll_height = 20;
               
        _scroller = new Sprite();
        _scroller.graphics.beginFill(0x000000);
        // on dessine notre rectangle avec un petit décalage
        _scroller.graphics.drawRect(2, 2, _largeur - 4, tmp_scroll_height);
        _scroller.graphics.endFill();
               
        _scroller.addEventListener(MouseEvent.MOUSE_DOWN, dragOn);
        _scrollContent.parent.stage.addEventListener(MouseEvent.MOUSE_UP, dragOff);
               
        addChild(_scroller);
        _scroller.buttonMode = true;
               
        // rectangle qui correspond à la trajectoire du scroller
        rect_scroller = new Rectangle(0, 0, 0, _hauteur - _scroller.height - 4);
    }
} 

Lire la suite >>

Voici quelques bonnes pratiques nécessaire à adopter lors de développement d'application en ActionScript3.

Tout d'abord, il est nécessaire de toujours typer ses variables afin d'optimiser les performances et garantir une meilleure gestion des erreurs à la compilation et  à l'exécution. Par exemple, préférer

var i : int = 0; 

à

var i = 0;

Par contre, si une variable peut contenir n'importe quel type de données, nous pouvons utilisez le type *.

Lorsque vous utilisez une boucle, il est préférable de passer par une variable de référence, pour éviter que la machine virtuelle ne réévalue la longueur à chaque itération. Exemple :

Lire la suite >>

var a : Array< Float > = new Array();

a = a.concat([0.3086, 0.6094, 0.0820, 0.0, 0.0]); // rouge
a = a.concat([0.3086, 0.6094, 0.0820, 0.0, 0.0]); // vert
a = a.concat([0.3086, 0.6094, 0.0820, 0.0, 0.0]); // bleu
a = a.concat([0.0, 0.0, 0.0, 1.0, 0.0]); // alpha

var filtre : ColorMatrixFilter= new ColorMatrixFilter(a);
monClip.filters = [filtre];

Lire la suite >>

addEventListener(MouseEvent.CLICK, maFonction);

private maFonction(e:MouseEvent):void {
    ... 
}

addEventListener(MouseEvent.CLICK, function(e:*):void { maFonction(e, maVar) });

private maFonction(e:MouseEvent, maVar:String):void {
    trace(maVar);
}

Lire la suite >>

// récupération de la couleur de départ de l'objet
var myColor:ColorTransform = myObject.transform.colorTransform;
// on lui affecte maintenant la couleur qu'on souhaite
myColor.color = 0x000000; // la valeur hexa de ma couleur
// puis on l'applique à notre objet
myObject.transform.colorTransform = myColor;

myColor : ColorTransform = new ColorTransform(0,0,0,1,redValue,greenValue,blueValue,0);
myObject.transform.colorTransform = myColor;

Lire la suite >>

/**
 * Création d'un rectangle contenant un dégradé
 */
var degrade : Shape = new Shape();
// Bordures du rectangle
degrade.graphics.lineStyle(2, 0x0043AB);
			
// Matrice de transformation du dégradé
var matrice:Matrix = new Matrix();
matrice.createGradientBox(250, 50); // largeur et hauteur du dégradé
	
degrade.graphics.beginGradientFill(GradientType.LINEAR, [0xA7C04A, 0xAD7FA8], [1, 1], [0, 255], matrice);
degrade.graphics.drawRect(0, 0, 250, 50);
		
degrade.graphics.endFill();
		
addChild(degrade);

• le type de dégradé (LINEAR ou RADIAL)
• le tableau des couleurs
• le tableau des opacités de chaque couleur
• le tableau de positionnement des couleurs
• la matrice de transformation de type flash.geom.Matrix (optionnelle)

Lire la suite >>

import flash.display.Loader;
import flash.net.URLRequest;
import flash.events.Event;
import flash.system.ApplicationDomain;

var loader : Loader = new Loader();
var request : URLRequest = new URLRequest("lib.swf"); // chemin

// création de l'ecouteur de fin de chargement
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onComplete);

// chargement de la lib
loader.load(request);

private function onComplete(event:Event):void {
	// 1ere solution
	var maRessource : Class = loader.contentLoaderInfo.applicationDomain.getDefinition("maRessource") as Class;
	var monClip = new maRessource();
	
	// 2eme solution
	ApplicationDomain.currentDomain.getDefinition("maRessource");
	var monClip : maRessource = maRessource(event.target.content);
}

Lire la suite >>

La structure de notre application

• VideoPlayer.mxml
• stylePlayer.css

< ?xml version="1.0" encoding="utf-8"?>
< mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" width="512" height="408" layout="absolute" >
   
    < mx:VideoDisplay id="video" width="512" height="384" autoPlay="false" source="mavideo.ext"
        playheadUpdate="updatePlayer()" />

Lire la suite >>

Commencons par le code

var root : MovieClip = flash.Lib.current; 
root.stop();
root.loaderInfo.addEventListener (ProgressEvent.PROGRESS, function(event:ProgressEvent)
{
    var pcent:Float=event.bytesLoaded/event.bytesTotal*100;
    trace("Chargement : "+pcent+"%");
    if(pcent==100) root.gotoAndStop(2)
}
);

Quelques explications :

Lire la suite >>

Vous souhaitez enlever, voir personnaliser le menu qui apparait par defaut lors d'un clic droit ?

Alors voilà comment il faut faire. C'est relativement simple, mais fort utile.

Tout d'abord, voici comment l'enlever :

var menu = new flash.ui.ContextMenu();
menu.hideBuiltInItems();
flash.Lib.current.contextMenu = menu;

Et maintenant, pour ajouter un nouvel élément :

var nouvelItem = new flash.ui.ContextMenuItem("Texte a afficher", true, true, true);
// on ajoute une action sur le bouton

nouvelItem.addEventListener(flash.events.ContextMenuEvent.MENU_ITEM_SELECT, function(e){
    flash.Lib.getURL(new flash.net.URLRequest("http://revolugame.com"), "_self");
}
menu.customItems.push(nouvelItem);

Lire la suite >>