ActionScript 3.0: simple picture gallery made with Tweener
I was asked to do a simple setup for a picture gallery, that would show 5 different pictures.
and in only a couple of hours this gallery was made.
nothing fancy about it, and the only “flashy part” is the Show more pictures-bar… (the Se flere billeder-bar).
check out the simple ActionScript 3.0 and Tweener gallery here
the code for the Flash can be seen here:
var isOpen:Boolean = false;
var isShowed:Boolean = false;
var fadeNumber:Number = 0.7;
var _pictureHolder:MovieClip = new PictureHolder();
_pictureHolder.stop();
addChild(_pictureHolder);
var _redSlider:MovieClip = new RedSlider();
_redSlider.redbar.buttonMode = true;
_redSlider.thumb1.buttonMode = true;
_redSlider.thumb2.buttonMode = true;
_redSlider.thumb3.buttonMode = true;
_redSlider.thumb4.buttonMode = true;
_redSlider.thumb5.buttonMode = true;
_redSlider.tilbageTilOversigten.buttonMode = true;
_redSlider.thumb1.addEventListener(MouseEvent.CLICK, showProperPicture);
_redSlider.thumb2.addEventListener(MouseEvent.CLICK, showProperPicture);
_redSlider.thumb3.addEventListener(MouseEvent.CLICK, showProperPicture);
_redSlider.thumb4.addEventListener(MouseEvent.CLICK, showProperPicture);
_redSlider.thumb5.addEventListener(MouseEvent.CLICK, showProperPicture);
_redSlider.redbar.addEventListener(MouseEvent.CLICK, openCloseMenu);
_redSlider.tilbageTilOversigten.addEventListener(MouseEvent.CLICK, navigateToHome);
_redSlider.thumb1.mouseChildren = false;
_redSlider.thumb2.mouseChildren = false;
_redSlider.thumb3.mouseChildren = false;
_redSlider.thumb4.mouseChildren = false;
_redSlider.thumb5.mouseChildren = false;
_redSlider.mouseChildren = true;
activateBlack();
_redSlider.thumb1.black.alpha = 0;
addChild(_redSlider);
_redSlider.x = 702;
var _morePictures:MorePictures = new MorePictures();
_morePictures.addEventListener(MouseEvent.CLICK, openCloseMenu);
_morePictures.buttonMode = true;
addChild(_morePictures);
_morePictures.x = 722;
var _photographers:MovieClip = new Photographers();
_photographers.x = -180;
_photographers.y = 352;
addChild(_photographers);
function openCloseMenu(e:Event):void {
trace("function openCloseMenu");
if(isOpen){
isOpen = false;
Tweener.addTween(_redSlider, {x:702, transition:"EaseOutSine", time:0.8});
Tweener.addTween(_morePictures, {x:722, transition:"EaseOutSine", time:0.8});
} else {
isOpen = true;
Tweener.addTween(_redSlider, {x:637, transition:"EaseOutSine", time:0.8});
Tweener.addTween(_morePictures, {x:737, transition:"EaseOutSine", time:0.8});
}
}
function showProperPicture(e:Event):void {
var eClicked:String = e.target.name;
eClicked = eClicked.slice(-1);
_pictureHolder.gotoAndStop(Number(eClicked));
activateBlack();
e.target.black.alpha = 0;
}
function navigateToHome(e:Event):void {
if(isShowed){
Tweener.addTween(_photographers, {x:-180, transition:"EaseOutSine", time:0.8});
isShowed = false;
} else {
Tweener.addTween(_photographers, {x:4, transition:"EaseOutSine", time:0.8});
isShowed = true;
}
}
function activateBlack():void {
_redSlider.thumb1.black.alpha = fadeNumber;
_redSlider.thumb2.black.alpha = fadeNumber;
_redSlider.thumb3.black.alpha = fadeNumber;
_redSlider.thumb4.black.alpha = fadeNumber;
_redSlider.thumb5.black.alpha = fadeNumber;
}
var isShowed:Boolean = false;
var fadeNumber:Number = 0.7;
var _pictureHolder:MovieClip = new PictureHolder();
_pictureHolder.stop();
addChild(_pictureHolder);
var _redSlider:MovieClip = new RedSlider();
_redSlider.redbar.buttonMode = true;
_redSlider.thumb1.buttonMode = true;
_redSlider.thumb2.buttonMode = true;
_redSlider.thumb3.buttonMode = true;
_redSlider.thumb4.buttonMode = true;
_redSlider.thumb5.buttonMode = true;
_redSlider.tilbageTilOversigten.buttonMode = true;
_redSlider.thumb1.addEventListener(MouseEvent.CLICK, showProperPicture);
_redSlider.thumb2.addEventListener(MouseEvent.CLICK, showProperPicture);
_redSlider.thumb3.addEventListener(MouseEvent.CLICK, showProperPicture);
_redSlider.thumb4.addEventListener(MouseEvent.CLICK, showProperPicture);
_redSlider.thumb5.addEventListener(MouseEvent.CLICK, showProperPicture);
_redSlider.redbar.addEventListener(MouseEvent.CLICK, openCloseMenu);
_redSlider.tilbageTilOversigten.addEventListener(MouseEvent.CLICK, navigateToHome);
_redSlider.thumb1.mouseChildren = false;
_redSlider.thumb2.mouseChildren = false;
_redSlider.thumb3.mouseChildren = false;
_redSlider.thumb4.mouseChildren = false;
_redSlider.thumb5.mouseChildren = false;
_redSlider.mouseChildren = true;
activateBlack();
_redSlider.thumb1.black.alpha = 0;
addChild(_redSlider);
_redSlider.x = 702;
var _morePictures:MorePictures = new MorePictures();
_morePictures.addEventListener(MouseEvent.CLICK, openCloseMenu);
_morePictures.buttonMode = true;
addChild(_morePictures);
_morePictures.x = 722;
var _photographers:MovieClip = new Photographers();
_photographers.x = -180;
_photographers.y = 352;
addChild(_photographers);
function openCloseMenu(e:Event):void {
trace("function openCloseMenu");
if(isOpen){
isOpen = false;
Tweener.addTween(_redSlider, {x:702, transition:"EaseOutSine", time:0.8});
Tweener.addTween(_morePictures, {x:722, transition:"EaseOutSine", time:0.8});
} else {
isOpen = true;
Tweener.addTween(_redSlider, {x:637, transition:"EaseOutSine", time:0.8});
Tweener.addTween(_morePictures, {x:737, transition:"EaseOutSine", time:0.8});
}
}
function showProperPicture(e:Event):void {
var eClicked:String = e.target.name;
eClicked = eClicked.slice(-1);
_pictureHolder.gotoAndStop(Number(eClicked));
activateBlack();
e.target.black.alpha = 0;
}
function navigateToHome(e:Event):void {
if(isShowed){
Tweener.addTween(_photographers, {x:-180, transition:"EaseOutSine", time:0.8});
isShowed = false;
} else {
Tweener.addTween(_photographers, {x:4, transition:"EaseOutSine", time:0.8});
isShowed = true;
}
}
function activateBlack():void {
_redSlider.thumb1.black.alpha = fadeNumber;
_redSlider.thumb2.black.alpha = fadeNumber;
_redSlider.thumb3.black.alpha = fadeNumber;
_redSlider.thumb4.black.alpha = fadeNumber;
_redSlider.thumb5.black.alpha = fadeNumber;
}
—–
the photos are found at www.sxc.hu and are taken by:
CB, Venezuela
Mark Forman, USA
Jonathan Coussens, USA
Nick Bobby, Bulgaria
Gert-Jan Kappert, The Netherlands
nice photos, guys! :O)