Flash AS 3.0 – พื้นฐานการทำข้อสอบ, แบบทดสอบ แบบที่ 3 – การสุ่มคำถามและตัวเลือก

หายไปซะนานเลย วันนี้ขอเขียนต่อให้จบเลยละกัน โค้ดโปรแกรมก็คล้ายๆ กับบทความที่ผ่านมา สามารถเอาไฟล์จากบทความก่อนหน้านี้มาใช้ได้เลย จะได้ไม่ต้องวาดใหม่
บทความก่อนหน้านี้
แบบทดสอบ แบบที่ 1 – คำถามละเฟรม
แบบทดสอบ แบบที่ 2 – การใช้ Array และการใช้ไฟล์ XML เก็บคำถามคำตอบ
แบบทดสอบ แบบที่ 4 – สุ่มคำถามคำตอบ สองภาษา บันทึกคะแนน ส่งออกไฟล์

แบบที่ 3 : แบบทดสอบสุ่มคำถามและตัวเลือก

วิธีทำ
1. วาด (สามารถนำไฟล์จากแบบทดสอบแบบที่ 2 มาใช้ได้เลย)
1.1 เลเยอร์ชื่อ as – ไม่มีอะไร เอาไว้เขียนโค้ด
1.2 เลเยอร์ชื่อ txtError – ใช้เครื่องมือ Text Tool [T] เลือกเป็น Dynamic Text ตั้งชื่อ txtError
1.3 เลเยอร์ชื่อ choice – เป็นตัวเลือก กขคง เป็น Movie Clip ตั้งชื่อเรียงกันไป Ans0, Ans1, Ans2, Ans3
และข้อความของตัวเลือกใช้ Text Tool [T] เลือกเป็น Dynamic Text ตั้งชื่อ txtAns0,  txtAns1 …ถึง 3
1.4 เลเยอร์ชื่อ Question – ใช้เครื่องมือ Text Tool [T] เลือกเป็น Dynamic Text ตั้งชื่อ txtQuestion
1.5 เลเยอร์ชื่อ BG – เป็นภาพพื้นหลัง ซึ่งแล้วแต่เราจะวาด แล้วแต่จะตกแต่ง

ทั้งหมดให้วาดใส่ในเฟรมที่ 2
เมื่อเสร็จแล้วก็จะได้ประมาณนี้ …

2. เลเยอร์ as เฟรมที่ 1 – นำเข้าไฟล์ xml
หลังจากโหลดไฟล์ xml แล้วอาจจะนำข้อมูลไปเก็บไว้ในอาเรย์ก็ได้ (แต่ผมไม่ได้ทำนะ -.-)

โค้ด

stop();
//เฟรมแรกไว้กำหนดคำถาม คำตอบ หรือทำการโหลดไฟล์มาจากภายนอก
var NumberofQ:int = 5;// จำนวนคำถาม
var Qxml:XML = new XML();
var Qloader:URLLoader = new URLLoader();
var Qurl:URLRequest =new URLRequest("question.xml")
Qloader.load(Qurl);
Qloader.addEventListener(Event.COMPLETE, onComplete);
function onComplete(evt:Event):void{
Qxml = XML(evt.target.data);
nextFrame();
}

ไฟล์ xml – ไฟล์ไม่เหมือนที่ผ่านมา แก้ไขชื่อเล็กน้อย

<?xml version="1.0" encoding="UTF-8"?>
<!--ทดสอบการโหลดไฟล์ xml - zzzleepyinclass.blogspot.com-->
<Questions>
 <Question id="0"><!--ในส่วนของ id หมายถึงหมายเลขข้อ หรือรหัสของคำถาม-->
  <Detail>จระเข้เป็นหลานใคร ?</Detail><!--รายลำเอียดคำถาม-->
  <Choice><!--ตัวเลือก แล้วก็ไล่ๆ ลงไป-->
   <A>ไกรทอง</A>
   <B>จระเข้</B>
   <C>จักรยาน</C>
   <D>ชาละวัน</D>
  </Choice>
  <Ans>2</Ans>
 </Question>
 <Question id="1">
  <Detail>นกอะไรอยู่ในทะเล ?</Detail>
  <Choice>
   <A>นกกระจอก</A>
   <B>นกอินทรีย์</B>
   <C>นกนางนวล</C>
   <D>นกโจรสลัด</D>
  </Choice>
  <Ans>1</Ans>
 </Question>
 <Question id="2">
  <Detail>ผลไม้อะไรเปลือกแข็งที่สุดในโลก ?</Detail>
  <Choice>
   <A>ทุเรียน</A>
   <B>ผลไม้ดอง</B>
   <C>มะพร้าว</C>
   <D>ผลไม้กระป๋อง</D>
  </Choice>
  <Ans>3</Ans>
 </Question>
 <Question id="3">
  <Detail>เพลงแปดโมงเช้าวันอังคารร้องอย่างไร ?</Detail>
  <Choice>
   <A>แปดโมงเช้าวันอังคาร ถึงจะนานที่ผ่านมา</A>
   <B>จ้องมองเข็มนาฬิกา ช่วงเวลาครั้งสุดท้าย</B>
   <C>ประเทศไทยรวมเลือดเนื้อชาติเชื้อไทย</C>
   <D>คุันหูไม่รู้เป็นอะไร เอาสำลีมาปั่นก็ไม่หาย</D>
  </Choice>
  <Ans>2</Ans>
 </Question>
 <Question id="4">
  <Detail>ทำไมปลาจึงวางใข่ ?</Detail>
  <Choice>
   <A>เพราะปลาไม่มีมือถือไข่</A>
   <B>เพราะถึงฤดูกาลวางใข่</B>
   <C>เพราะถ้าโยนเดี๋ยวไข่แตก</C>
   <D>เพราะเมื่อยขอวางแปบนึง</D>
  </Choice>
  <Ans>0</Ans>
 </Question>
</Questions>

3. เลเยอร์ as เฟรมที่ 2 – สุ่มแสดงคำถาม
ตรงนี้คงไม่ขออธิบายอะไรมาก ผมก็ยังไม่ได้เก่งอะไร กว่าจะเขียนได้ก็มั่วอยู่นานเลย ถ้างงตรงไหนถามก็ได้คร้าบ : )
โค้ด

stop();
var Score:int = 0;//เก็บคะแนนที่ได้
var AnsRight:int = 0;//เก็บจำนวนข้อที่ถูก
var AnsWrong:int = 0;//เก็บจำนวนข้อที่ผิด
var CurrentQ:int = 0;//ข้อที่กำลังทำอยู
var QChoose:String = new String();
var tmpRigthAnsIs:int = new int();
var RigthAnsIs:int = new int();
var i:int = new int();
var tmpQuestionArray:Array = new Array();
//ใส่เลขข้อเข้าไปในอาเรย์
for (i = 0; i < NumberofQ; i++)
{
tmpQuestionArray[i] = i;
}
//ฟังก์ชันในการสุ่ม
function randomize( a : *, b : * ):int
{
return ( Math.random() > .5 ) ? 1 : -1;
}
//ทำการสุ่มอาเรย์คำถาม
tmpQuestionArray.sort(randomize);
NewQuestion();//เริ่มคำถาม
function NewQuestion()
{
CurrentQ++;
var tmpChoiceArray:Array = [0,1,2,3];
tmpChoiceArray.sort(randomize);//สุ่มตัวเลือกในอาเรย์;
var RandomedQ:int = new int();
var RandomChoice:int = new int();
QChoose = "";// เก็บว่าคำถามนั้น มีการเลือกคำตอบหรือยัง ตอนนี้ยัง
RandomedQ = tmpQuestionArray[0];//เลือกคำถามมา
tmpQuestionArray.splice(0,1);
//ตัดข้อนั้นทิ้งไป เพราะเลือกถามไปแล้ว;
txtQuestion.text = "ข้อที่ " + CurrentQ + ". " + Qxml.Question.(@id==RandomedQ).Detail;
tmpRigthAnsIs = Qxml.Question.(@id==RandomedQ).Ans;//นำข้อที่ถูกต้องมาเก็บไว้ก่อน
for (i=0; i<4; i++)
{
RandomChoice = tmpChoiceArray[i];
this["txtAns" + i].text = Qxml.Question.(@id==RandomedQ).Choice.children()[RandomChoice];
this["Ans" + i].buttonMode = true;
this["Ans" + i].addEventListener(MouseEvent.CLICK, onAns);
//ตรวจสอบว่าข้อที่ถูกตรงกับข้อที่สุ่มได้หรือไม่ ;
if (tmpRigthAnsIs == RandomChoice)
{
RigthAnsIs = i;
}
}
Btn_Next.addEventListener(MouseEvent.MOUSE_UP, onNext);
}
//เมื่อเลือกคำตอบ ข้อใดข้อหนึ่ง;
function onAns(evt:MouseEvent):void
{
if (QChoose != "")
{
this["Ans" + QChoose].gotoAndStop(1);
}
QChoose = (evt.target.name).slice(-1,4);//เลือกเอาเฉพาะอักษรตัวสุดท้าย
this["Ans" + QChoose].gotoAndStop(2);//เมื่อเลือกข้อใหนก็ให้วงข้อนั้น;
txtError.text = "";//เมื่อมีการเลือกคำตอบ ก็ไม่ต้องมีการแจ้งเตือน
}
//เมื่อกดปุ่ม ถัดไป
function onNext(evt:MouseEvent):void
{
var CorrectAns:String = new String(RigthAnsIs);
//ถ้ามีการเลือกคำตอบแล้ว
if (QChoose != "")
{
//ถ้าคำตอบที่เลือกตรงกับคำตอบที่ถูกต้อง
if (QChoose == CorrectAns)
{
Score++;//จำนวนคะแนน +1 ตรงนี้อาจจะเพิ่มตัวคูณก็ได้
AnsRight++;//จำนวนข้อถูก +1
}
else
{
AnsWrong++;//จำนวนการตอบผิด +1
}
//ถ้ายังไม่ถึงคำถามสุดท้ายให้แสดงคำถามต่อไป
if (CurrentQ < NumberofQ)
{
//ถ้ามีการวงกลมตัวเลือกใดอยู่ก็ลบออกซะ
if (QChoose != "")
{
this["Ans" + QChoose].gotoAndStop(1);
}
NewQuestion();
}
else
{
nextFrame();//ถ้าข้อที่ทำอยู่เป็นทำถามสุดท้ายให้ไปห้าสรุปผล
}
}
else
{
txtError.text = "กรุณาเลือกคำตอบก่อน";//แจ้งเตือนเมื่อยังไม่ได้เลือกคำตอบ
}
}

4. เลเยอร์ as เฟรมที่ 3 – สุ่มแสดงคำถาม
โค้ด

stop();
txtScore.text = String(Score);
txtRight.text = String(AnsRight);
txtWrong.text = String(AnsWrong);
Btn_New.addEventListener(MouseEvent.MOUSE_UP, RePlay);
function RePlay(evt:MouseEvent):void{
gotoAndStop(2);
}

เป็นอันเสร็จเรียบร้อย
ตัวอย่าง

Download
ในซิปจะมี 2 ไฟล์คือ xml อยู่ข้างนอก และ xml อยู่ข้างใน
Zzz