Home Tutorials Forums Articles Blogs Movies Library Employment Press

Go Back   ActionScript.org Forums > Decommissioned > Projects and Positions

Reply
 
Thread Tools Rate Thread Display Modes
Old 04-21-2012, 10:28 PM   #1
Applauz
Senior Member
 
Join Date: May 2009
Posts: 250
Default Help with this AddChild / RemoveChild solution $$$

I'm tired of trying to figure this one out. I'll give a donation to whomever can help me come up with a working solution.

Basically .. I have 29 movieclips. Almost like magazine pages.

Each MovieClip has 2 buttons on them.. left and right.

When you tap that button .. the page slides to the next page.

I have a solution working .. but I am creating a movie clip and then adding all 29 pages in a long strip. Everytime you hit next or back .. the entire strip is tweening 1024 or -1024 pixels.. depending if you hit Next or Back.



What I want to do .. is have a solution that only uses the movie clips that are needed. So I would addChild 3 at a time.... the one visible to the stage.. the one thats offstage to the left and the one thats offstage to the right.

When the tween happens... it would have to adjust accordingly by removing unneeded clips .. setting them to null.


Can someone give me a hand with this one ?
Applauz is offline   Reply With Quote
Old 04-21-2012, 10:56 PM   #2
henke37
Senior Member
 
henke37's Avatar
 
Join Date: Mar 2009
Location: Sweden
Posts: 10,675
Send a message via Skype™ to henke37
Default

Exactly what do you need from us?
__________________
Signature: I wrote a pair of articles about the timeline.
henke37 is offline   Reply With Quote
Old 04-21-2012, 11:06 PM   #3
Applauz
Senior Member
 
Join Date: May 2009
Posts: 250
Default

I want someone to write the solution .. lol

I'll gladly donate to charity or a developers pocket
Applauz is offline   Reply With Quote
Old 04-21-2012, 11:15 PM   #4
Applauz
Senior Member
 
Join Date: May 2009
Posts: 250
Default

The key with this is that I need it to take into account the Memory on Mobile. So it's gotta be lightweight. Kill whats not needed from memory.
Applauz is offline   Reply With Quote
Old 04-21-2012, 10:58 PM   #5
Luken
Registered User
 
Join Date: Mar 2012
Posts: 41
Default

All you want is to have an array/vector of pages (objects), and listener for clicking, that would create/destroy objects in array and changing that one that is showing? It seems like you just didn't know from where to start a design, but it should be pretty simple now.

Better donate money to charity .
Luken is offline   Reply With Quote
Old 04-26-2012, 07:08 AM   #6
dh_2
Registered User
 
Join Date: Oct 2008
Posts: 12
Default

You should tak a look at CasaLib (casalib.org) for that as it has image loaders and memory management built in. That should help work around the mobile memory restrictions which are severe and different on different devices too.
dh_2 is offline   Reply With Quote
Old 04-26-2012, 02:18 PM   #7
Applauz
Senior Member
 
Join Date: May 2009
Posts: 250
Default

Casalib looks interesting. Not sure if its what I need though. I'm not loading a bunch of images.. I'm loading a bunch of movieclips from the library.
Applauz is offline   Reply With Quote
Old 04-28-2012, 12:59 PM   #8
xdeath
Deaths touch!!!
 
xdeath's Avatar
 
Join Date: Mar 2008
Posts: 775
Default

firstly, mobiles have small screens so making something that big is rather stupid if only a portion of it will wind up being viewed on the mobile screen. but hey maybe im missing something...

but the purpose of the topic was to help not critique. so with that said, try something like this. it aint tested but it should be close to what you want:
ActionScript Code:
/* right click movieclip in library with pages inside of it. click on linkage. press export for actionscript. and now the text in class should be highlighted. type in 'Page' */ var page:Page; var tween:Tween; var pageCon:Array=[]; // contain a reference to available pages var currentPage:Number = 1; // so we know the current page number var indexVal:Number; const pageTotal:int = 29; // total number of pages/movieclips. addPage(currentPage); // so we start at page 1 function addPage(pageNumber:int,startX:Number,startY:Number){     /*     lets say theres one movieclip and     all pages are on a different keyframe     */     page = new Page();     page.gotoAndStop(pageNumber);     page.x=startX;     page.y=startY;     addChild(page);     pageCon.push(page); } function removePage(evt:TweenEvent){     removeChild(pageCon[indexVal]);     pageCon.splice(indexVal,1); } stage.addEventListener(MouseEvent.MOUSE_DOWN,pressed); function pressed(evt:MouseEvent){     indexVal = pageCon.indexOf(event.currentTarget);     // if buttons inside movieclips have instance names of next and back     switch(evt.target.name){         case next:         if(currentPage<pageTotal){             // tween current page off screen. basically just animate page off screen             tween = new Tween(pageCon[indexVal],"x",Strong.easeIn,pageCon[indexVal].x,-pageCon[indexVal].width,durVal,true);             tween.addEventListener(TweenEvent.MOTION_FINISH,removePage);             currentPage+=1;             // add next page and moie it onto screen.             addPage(currentPage,Stage.stageWidth+250,Stage.stageHeight/2);// add page were you need it.             tween = new Tween(pageCon[pageCon.length-1],"x",Strong.easeIn,pageCon[pageCon.length-1].x,Stage.stageWidth/2,durVal,true);         }         break;                 case back:         if(currentPage>1){             // tween current page off screen. moves off screen (right side)             tween = new Tween(pageCon[indexVal],"x",Strong.easeIn,pageCon[indexVal].x,Stage.stageWidth+pageCon[indexVal].width,durVal,true);             tween.addEventListener(TweenEvent.MOTION_FINISH,removePage);             currentPage-=1;             // make sure next page is off screen. so play around with value until satisfied.             addPage(currentPage,-200,Stage.stageHeight/2);// add page were you need it.             tween = new Tween(pageCon[pageCon.length-1],"x",Strong.easeIn,pageCon[pageCon.length-1].x,Stage.stageWidth/2,durVal,true);         }         break;     } }

the code is untested and probably needs modifying due to the fact, i really didn't know how you wanted the animations to be. but judging from your post it sounded like you were placing page off screen then moving its x position until its on there.

regardless this is my contribution. considering whats been given so far, i think i've done my part. i wrote code from scratch as well just for you took me an hour or two. so enjoy

Last edited by xdeath; 04-28-2012 at 01:09 PM.
xdeath is offline   Reply With Quote
Old 04-28-2012, 11:09 PM   #9
Applauz
Senior Member
 
Join Date: May 2009
Posts: 250
Default

Thanks for contributing. Is there any way you can see to modify what I have working thus far ( works awesome on desktop ) .. need the part where you drop off whats not needed implemented.

allChapters_mc is a movie clip that has 29 addChilds adding 29 movieclips that are 1024 x 706 to the stage 1 after another creating a massive strip of movieclips.

Here is my code right now.

ActionScript Code:
import flash.display.*;     import flash.events.MouseEvent;     import flash.utils.getTimer;     import flash.events.Event;     import flash.geom.Rectangle;     import com.greensock.TweenLite;     import com.greensock.easing.Strong;     import com.greensock.*; // FLICK SCROLL                   var _panelBounds:Rectangle = new Rectangle(0, 0, 1024, 706);                                 var allChapters_mc:AllChapters_mc = new AllChapters_mc();             this.addChild(allChapters_mc);             allChapters_mc.x = _panelBounds.x;             allChapters_mc.y = _panelBounds.y;                                             var _currentPanelIndex:int = 0;         var _panelCount:int;         var _x1:Number;         var _x2:Number;         var _t1:uint;         var _t2:uint;                 var blitMask:BlitMask = new BlitMask(allChapters_mc, 0, 0, 1024, 706, true);                 blitMask.bitmapMode = false;                             _panelCount = 29;                         blitMask.addEventListener(MouseEvent.MOUSE_DOWN, _mouseDownHandler, false, 0, true);                                                     function _mouseDownHandler(event:MouseEvent):void {             trace("Mouse Down");                         TweenMax.killTweensOf(allChapters_mc);             _x1 = _x2 = this.mouseX;             _t1 = _t2 = getTimer();             allChapters_mc.startDrag(false, new Rectangle(_panelBounds.x - 999999, _panelBounds.y, 99999999, 0));             this.stage.addEventListener(MouseEvent.MOUSE_UP, _mouseUpHandler, false, 0, true);             this.addEventListener(Event.ENTER_FRAME, _enterFrameHandler, false, 0, true);         }                 function _enterFrameHandler(event:Event):void {             _x2 = _x1;             _t2 = _t1;             _x1 = this.mouseX;             _t1 = getTimer();             blitMask.update();         }                 function _mouseUpHandler(event:MouseEvent):void {                         trace("Mouse Up");             allChapters_mc.stopDrag();             this.removeEventListener(Event.ENTER_FRAME, _enterFrameHandler);             this.stage.removeEventListener(MouseEvent.MOUSE_UP, _mouseUpHandler);             var elapsedTime:Number = (getTimer() - _t2) / 1000;             var xVelocity:Number = (this.mouseX - _x2) / elapsedTime;             //we make sure that the velocity is at least 20 pixels per second in either direction in order to advance. Otherwise, look at the position of the allChapters_mc and if it's more than halfway into the next/previous panel, tween there.             if (_currentPanelIndex > 0 && (xVelocity > 20 || allChapters_mc.x > (_currentPanelIndex - 0.5) * -_panelBounds.width + _panelBounds.x)) {                 _currentPanelIndex--;             } else if (_currentPanelIndex < _panelCount - 1 && (xVelocity < -20 || allChapters_mc.x < (_currentPanelIndex + 0.5) * -_panelBounds.width + _panelBounds.x)) {                 _currentPanelIndex++;             }             if (allChapters_mc == null) {                 trace("---ERROR! Null target");                 return;             }             TweenMax.to(allChapters_mc, 0.7, {x:_currentPanelIndex * -_panelBounds.width + _panelBounds.x, ease:Strong.easeOut,onUpdate:blitMask.update,onComplete:setTitle});                     } function setTitle():void{             trace("allChapters_mc.x = " + allChapters_mc.x);         if(allChapters_mc.x  >= 0 && allChapters_mc.x >= -3072){     MovieClip(parent).topNavBar.topTitle.htmlText = "Introduction";     MovieClip(parent).setChapterTopNavArrow();     }         if(allChapters_mc.x  <= -4096 && allChapters_mc.x >= -8192){     MovieClip(parent).topNavBar.topTitle.htmlText = "Chapter 1: Pre-Web";     MovieClip(parent).setChapterTopNavArrow();     }         if(allChapters_mc.x  <= -9216 && allChapters_mc.x >= -13312){     MovieClip(parent).topNavBar.topTitle.htmlText = "Chapter 2: Web 1.0";     MovieClip(parent).setChapterTopNavArrow();     }         if(allChapters_mc.x  <= -14336 && allChapters_mc.x >= -18432){     MovieClip(parent).topNavBar.topTitle.htmlText = "Chapter 3: Web 2.0";     MovieClip(parent).setChapterTopNavArrow();     }         if(allChapters_mc.x  <= -19456 && allChapters_mc.x >= -23552){     MovieClip(parent).topNavBar.topTitle.htmlText = "Chapter 4: The Semantic Web";     MovieClip(parent).setChapterTopNavArrow();     }         if(allChapters_mc.x  <= -24576 && allChapters_mc.x >= -28672){     MovieClip(parent).topNavBar.topTitle.htmlText = "Chapter 5: The Future Web";     MovieClip(parent).setChapterTopNavArrow();     }                 } function destroyListeners():void{     trace("destroy listeners");     allChapters_mc.removeEventListener(MouseEvent.MOUSE_DOWN, _mouseDownHandler);             this.stage.removeEventListener(MouseEvent.MOUSE_UP, _mouseUpHandler);             this.removeEventListener(Event.ENTER_FRAME, _enterFrameHandler);                                                 this.removeChild(allChapters_mc);             allChapters_mc = null;                     } function enableBitmapMode():void{                 trace("bitMapMode Enabled");         ////blitMask.bitmapMode = true;         //blitMask.update();     }
Applauz is offline   Reply With Quote
Old 04-29-2012, 02:04 AM   #10
xdeath
Deaths touch!!!
 
xdeath's Avatar
 
Join Date: Mar 2008
Posts: 775
Default

and there lies your problem.

see your adding all 29 right from the start. what you want to be doing is to only add one mc. just the one's that is going to be visible initially. then when the button is pressed we'll add the required mc's off screen were they can't see. and when the tween is done remove the one that has now been moved off screen.

its hard to modify the code you gave simply because the easiest way to fix your code is to simply redo how you have the mc's being added. and your entire code is based around that simply setup. so it would basically be redoing most of the file.

what you need is to add mc's how i did. and use the array as a reference. and use that reference for your tween events. do that and everything becomes as simply as 1,2,3.

Last edited by xdeath; 04-29-2012 at 02:10 AM.
xdeath is offline   Reply With Quote
Reply


Thread Tools
Display Modes Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off

Forum Jump


All times are GMT. The time now is 11:32 PM.

///
Follow actionscriptorg on Twitter

 


Powered by vBulletin® Version 3.8.5
Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.
Ad Management plugin by RedTyger
Copyright 2000-2013 ActionScript.org. All Rights Reserved.
Your use of this site is subject to our Privacy Policy and Terms of Use.