Flash + components + XML

October 20, 2006 10:55 AM

Flash 8 code question:

I'm trying to figure out how to create an XML driven menu using the accordion component. I want the child names to come from the xml. Each child/segment of the accordion should contain an empty clip. The clip should be populated with buttons, however many are listed in the xml file, and the buttons should load a file (in this case a jpg) into a target movie clip.
I'm not sure I explained that well.
Picture an accordion component on the left side of your screen. Section one is IDENTITY, section two is RECRUITMENT, section three is ANNUAL REPORTS. Each section contains a movie clip. in the IDENTITY section the clip contains three buttons ID1 ID2 ID3. Clicking ID2 loads a jpg into a box on the right side of the screen. The only complicated part of this is that all the information , the labels, the number of segments, the number of buttons in each segment, the location and description of the jpgs, everything is contained in a single XML file so that someone else could come along, open the file, add a PROMOTION section, add five buttons to the section and put five jpgs in a folder and the application will reflect the change.

posted by Grod to Computers & Internet (9 answers total)

I'm not exactly sure what your specific question is, but as a general approach, your XML file might look like this:
[CODE]
[SECTIONS]
[SECTION NAME="identity"]
[SUBSECTION NAME="id1" LABEL="label here" DESCRIPTION="blah blah blah" IMAGE="foo.jpg" /]
[SUBSECTION NAME="id2" LABEL="label here" DESCRIPTION="blah blah blah" IMAGE="foo.jpg" /]
[/SECTION]
[SECTION NAME="recruitment"]
[SUBSECTION NAME="id1" LABEL="label here" DESCRIPTION="blah blah blah" IMAGE="foo.jpg" /]
[/SECTION]
[/SECTIONS]
[/CODE]

(imagine all those [] were proper tags)


Then you loop through this guy, create your section objects, with each section object having an array of subsection objects. Have the constructors for each object make your movie clips and such, placing the movie clips based on the previous positions. If you don't like object oriented actionscript, you can do the same thing with a two dimensional array.

Is there a specific part of the process that is a big stumbling block?
posted by malphigian at 1:00 PM on October 20, 2006

Ah, I just realized you are asking specifically about the according component. I personally wouldn't use that for something like this, I'd roll my own, but someone who enjoys working with components more might offer better advice.
posted by malphigian at 1:02 PM on October 20, 2006

Best answer: Yeah, I too prefer to roll my own than use the built-in components (which are bloatware in my opinion).

But I can tell you that if you're creating "buttons" on the fly, from imported data," they will have to be movieclips that behave like buttons -- not actual buttons. This is because you can't access the text on a button via actionscript. So if you want the labels to be updated by the XML, they'll have to be embedded in movieclips. This shouldn't be a big deal, since movieclips can do everything buttons can do.

I'm not sure I understand your question, Grod. I DO think I understand what you're trying to do, but I don't get which part of it is troubling you. Are you asking how to read in data from an XML file? I know some people use a component to do this, but as I don't like components, just do it myself:

XML example:

[friends]
  [friend id="1"]
      [first]John[/first]
      [last]Smith[/last
  [/friend]
  [friend id="2"]
      [first]Mary[/first]
      [last]Jones[/last]
  [/friend]

In Flash, assuming your pointer is at the top of the document, you could access "Smith" this way:

xmlDoc.firstChild.firstChild.firstChild.nextSibling.firstChild.nodeValue;

I'll break that down:

xmlDoc.firstChild = [friends]...[/friends]
xmlDoc.firstChild.firstChild = [friend]...[/friend]
xmlDoc.firstChild.firstChild.firstChild = [first]...[/first]
xmlDoc.firstChild.firstChild.firstChild.nextSibling = [last]...[/last]
xmlDoc.firstChild.firstChild.firstChild.nextSibling.firstChild = Smith
And appending nodeValue unto the end gives you "Smith" as a string instead of as an XML object.

There are many other ways you could get to Smith. For instance, you could use Arrays:

xmlDoc.childNodes[0].childNodes[0].childNodes[1].childNodes[0].nodeValue;

I could get at all the data this way:

var xmlDoc:XML = new XML();
xmlDoc.ignoreWhite = true; //don't read tab chars as nodes
xmlDoc.onLoad = extractData;
xmlDoc.load("url of xml data");

function extractData():Void
{
var strFirst:String;
var strLast:String;
var numID:Number;
var arrNodes:Array = new Array();
arrNodes = xmlDoc.firstChild.childNodes;
for (var i:Number = 0; i < arrnodes.length; i++)br> {
strFirst = arrNodes[i].firstChild.firstChild.nodeValue;
strLast = arrNodes[i].firstChild.nextSibling.firstChild.nodeValue;
numID = arrNodes[i].attributes.id;
// now use the data, e.g. to populate an accordion
}
}

I've been assuming here that your problem was reading and parsing the XML. I can't help if your problem is more about the accordion component. But the components ARE really well documented in the online help.
posted by grumblebee at 4:08 PM on October 20, 2006

Response by poster: grumblebee, close enough to what I was asking that I think I know what to do next. Part of the confusion is that the way I personally organize information, while logical, isn't the best way to approach programming. So I try breaking things down into the smallest possible problem, both because I've been told this atomic approach works best in coding and because I need to figure out how much I don't know before I can do anything. But once I've broken the problem down to:
I need a menu that displays one segment at a time. I need the labels and contents of the segments "buttons" to be created dynamically at runtime from an external file. I need each "button" to trigger one event, loading an external file (image or movie) into a target. I need the information about where this file is located to be contained in an external file and preferably near the descriptive (what the user sees on the button) information to make editing easier for others.

Then I say, well, XML is ideal for this, and there's this thing called the accordion component, and I know how to load stuff into targets, now I need to learn all the rest and tie it together. but since I don't know all the rest I don't know the best order to learn it in, the best way to tie it all together, or the best structure/abstraction/(not sure what you'd call it, but sort of a Platonic form of a program) to use. So, despite having small chunks that I can work with, I'm still overwhelmed because I don't know in what order I ought to work with them.
posted by Grod at 5:37 PM on October 22, 2006

Grod, from the number of AS questions that you have, it really sounds like you need some sort of long-term solution (training? hiring a developer?) I have resources along those lines if you think they will be of help.
posted by grumblebee at 7:37 PM on October 22, 2006

Response by poster: ah, now it's working. thanks again!
posted by Grod at 7:49 PM on October 22, 2006

Response by poster: Grumblebee, you're right. Unfortunately, the "developer" my bosses employ is a self described "artist, not a programmer" he is very good at getting the job done, but I object on principle to his approach. I figure the WYSIWYG flash interface is convenient for simple tasks but probably not the best way to make most things. He is also the one who teaches flash and web design at the local art college. He is intelligent, capable, and competent and my objections come across as dogmatism. The people I work with can't write (x)html or css and freak out if I use a text editor because they're afraid they won't be able to "open the website" in dreamweaver. A program I can use but hate. My markup (which they call "code") validates. Anyway... one of these days I'll take a course. I'd rather not bother with Flash at all, I never intended to learn it, but if I'm going to use it I want to use it properly.
posted by Grod at 8:53 PM on October 22, 2006

my bosses employ is a self described "artist, not a programmer"

This is a big problem. Actionscript is growing into a pretty heavy-duty language. AS 3.0 reminds me of Java (not Javascript). It's no longer a toy language.

This creates a problem, because -- due to AS's history as a toy language and due to Macromedia's refusal to support Linux -- pro-hackers have always disdained Flash. So it's hard to find a really good programmer who knows -- or is willing to learn -- AS.

On the other hand, the artist/designer types don't have the CS background to know how to program what is now a sophisticated, complex language, so they wind up creating unmaintainable spaghetti code.

Should you decide to bite the bullet and learn AS, be heartened that you'll be learning useful skills. Since AS has improved so much recently, good AS skills will serve you in any programming environment and with any language.
posted by grumblebee at 9:07 PM on October 22, 2006

Response by poster: screens: good or bad thing?
posted by Grod at 9:40 AM on October 23, 2006