Simple XML Quiz

This quiz allows for an unlimited number of questions and answers to be passed through a XML file. If there are more options for answering than fit the page, a scroll is automatically displayed.

Each question has exactly one correct answer, and in order to continue to the next question, it's mandatory for the user to choose one answer.

For each correct answer, the user receives one point. For each incorrect answer, the user receives zero points.

At the end of the quiz, based on the total number of accumulated points, the user receives a message set in the XML, and the results are saved in a text file.

The text file is scores.txt. For each user the results are saved on a new line. The information is formated like this:

USER IP, DATE, SCORE
USER IP, DATE, SCORE
USER IP, DATE, SCORE
USER IP, DATE, SCORE

This process is transparent to the user. Note you need a server with PHP support.


The final results passed to the user are calculated like this:

0 - 2 (0, 1, 2 points)
3 - 4 (3, 4 points)
5 - 6 (5, 6 points)
7 - 8 (7, 8 points)

Any values and any number of values can be passed here as long as the last is smaller than the total number of questions (since the maximum result can be equal to this number if the user answers all questions correctly).

In the settings XML file you can edit colors and sizes, and the XML is very intuitive. Please check the help tab for more information.

 

bonobo

on 17/12/09

 

Hi, Thanks for the comments - I look much worse :-) - and the quick answer!
Ok I've had a look at the setting xml and I still don't know what to change :

If I change the stroke color to transparent or/and the fill colors it turns into black.
You guessed ? : I'am a beginner

 

Andrei Potorac

on 18/12/09

 

That's funny! :-)

Inside settings.xml, change this to the color you want to use:

                fillColor="0xffffff" 
                

 

bonobo

on 21/12/09

 

Hello Bobocel,
Sorry to come back again to you and wasting your time but It still don't work : I have the same problem than Brainbuckett (page3 of coments) I would like to eliminate the white that borders the rounded corners of the main area. I'm using on a different color BG and would love for it to blend, so which parameter is this?
So

                <background strokeColor="0xf7f7f7" fillColor="0xffffff" contentMargin="10" contentYPosition="10"/> 
                

if I change to "transparent" it's still a white bg or it turns into black etc... and I'd like to have it transpsrent and get rid of the thin grey line of the content margin.
Sorry,
Have a lovely day

 

Andrei Potorac

on 21/12/09

 

bonobo, if you want to completely remove it, you need to do it in the Quiz.as. Comment this line:

                Tweener.addTween(mcBackground, {alpha : 1, time : 0.5, transition : "easeOutExpo"});
                

 

bonobo

on 5/1/10

 

Hello,
sorry to be so long to thanks you to your patience. So thank you very much for your advices and I wish you a happy new year!

 

saquib ansari

on 11/3/10

 

Hello,

Your components are awesome.

I am using a simple quiz system. I want to add a name and email field in in beginning of quiz.

How i can do that ?

 

Andrei Potorac

on 11/3/10

You can only add information in the blue text area. Email or what you need, all must go there. ;)

 

Vlad Serban

on 5/5/10

 

adding something here 2

 

Vlad Serban

on 5/5/10

un reply pentru mine editat 2

 

btorubio

on 9/5/10

 

how i get the answers from the quiz? Where i need to put my email? Please Help

 

Andrei Potorac

on 10/5/10

Please check the PHP file that comes with the source files. It saves all scores in a txt file.

 

andreshenao206

on 12/7/10

 

hello, congratulations on this website as well.
and if possible load quiz.xml random file.
so that the questions vary every time you load the quiz
quiz.xml
quiz1.xml
quiz2.xml

I can not find the file where you load the xml to make the modification or can not?

Thank you

 

Marius-Cristian Donea

on 13/7/10

Hi,
The xml file is loaded in project/source/com/vuzum/quiz/Quiz.as on line 289.

 

andreshenao206

on 13/7/10

hello, look at the code and I could not make me load randomly
the quiz.
if anyone can help me because I've searched far and nothing to find the
solution.

sorry and Thanks

 

Marius-Cristian Donea

on 14/7/10

Here is a hint:
In project/source/com/vuzum/quiz/Quiz.as @ line 289 replace this code:

                
var tempContentFlashVar : String = stage.loaderInfo.parameters.xmlPath;
if(tempContentFlashVar != "" && tempContentFlashVar != null)
{
    xmlContentPath = pathToFiles + tempContentFlashVar;
    xmlPathForScript = tempContentFlashVar;
}
else
{
    xmlContentPath = pathToFiles + "xml/quiz.xml";
    //xmlContentPath = "http://vuzum.com/tests/poll/pool.xml";
}

                

with

                
var xmls:Array = ['xml/quiz1.xml','xml/quiz2.xml','xml/quiz3.xml','xml/quiz4.xml'];
xmlContentPath = pathToFiles + xmls[Math.round(Math.random()*4)];

                

 

andreshenao206

on 14/7/10

 

I thank you very much works perfect.

7654321

Post a comment

Please login to join the discussions. Don't have an account? Register (it takes 30 seconds)

There are currently no frequent asked questions. As soon as we receive your feedback, we'll update this section permanently.

There are no video tutorials for this flash component yet.

Simple XML Quiz - change log

 2010.11.22 - version 1.0.2
- new flabell standard


 2010.07.29 - version 1.0.1
- ofString XML setting fixed


 2009.08.03 - version 1.0
* First release!

Simple XML Quiz - tips and tricks

Introduction: 

     This is a fully customizable Simple XML Quiz, with support for unlimited questions and answers. Only one answer at a time can be the correct answer.

     Everything is customizable in the XML files, including the question’s height, text color, size and much more.

     This Simple XML Quiz contains a handful of features and settings. It is easy to use the quiz in your Flash projects or as an independent Flash Quiz Component on your html based website.

     If you want to use the quiz in a Flash file, importing it is as easy as moving some actionscript files around and dragging the movieclip containing the quiz in your Flash file.

     Skinning is very simple as well. To edit the file you don't need any Flash experience, because all the settings are loaded from an external XML file, which you can edit with any text editor. You can change the colors of the elements, the size of the elements, the size of the quiz and much more.

     The code is very well commented, written following the best OOP practices, and the downloaded file comes with all the assets used to create the Simple XML Quiz such as the fonts, the .ai source files, and the .fla source file.

Features:

1. Customize the quiz through the XML file.
2. Add unlimited questions and answers.
3. Customize the colors from the XML file.
4. Supports scrolling.

 

Folder structure:

     Please navigate to the deploy folder, inside the project folder. This folder contains all the files you need to upload to your server to have the Flash XML Quiz work. Your server must support PHP.

     quiz/xml/settings.xml

     XML configuration file - This is where you make all changes to the look and feel of your Flash XML Quiz.

     quiz/xml/quiz.xml

     Questions/Answers XML configuration file - This is where you make all changes to the quiz questions and answers.

     js/swfobject.js

     Deconcept SWFObject is a small JavaScript file used for embedding Adobe Flash content. The script can detect the Flash plug-in in all major web browsers (on Mac and PC) and is designed to make embedding Flash movies as easy as possible.

     js/expressInstall.swf

     SWFObject has full support for the Adobe Flash Player Express Install feature. Using expressinstall, your users never have to leave your site to upgrade their Flash Player.

     preview.swf

     This is the component swf file which is embedded in your website.

     index.html

     HTML document used to embed the swf file. Please check the source code to see how the variables are passed to the swf file, using any text editor such as Notepad or Textedit.

 settings.xml structure: 

     Below you can see what each of the attributes in the XML file means:

<settings width="560"
height="420">

     Here you can define the quiz width and height if these are not defined in the HTML (for example when you use the quiz inside another Flash file).

<loader color="0xEEEFEF"/>

     Here you can define the loader's color.

<background strokeColor="0xC8CACC"
fillColor="0xF3F5F5"
contentMargin="15"
contentYPosition="10"/>

     Sets the poll background stroke color, fill color and width of the content margin, as well as the position from the top of the quiz of the questions.

<splash_screen strokeColor="0x27AAE1" 
fillColor="0x27AAE1" 
textColor="0xffffff" 
buttonFillColor="0xffffff" 
buttonStrokeColor="0x999999" 
buttonTextColor="0x333333" 
buttonText="Start quiz" 
buttonHeight="26" 
overButtonColor="0x27AAE1" 
overButonTextColor="0xffffff"/>

     The XML attributes are self explanatory. These control the splash page.

<questions_screen questionTextColor="0x231F20"
questionBackgroundFillColor="0xffffff"
questionBackgroundStrokeColor="0x2A2828"
answerActiveStrokeColor="0xEEEFEF"
answerActiveFillColor="0xF4F4F2"
answerInactiveTextColor="0xA7A9AC" 
answerActiveTextColor="0x231F20" 
answerInactiveStrokeColor="0xEEEFEF" 
answerInactiveFillColor="0xF8F8F8" 
questionInactiveCircleColor="0xEEEFEF" 
questionActiveCircleColor="0x27AAE1" 
questionPointColor="0x27AAE1" 
questionPositionColor="0x231F20" 
questionsPositionNumberColor="0x27AAE1" 
nextButtonFillInactiveColor="0xF6F7F7" 
nextButtonStrokeInactiveColor="0xE1E2E3" 
nextButtonTextInactiveColor="0xE6E7E8" 
nextButtonFillActiveColor="0xffffff" 
nextButtonStrokeActiveColor="0x2A2828" 
nextButtonTextActiveColor="0x231F20" 
nextButtonText="next" 
finishButtonText="finish" 
ofString="of" 
buttonHeight="20" 
overButtonColor="0x27AAE1"/>

     The XML attributes are self explanatory. These control the questions pages.

<final_screen strokeColor="0x27AAE1" 
fillColor="0x27AAE1" 
questionTextColor="0xffffff" 
resultsStrokeColor="0xA3A0A0" 
resultsFillColor="0xffffff" 
resultsTextColor="0x000000" 
pointsTextColor="0x27AAE1" 
pointsStringTextColor="0x231F20" 
pointsString="points"/>

      The XML attributes are self explanatory. These control the results page.

<scrollbar backgroundWidth="12" 
scrollerWidth="6" 
backgroundColor="0x27AAE1" 
scrollerColor="0xffffff"/>

     Sets the scroll width, background width, scroll background color and scroller's color. The scroll only appears when it's needed. (meaning you want to display more answers inside an area than fit)

<error textColor="0x27AAE1" 
visibilityTime="5" 
unselectedChoice="Please select an option"/>

     Self-explanatory attributes. Basically you add the strings for each textfield, on particular situations.

quiz.xml structure:

     This xml contains the quiz data. It has a node for the description:

<description><![CDATA[Do you miss all the incredible clothes worn by Carrie and Co. on "Sex and the City"? This "designer" quiz spans all six seasons. For fashion addicts only!]]></description>

     Several nodes for questions and answers like :

<item id="1" correct="1">
	<question><![CDATA[In season one's "The Power of Female Sex", in which fabulous store are Carrie and Amalita when Amalita states, "You can pay me back NEVER!"?]]></question>
	<answer id="1"><![CDATA[Christian Dior]]></answer>
	<answer id="2"><![CDATA[Jimmy Choo]]></answer>
	<answer id="3"><![CDATA[Manolo Blahnik]]></answer>
	<answer id="4"><![CDATA[Dolce & Gabbana]]></answer>
</item>

     Note each question has it's own id, as well as each answer. The correct attribute holds the value of the correct answer, as an id.

     There is one more node for the results screen text and user message:

<final_screen>	
	<limit value="4"><![CDATA[Congratulations!]]></limit>
	<limit value="8"><![CDATA[Congratulations!]]></limit>
</final_screen>

     The final results passed to the user are calculated like this:

<limit value="2"><![CDATA[Lorem ipsum dolor sit amet, consectetur adipiscing elit.]]></limit>
<limit value="4"><![CDATA[Lorem ipsum dolor sit amet, consectetur adipiscing elit.]]></limit>
<limit value="6"><![CDATA[Lorem ipsum dolor sit amet, consectetur adipiscing elit.]]></limit>
<limit value="8"><![CDATA[Lorem ipsum dolor sit amet, consectetur adipiscing elit.]]></limit>

0 - 2 (0, 1, 2 points)
3 - 4 (3, 4 points)
5 - 6 (5, 6 points)
7 - 8 (7, 8 points)

     Any values and any number of values can be passed here as long as the last is smaller than the total number of questions (since the maximum result can be equal to this number if the user answers all questions correctly). In this example the total number of questions is 8,  so the maximum value needs to be 8 as well.   

Flashvars:

     In the html file you can set some variables for the quiz like dimensions (width and height), the path to the files if you choose to put them in another location rather than the same folder of course, and the quiz data xml files.                        
     

flashvars.stageW = stageW;
flashvars.stageH = stageH;
            
flashvars.pathToFiles = "quiz/";
            
flashvars.settingsPath = "xml/settings.xml";     
flashvars.xmlPath = "xml/quiz.xml";

Support:

     If you need any help using the product, please contact us at [email protected].