PDA

View Full Version : Ideas for a new xml driven swf



jrutter
January 23rd, 2008, 02:02 PM
Ok, so Im new to AS3 - but Ive already gotten a pretty good handle on XML/AS3. I have built a few movies that pull in content from xml and place it via actionscript on the stage.

So I have a new idea for a flash movie, but Im having trouble getting my head wrapped around how to do it. So I wanted to post it here and see what people think.

Basically, I want to pull in an xml feed and create an instance of a movieclip from the library on the stage for each node. Each MC will hold the content from that particular node. These MC's will be set to a timer, and every 5 seconds, the next MC will load. Ok, that part is easy and I have figured that out.

The next piece is animating how they appear on the screen. I want them all to move in from the bottom. So the first one appears, after 5 seconds it moves up off the screen and the second one moves up on the the stage, and so forth. How hard would that be to do? I figured I could use event listeners and timers, Anyone have any example code?

Please let me know

daleth
January 23rd, 2008, 04:00 PM
Use TweenLite (or Tweener) to handle the animation. They have lots of methods for doing what you want to do. It would probably look something like this, but BEWARE my syntax might be off on stuff, I'm just thinking off the top of my head, so LOOK IT UP in the help as you go!!!



function animateClipIn(which:MovieClip){
TweenLite.to(which, *your duration here*, {x:targetx, y:targety});
var timer = setTimeout(5000 *(duration in milliseconds)*, animateClipOut);
}
...
function animateClipOut ... basically the same as above with different values, etc
...
(and then somewhere call animateClipIn)


So what that's going to do is move a clip where you want it, then make it move out after a duration of 5 seconds. Super easy :) Obviously, take out my annotations. This isn't copy and paste code ;)

jrutter
January 23rd, 2008, 04:14 PM
Use TweenLite (or Tweener) to handle the animation. They have lots of methods for doing what you want to do. It would probably look something like this, but BEWARE my syntax might be off on stuff, I'm just thinking off the top of my head, so LOOK IT UP in the help as you go!!!



function animateClipIn(which:MovieClip){
TweenLite.to(which, *your duration here*, {x:targetx, y:targety});
var timer = setTimeout(5000 *(duration in milliseconds)*, animateClipOut);
}
...
function animateClipOut ... basically the same as above with different values, etc
...
(and then somewhere call animateClipIn)
So what that's going to do is move a clip where you want it, then make it move out after a duration of 5 seconds. Super easy :) Obviously, take out my annotations. This isn't copy and paste code ;)

Yeah, Ive used TweenLite - its a nice library! Is it that easy? So animate in - set timer for 5 seconds, then animate out. Then call animate in again? Thats pretty easy!

jrutter
January 24th, 2008, 10:15 AM
Thanks for your help, I figured out the animateIn/animateOut piece, I just have to add it into my main movie. Here is the code, it works great!


import gs.TweenLite;

var inTimer:Timer = new Timer(2000);
var mc:MovieClip = new testMC();
var outTimer:Timer = new Timer(5000);

inTimer.addEventListener(TimerEvent.TIMER, animateIn);
outTimer.addEventListener(TimerEvent.TIMER, animateOut);
inTimer.start();

addChild(mc);
mc.x = 0;
mc.y = -100;

function animateIn(evt:TimerEvent):void {
TweenLite.to(mc, 1, {x:0, y:0});
outTimer.start()
}

function animateOut(evt:TimerEvent):void {
TweenLite.to(mc, 1, {x:0, y:100});
inTimer.stop();
}

McGuffin
January 24th, 2008, 02:47 PM
Ok, here's the deal. Worked on something like this, *almost* got it out the door and then I got obscenely busy at work and school and haven't touched it in a couple months.

http://www.iamcolin.com/swftly/

Things like object creation, animation, filters, file loading, font loading, all built in and should be working, all XML driven.

You would specifically want to look at the com.swftly.xml.Parser class. Basically it's all event-based, so the XML is set up that it parses through the XML file looking for events, and then fires through that XML code when the event is called. (this is set up in com.swftly.xml.Parser::setParser() ). From there, it'll call a function based on the name you've provided in the XML. You're looking for com.swftly.xml.ContainerParser::parseChildren() which iterates through the provided code and creates new classes based on that. After that, you can build a parseData call into the XML for the CHILDREN_COMPLETE event, and then make changes to the children.

Sorry for the lack of documentation, I just threw this up now. Not sure how much use this code will be without documentation, but at least you get to see how someone else went about doing this.

Cheers!

PS. I only ask that if you do use this code and have some suggestions, please pass them along. I do mean to get back on this project once I have the time.