Bonjour à tous, voilà j'ai décidé de vous faire un petit tutoriel sur les zooms de bitmap, nous allons donc coder ceci en as3.
Notre application chargera l'image externe dynamiquement et nous utiliserons la classe TweenMax pour ce qui concerne le zoom et le dezoom.
Nous allons aussi créer une petite interface pour que tout ça, soit un peu plus sympa...
Voici à quoi nous arriverons à la fin de ce tutoriel:
voici la source:
ICI
Le code:
Et le tutoriel:
Notre application chargera l'image externe dynamiquement et nous utiliserons la classe TweenMax pour ce qui concerne le zoom et le dezoom.
Nous allons aussi créer une petite interface pour que tout ça, soit un peu plus sympa...
Voici à quoi nous arriverons à la fin de ce tutoriel:
voici la source:
ICI
Le code:
- Code:
//_______________________________________○○○--imports
import gs.TweenMax;
import gs.easing.*;
//_________________________________________○○○--Variable instanciés
var taille:String = "1";
var loader:Loader = new Loader();
var url:URLRequest = new URLRequest("image.jpg");
var image:MovieClip = new MovieClip();
var centreX:Number=-50;
var centreY:Number=-50;
loader.load(url);
addChild(image);
image.addChild(loader);
var imgX:int=(stage.stageWidth-image.width)/2
var imgY:int=(stage.stageHeight-image.height)/2
trace(imgX);
image.y=100;
image.x=100;
image.mask=maskk;
//---------------------------------------------○○○--Drag
image.addEventListener("mouseDown",dragg);
function dragg(e:Event):void{
image.startDrag(false);
}
stage.addEventListener("mouseUp",noDragg);
function noDragg(e:Event):void{
image.stopDrag();
}
//___________________________________________________○○○--Zoom
zoomP.addEventListener("mouseDown", zoom);
function zoom(e:MouseEvent):void{
TweenMax.to(image,1,{x:(image.x-contour.x)/2, y:(image.y-contour.y)/2,ease:Sine.easeIn});
TweenMax.to(image,1,{scaleX:taille, ease:Sine.easeOut});
TweenMax.to(image,1,{scaleY:taille, ease:Sine.easeOut});
}
zoomM.addEventListener("mouseDown", dezoom);
function dezoom(e:MouseEvent):void{
TweenMax.to(image,1,{scaleX:1, ease:Sine.easeOut});
TweenMax.to(image,1,{scaleY:1, ease:Sine.easeOut});
TweenMax.to(image,1,{x:100, y:100, ease:Sine.easeIn});
}
//_______________________________________________________○○○--Roll
addEventListener("mouseOver",over);
function over(e:MouseEvent):void{
if(e.target.name == "zoomP" || e.target.name == "zoomM")
e.target.gotoAndPlay("over");
}
addEventListener("mouseOut",out);
function out(e:MouseEvent):void{
if(e.target.name == "zoomP" || e.target.name == "zoomM")
e.target.gotoAndPlay("out");
}
Et le tutoriel:
Dernière édition par artkabis le Lun 30 Mar - 20:43, édité 1 fois