Soon i shall write a whole tutorial on how to make a CMS, both for flash web pages and for normal PHP webpages.
For flash, XML can be a vital tool and is extremely useful!
So, in this tutorial, i will teach you how to make a news section and hopefully teach you the basics of handling XML data within flash:
Firstly you need to set up the XML file, open notepad or a similar text editor. Inside here you will write the xml to be read by flash,
here is how the xml file should be layed out:
(for an in-depth explanation of how xml works, go to http://www.w3schools.com/xml/)
<?xml version="1.0" encoding="ISO-8859-1"?>
<news>
<article>
<title>News Title 1</title>
<date>05/09/2006</date>
<content>News content 1 here</content>
</article>
<article>
<title>News Title 2</title>
<date>06/09/2006</date>
<content>News content 2 here</content>
</article>
</news>
all the parts between "" are the parts that can be edited. To add a new news item just copy everything between and and paste it above then change the parts between " and ". In my CMS tutorial later, this will be done much more dynamically.
Now save this file as 'news.xml'. If you need to edit this file, just reopen the xml file in notepad and change it.
Now the flash part:
Open a new document, press "T" to bring up the text tool, drag a text box onto the document (make it as large as you want), at the bottom of the document, click the "Properties" tab. On the properties tab change where it says "Static text" to "Dynamic text", make sure "multiline" is selected, not "single line". Give it an instance name of "newstext". On the properties panel, press "embed" and select everything between "Uppercase" and "Punctuation" then press "OK".
Now the code (fully annotated to help you), click on the current frame (the one with the text box in), and then open the actions panel(F9).
Insert the following code:
/* Loading XML into flash tutorial by Matt Davenport - www.theflashplace.com */
stop(); //stop the movie from playing
newstext.html = true; //set up the text box to allow HTML to be input
newstext.htmlText = "
Loading News..."; //display "Loading News..." until news has loaded
function loadXML(loaded) {
/* the next block of code is splitting the xml code up into variables, ready to be put into a text box. it creates a loop which loops
through all the xml file and finds as many news items as have been entered automatically*/
if (loaded) {
xmlNode = this.firstChild;
newstitle = [];
newsdate = [];
newscontent = [];
total = xmlNode.childNodes.length;
for (i=0; i<total; i++) {
newstitle[i] = xmlNode.childNodes[i].childNodes[0].firstChild.nodeValue;
newsdate[i] = xmlNode.childNodes[i].childNodes[1].firstChild.nodeValue;
newscontent[i] = xmlNode.childNodes[i].childNodes[2].firstChild.nodeValue;
}
firstNews();
} else {
trace("file not loaded");
}
}
//loading the XML Document
xmlData = new XML();
xmlData.ignoreWhite = true;
xmlData.onLoad = loadXML;
xmlData.load("news.xml"); //this is your xml file
xmlstring = "
"; /*inserting 2 blank spaces at the top, delete this if text isnt appearign where you want it*/
function firstNews() {
for(p=0; p<total; p++){//loop through variables and turn into string
xmlstring += "<b>"+newstitle[p]+"</b> - </i>"+newsdate[p]+"</i><br>"+newscontent[p]+"<br><br>"; //convert to string
}
newstext.htmlText = "
"+xmlstring;// display the string in the text box
}
This should all work ok 
let me know if you have any problems
Matt
Please note if you download the source files, you will need to get rid of the random digits before it will work :)
Source1 - 5871main.fla (right-click > "save target as" to download)
Source2 - 5871main.swf (right-click > "save target as" to download)
Source3 - 5871news.xml (right-click > "save target as" to download)
Back to tutorials
Sponsored Link
|
