I recently created a visual quiz app which asks a question and then gives 4 image answers.
The problem that I’m having is that the images don’t shrink the image into their quadrants, but rather, zooms in on the top left corner of the image.
Can anyone tell me what I have to change in the following code to make the images display at a set width (so that they fit in the quadrants proportionally).
Here is what the SWF looks like now. As you can see the images become distorted because they are being stretched. What should happen is that the images be displayed at a fixed width and variable height.
var dataXML:XML = new XML();
var arrSounds:Array = new Array();
var arrData:Array = new Array();
var rndData:Array = new Array();
var soundID = 0;
var imgCur = 0;
var isRandom = false;
var imgLoader:MovieClipLoader = new MovieClipLoader();
var mclListener:Object = new Object();
this.createEmptyMovieClip("sounds", this.getNextHighestDepth());
mcanswer._visible = false;
RandomArray();
//----------
dataXML.ignoreWhite = true;
dataXML.onLoad = function(success:Boolean) {
if (success) {
var tmp = dataXML.firstChild.childNodes;
//_global.audiopath = dataXML.firstChild.attributes.audiopath;
//_global.imagepath = dataXML.firstChild.attributes.imagepath;
mcanswer.Correct.Title.text = dataXML.firstChild.attributes.text_correct;
mcanswer.Incorrect.Title.text = dataXML.firstChild.attributes.text_incorrect;
if (dataXML.firstChild.attributes.randomize == "true") {
isRandom = true;
}
var t = 0;
for (i=0; i<tmp.length; i++) {
var obj:Object = new Object();
if (isRandom) {
if ((tmp*.attributes.type == "question") || (tmp*.attributes.type == "direction")) {
obj.type = tmp*.attributes.type;
} else {
obj.type = "answer"+rndData[t];
t++;
}
} else {
obj.type = tmp*.attributes.type;
}
obj.text = tmp*.firstChild.nodeValue;
obj.feedback = CheckString(tmp*.attributes.feedback);
obj.image = CheckString(tmp*.attributes.image);
obj.audio = CheckString(tmp*.attributes.sound);
obj.status = CheckString(tmp*.attributes.status);
arrData.push(obj);
}
//-------------
//Randomize();
LoadImages();
setSpeakerActions();
setTexts();
} else {
trace("Error: loading xml file");
}
};
dataXML.load(_root.xmlPath);
//dataXML.load("question.xml");
function RandomArray() {
var tmpArray = new Array();
i = 0;
while (i<4) {
z = random(4);
if (tmpArray[z] != 55) {
rndData* = z+1;
tmpArray[z] = 55;
i++;
}
}
}
function LoadSounds() {
if (soundID<arrData.length) {
if (arrData[soundID].audio != null) {
soundloading._visible = true;
var mc = sounds.createEmptyMovieClip("audio_"+arrData[soundID].type, sounds.getNextHighestDepth());
mc.s = new Sound();
mc.s.loadSound(arrData[soundID].audio, false);
loading.Status.text = "Please, wait while loading sounds...
";
loading.Status.text += "Loading "+soundID+" of "+arrSounds.length;
mc.s.onLoad = function(success:Boolean) {
if (success) {
soundloading._visible = false;
if (soundID<arrData.length) {
soundID++;
LoadSounds();
} else {
//trace("finished");
soundloading._visible = false;
}
//this.start();
//trace("Sound loaded");
} else {
//trace("Sound failed");
soundID++;
LoadSounds();
}
};
} else {
soundID++;
LoadSounds();
}
} else {
// loading finished
//soundID++;
//LoadSounds();
}
}
function setSpeakerActions() {
for (i=0; i<arrData.length; i++) {
var mc = eval("audio_"+arrData*.type);
var mcs = eval("image_"+arrData*.type+".bigspeaker");
var mcimg = eval("image_"+arrData*.type);
mcs._visible = false;
if (arrData*.audio == null) {
mc._visible = false;
} else {
mc.onRelease = function() {
stopAllSounds();
sounds[this._name].s.start();
};
}
if (arrData*.image == null) {
if (arrData*.type != "direction") {
mcimg._visible = false;
var mctxt = eval("text_"+arrData*.type);
mc._x = mctxt._x=mcimg._x;
}
}
}
}
function setTexts() {
for (i=0; i<arrData.length; i++) {
var mc = eval("text_"+arrData*.type);
if (arrData*.text == null) {
mc._visible = false;
} else {
mc.txt.text = arrData*.text;
}
if (arrData*.type == "direction") {
var my_fmt:TextFormat = new TextFormat();
my_fmt.size = 12;
mc.txt.setTextFormat(my_fmt);
audio_direction._x = mc._width+30;
audio_direction._y = mc._y;
}
}
}
function CheckString(str) {
if (str == "" || str == undefined) {
return null;
} else {
return str;
}
}
mclListener.onLoadComplete = function(targetMC) {
};
mclListener.onLoadError = function(target_mc:MovieClip, errorCode:String, httpStatus:Number) {
imgCur++;
LoadImages();
trace("error:"+errorCode);
};
mclListener.onLoadInit = function(target_mc:MovieClip) {
//----------
if (target_mc._parent._name != "image_question") {
target_mc._parent._alpha = 80;
}
imgCur++;
LoadImages();
};
imgLoader.addListener(mclListener);
function LoadImages() {
if (imgCur<arrData.length) {
tmpName = "img_"+imgCur;
target = eval("image_"+arrData[imgCur].type+".image");
eval("image_"+arrData[imgCur].type+".image")._x = -10+((imgCur-1)*1);
if (arrData[imgCur].image !== null) {
imgLoader.loadClip(arrData[imgCur].image, target);
var pimg = Math.round((100*(imgCur+1))/arrData.length);
mcloading.bar.gotoAndStop(pimg);
} else {
imgCur++;
LoadImages();
}
} else {
//------
// loading images finished, load sounds
mcloading._visible = false;
LoadSounds();
}
}
//---------------
// answer actions
//-----------------
image_answer1.onRelease = text_answer1.onRelease=function () {
CheckAnswer("answer1");
};
image_answer2.onRelease = text_answer2.onRelease=function () {
CheckAnswer("answer2");
};
image_answer3.onRelease = text_answer3.onRelease=function () {
CheckAnswer("answer3");
};
image_answer4.onRelease = text_answer4.onRelease=function () {
CheckAnswer("answer4");
};
image_answer1.onRollOver = text_answer1.onRollOver=function () {
SetAlpha(image_answer1, text_answer1, 100);
};
image_answer2.onRollOver = text_answer2.onRollOver=function () {
SetAlpha(image_answer2, text_answer2, 100);
};
image_answer3.onRollOver = text_answer3.onRollOver=function () {
SetAlpha(image_answer3, text_answer3, 100);
};
image_answer4.onRollOver = text_answer4.onRollOver=function () {
SetAlpha(image_answer4, text_answer4, 100);
};
image_answer1.onRollOut = text_answer1.onRollOut=function () {
SetAlpha(image_answer1, text_answer1, 80);
};
image_answer2.onRollOut = text_answer2.onRollOut=function () {
SetAlpha(image_answer2, text_answer2, 80);
};
image_answer3.onRollOut = text_answer3.onRollOut=function () {
SetAlpha(image_answer3, text_answer3, 80);
};
image_answer4.onRollOut = text_answer4.onRollOut=function () {
SetAlpha(image_answer4, text_answer4, 80);
};
mcanswer.bg.useHandCursor = false;
mcanswer.bg.onRelease = function() {
};
mcanswer.Incorrect.Close.onRelease = function() {
mcanswer._visible = false;
};
mcanswer.Correct.Close.onRelease = mcanswer.Incorrect.Close.onRelease;
function SetAlpha(mc1, mc2, a) {
mc1._alpha = a;
var my_fmt:TextFormat = new TextFormat();
if (a == 100) {
my_fmt.color = 0x999999;
} else {
my_fmt.color = 0x535353;
}
mc2.txt.setTextFormat(my_fmt);
}
function CheckAnswer(ans) {
var answer = false;
var feedback = "";
for (i=0; i<arrData.length; i++) {
if (arrData*.status == "correct" && arrData*.type == ans) {
answer = true;
}
if (arrData*.type == ans) {
feedback = arrData*.feedback;
}
}
if (answer) {
mcanswer.Incorrect._visible = false;
mcanswer.Correct._visible = true;
mcanswer._visible = true;
} else {
mcanswer.Incorrect._visible = true;
mcanswer.Correct._visible = false;
mcanswer._visible = true;
mcanswer.Incorrect.txt.text = feedback;
}
}