Using XML

Items can be added to the 3DMenu using an external XML file, instead of adding them through the Component Inspector or ActionScript. Here's how you would do this:

1. Create a new Flash file and drag the 3DMenu component onto the stage. Ensure that you save your file now.

 

2. Next you must create the symbols which will be the items in your 3DMenu. Press Ctrl+F8 (Win) or Cmnd+F8 (Mac) to open the Create New Symbol dialogue box. Enter a name for the symbol, for the purposes of the tutorial name it item1. Ensure that the type is set to 'Movie clip'. Check the Export for Actionscript checkbox (the Export in first frame check box will be checked automatically.)

For 3DMenu-AS2:

Enter an Identifier for the clip, for the purposes of the tutorial give it the identifier name of item1. Click OK.

 

For 3DMenu-AS3:

Enter an Class for the clip, for the purposes of the tutorial give it the class name of item1. Click OK.

 

 

3. On the timeline of the clip you have just created draw a graphic, for the purposes of this tutorial draw a rectangle.

 

4. Return to the main timeline and repeat from step 2 for each additional symbol that you wish to create.

 

5. Open your favourite plain text editor (for example Notepad on Windows or TextEdit on Mac) and start a new file. Begin your file with the following line:

<?xml version="1.0" encoding="utf-8"?>

This is the standard xml declaration.

 

6. Add the following lines to your xml file. (The bold lines are the new additions)

<?xml version="1.0" encoding="utf-8"?>
<items>
</items>

This two lines open the items node as the root node of xml. All of the item nodes will be contained within this node.

Add the following lines to your xml file:

 

For 3DMenu-AS2:

<?xml version="1.0" encoding="utf-8"?>
<items>

<item linkageId="item1" id="home">
</item>

</items>

 

For 3DMenu-AS3:

<?xml version="1.0" encoding="utf-8"?>
<items>

<item className="item1" id="home">
</item>

</items>

 

These two lines add an item node. The first line contains the linkageId/className and id attribute. The linkageId/className attribute is the name that you entered for the Identifier/Class in step 2.

The id attribute is the identifier for the item that you will use when referring to the item through ActionScript. You can enter any value that you wish here.

Add the following lines to your xml file.

 

For 3DMenu-AS2:

<?xml version="1.0" encoding="utf-8"?>
<items>

<item linkageId="item1" id="home">

<position x="100" y="-50" z="0"/>

</item>

</items>

 

For 3DMenu-AS2:

<?xml version="1.0" encoding="utf-8"?>
<items>

<item className="item1" id="home">

<position x="100" y="-50" z="0"/>

</item>

</items>


This line defines the position of the item on the stage.

Add other items to xml file in this format.

 

For 3DMenu-AS2:

<?xml version="1.0" encoding="utf-8"?>
<items>

<item linkageId="item1" id="home">

<position x="100" y="-50" z="0"/>

</item>

<item linkageId="item2" id="about">

<position x="-100" y="-50" z="0"/>

</item>

</items>

 

For 3DMenu-AS3:

<?xml version="1.0" encoding="utf-8"?>
<items>

<item className="item1" id="home">

<position x="100" y="-50" z="0"/>

</item>

<item className="item2" id="about">

<position x="-100" y="-50" z="0"/>

</item>

</items>

 

Additional data can be added to each item which can be accessed through the ActionScript. For example, you may wish to add a data node called link which contains the URL or frame name that you would like to call when clicking on the item. For example:

 

For 3DMenu-AS2:

<?xml version="1.0" encoding="utf-8"?>
<items>

<item linkageId="item1" id="home">

<position x="100" y="-50" z="0"/>

<link>http://www.flashloaded.com</link>

</item>

<item linkageId="item2" id="about">

<position x="-100" y="-50" z="0" />

<link>http://www.fontsforflash.com</link>

</item>

</items>

 

For 3DMenu-AS3:

<?xml version="1.0" encoding="utf-8"?>
<items>

<item className="item1" id="home">

<position x="100" y="-50" z="0"/>

<link>http://www.flashloaded.com</link>

</item>

<item className="item2" id="about">

<position x="-100" y="-50" z="0" />

<link>http://www.fontsforflash.com</link>

</item>

</items>

 

7. Save the XML file to the same folder as your Flash file. In this example, we have given the XML file the name: menu.xml


8. Return to your Flash file, click on the 3DMenu that's on the stage, then click on the Setting tab of the 3DMenu in the Component Inspector and enter the name and path to the XML file that you just created to the xmlURL parameter. Note: If your .swf file will be in a different folder to the HTML file in which it is embedded, you should enter the path to the XML file, relative to the location of the HTML file.


 

9. Press Ctrl+Enter (Win) or Cmnd+Enter (Mac) to test your movie.

 

Using external images as items in XML

When using XML, you also have the option of loading external images as items, instead of pre-defining each item as a movie clip in your library. This is done using the 3DMenu's built in image loader, called 3DMenu_imgLoader. To use this, you would define the image loader in the linkageId (AS2) or className (AS3) parameter and the name and path to the images would be defined in the link parameter. For example:

 

For 3DMenu-AS2:

<?xml version="1.0" encoding="UTF-8"?>
<items>

<item linkageId="3DMenu_imgLoader" id="about">

<position x="0" y="0" z="0" />

<link>images/about.jpg</link>

<name>About Us</name>

</item>

</items>

 

For 3DMenu-AS3:

<?xml version="1.0" encoding="UTF-8"?>
<items>

<item className="3DMenu_imgLoader" id="about">

<position x="0" y="0" z="0" />

<link>images/about.jpg</link>

<name>About Us</name>

</item>

</items>