อนุบาลงาน ActionSctipt

โหไม่ได้เข้ามาแป๊บเดียวมีของเล่นใหม่ด้วย น่าสนุกจัง ยังไม่ว่างเลยติดไว้ก่อนค่ะ 

[คำถาม :]

เอาล่ะจ๊ะมาแรนด้อมง่ายๆกันด้วย random()
เราจะ แรนด้อม พิกัด _x _y และ สเกล เอาแค่นี้ก่อนง่ายๆ

- เปิดงานมา สัก 400 x 100
- สร้างปุ่มชื่อ _btn มาอันนึง
- สร้าง mc ที่ต้องการแรนด้อมมาอันนึงในที่นี้ตั้งชื่อว่า _mc
 
ใส่สคริปที่เฟรมแรกเลย

_btn.onRelease = function() {
   xPos = random(380)+10;
   yPos = random(80)+10;
   nscale = random(100)+20;
   _mc._x = xPos;
   _mc._y = yPos;
   _mc._xscale = nscale;
   _mc._yscale = nscale;
};

ทดสอบเลยยย 

<a href="http://img2.f0nt.com/flash/9ea76d2ef426857f59aa45f20fd99bcc.swf" target="_blank">http://img2.f0nt.com/flash/9ea76d2ef426857f59aa45f20fd99bcc.swf</a>


คำถาม :
ผมอยากจะแรนด้อม mc สัก 10 ตัวบน stage ด้วยการคลิกครั้งเดียว จะทำยังไง

ก็พิมพ์สคริปนี้ใส่ในปุ่ม 10 ชุด แล้วเปลี่ยนชื่อ mc เอา แบบนี้ไง 

_btn.onRelease = function() {
   xPos = random(380)+10;
   yPos = random(80)+10;
   nscale = random(100)+20;
   _mc._x = xPos;
   _mc._y = yPos;
   _mc._xscale = nscale;
   _mc._yscale = nscale;
        xPos = random(380)+10;
   yPos = random(80)+10;
   nscale = random(100)+20;
   _mc1._x = xPos;
   _mc1._y = yPos;
   _mc1._xscale = nscale;
   _mc1._yscale = nscale;
        xPos = random(380)+10;
   yPos = random(80)+10;
   nscale = random(100)+20;
   _mc2._x = xPos;
   _mc2._y = yPos;
   _mc2._xscale = nscale;
   _mc2._yscale = nscale;

._mc3
._mc4
.
._mc9
};

  ถูกต้องงงงงงง      เฮ้ยยย  ทำไมถึกแบบนั้นล่ะ  แบบนี้ถ้าอยากแก้ค่าอะไรสักหน่อย มิต้องไล่แก้กันตาลายเลยเรอะ 

อ้าวววว แล้วทำยังไงล่ะ 

เดี๋ยวมาเฉลย

+

[เราจะสร้าง function() ขึ้นมาใช้เอง]

มาเฉลยล่ะครับ 
คำตอบคือมีหลายวิธี แล้วแต่ว่าใครจะคิดได้ ไดนามิคกว่ากัน
แน่นอนทำแบบคำตอบถึกนั้นก็ทำได้ ง่ายด้วย แต่เวลาอยากจะแก้ไขค่าไอ้นู่นไอ้นี่ มันลำบากเกิน 

เราจะใช้อันนี้กัน แถ่นแทนแท้นนนนนนนนน

เราจะสร้าง function() ขึ้นมาใช้เอง
นอกเหนือจาก global function() ที่แฟลชมีให้ เราสามารถสร้างฟังก์ชั่นส่วนตัวขึ้นมาเองได้ง่ายๆ

ตัวอย่าง

function myFunc (){ // ประกาศสร้างฟังก์ชั่นชื่อ myFunc
      trace("hello F0nt");                     // ให้ฟังก์ชั่นนี้ เมื่อเรียกแล้วให้ output ว่า "hello F0NT"
};                           //จบการทำงานของฟังก์ชั่น

//ตัวอย่างการใช้ ใส่สคริปไว้ที่ปุ่ม

on(release){
_root.myFunc();
} //output ว่า "hello F0NT"

//หรือกหากใส่ที่เฟรมก็เรียกโดยไม่ต้องใส่ _root ก็ได้

_btn.onRelease=function(){
myFunc();
}; // output ว่า "hello F0NT"

ทีนี้เราจะเขียนแบบมีการส่งค่าเข้าไปด้วย

function myFunc (txt:String){ // ประกาศสร้างฟังก์ชั่นชื่อ myFunc(txt จะแทนค่าที่จะส่งเข้าไป ในที่นี้เราจะส่ง text จึงเป็น String)
      trace(txt);                     // ให้ฟังก์ชั่นนี้ เมื่อเรียกแล้วให้ output (ค่าที่ส่งเข้ามา)
};                           //จบการทำงานของฟังก์ชั่น

//ตัวอย่างวิธีใช้

_btn.onRelease=function(){
    myFunc("ทดสอบ ทดสอบ");  //ตัวอย่างเราส่งคำว่า "ทดสอบ ทดสอบ" เข้าไปให้ฟังก์ชั่น myFunc() ทำงาน
};   

           

ฟังก์ชั่นนี้ก็จะ output ค่าที่เราส่งเข้าไป  "ทดสอบ ทดสอบ"
*** ส่วนมากเราจะประกาศฟังก์ชั่นไว้ที่เฟรมแรกเลยครับเพื่อให้มีผมตั้งแต่เปิดงาน

งงไหมครับ ไม่งงนะ 

เอาอีกตัวอย่างง่ายๆ

function num_plus (num1:Number,num2:Number){ // ประกาศสร้างฟังก์ชั่น num_plus(เราจะส่งค่าตัวเลขเข้าไปสองค่าแทนด้วย num1,num2)
trace(num1+num2); // ให้เอาค่าที่ส่งเข้ามา้บวกกันแล้ว output
};

//ลองใช้โดย

_btn.onRelease=function(){
num_plus(10,20);         // ส่งค่า 10 กับ 20 เข้าไปให้ฟังก์ชั่น num_plus() ทำงาน
};
// ผล output  : 30

ทีนี้กรณีนี้ คือการ trace ดูเท่านั้น มองดีๆจะเห็นว่า ถ้าไม่ trace ออกมาดูค่าที่ส่งเข้าไปนั้นก็จะหายวับเข้ากลีบเมฆ

หากเราอยากใด้ค่านั้นคืนออกมา

จากตัวอย่างบน เราอยากได้ค่า 30 ที่บวกเสร็จแล้วเอามาใช้งาน
เราต้องให้ฟังก์ชั่นมันคืนค่าออกมาให้เราด้วย ...

return()

เราจะปรับสคริปใหม่นิหน่อยให้มันคืนออกมา

function num_plus (num1:Number,num2:Number){ // ประกาศสร้างฟังก์ชั่น num_plus(เราจะส่งค่าตัวเลขเข้าไปสองค่าแทนด้วย num1,num2)
return(num1+num2);// ให้เอาค่าที่ส่งเข้ามา้บวกกันแล้ว คืนค่าออกมา
};

//ทดสอบดู

_btn.onRelease=function(){
my_num = num_plus(10,20);         // ส่งค่า 10 กับ 20 เข้าไปให้ฟังก์ชั่น num_plus() ทำงาน แล้วคืนค่าออกมาส่งให้ my_num

trace(my_num)
};
// ผล my_num = 30

มีประโยชน์นะครับลองๆทำความเข้าใจครับ
ทีนี้เราจะเอามันมาสั่งแรนดอมครับ
จากตัวอย่างอันเดิมที่ถามว่า เราจะสั่ง mc ทั้งสิบตัวพร้อมกันยังไง

กรณีนี้ผมยังไม่ใช้ลูปพวก do while for ไว้หลังๆจะมาเขียนเรื่องลูป
ผมจะเขียนแบบนี้ครับ

function myFunction(mc:MovieClip){  //สร้างฟังก์ชั่นขึ้นมาหนึ่งอัน เราจะส่ง mc เข้ามาแรนด้อมค่าต่างๆในฟังก์ชั่นนี้กัน
   xPos = random(380)+10;                   //แรนดอมค่า _x
   yPos = random(80)+10;                   //แรนดอมค่า _y
   nscale = random(100)+20;             //แรนดอมค่า scale
   mc._x = xPos;                               //ส่งค่าแรนดอมตำแหน่ง _x ให้ mc ที่ส่งเข้ามา
   mc._y = yPos;                              //ส่งค่าแรนดอมตำแหน่ง _y ให้ mc ที่ส่งเข้ามา
   mc._xscale = nscale;                              //ส่งค่าแรนดอม xscale ให้ mc ที่ส่งเข้ามา
   mc._yscale = nscale;                              //ส่งค่าแรนดอม yscale ของ ให้ ที่ส่งเข้ามา
};

_btn.onRelease = function() { // เราก็ส่ง _mc ทั้งสิบตัวเข้าไปฟังก์ชั่น
   myFunction(_mc1);
   myFunction(_mc2);
   myFunction(_mc3);
   myFunction(_mc4);
   myFunction(_mc5);
   myFunction(_mc6);
   myFunction(_mc7);
   myFunction(_mc8);
   myFunction(_mc9);
   myFunction(_mc10);
};

จากตัวอย่างเดิม เราสร้าง mc ขึ้นมาอีก 9 ตัว ใส่ชื่อให้ครบ
แล้วลองดูครับ

<a href="http://img2.f0nt.com/flash/1fbcf7dbd30a34642d4f7684f90a2aaa.swf" target="_blank">http://img2.f0nt.com/flash/1fbcf7dbd30a34642d4f7684f90a2aaa.swf</a>

จริงๆใ้ช้ลูปรันเอาก็ได้ง่ายกว่า แต่เอาแบบนี้ก่อนครับ ถึกๆดี

คราวหน้าเรื่อง การเปรียบเทียบ if else ครับ

[mc:MovieClip]

  ขอบคุณครับน้าแอ๊ด+



สงสัยท่อนนี้ครับ

โค้ด:

function myFunction(mc:MovieClip){]

ตรง mc:MovieClip นี่คือ
"ข้าขอประกาศสร้าง MovieClip ขึ้นมาจากอากาศ ในตัวแปรชื่อ mc" ใช่ไหมครับ
มีอะไรบ้างครับที่สร้างได้จากอากาศ

[mc:MovieClip]

ขอบคุณครับน้าแอ๊ด+



สงสัยท่อนนี้ครับ

โค้ด:

function myFunction(mc:MovieClip){]

ตรง mc:MovieClip นี่คือ
"ข้าขอประกาศสร้าง MovieClip ขึ้นมาจากอากาศ ในตัวแปรชื่อ mc" ใช่ไหมครับ
มีอะไรบ้างครับที่สร้างได้จากอากาศ

ผมก็มั่วๆเอาตาม help น่ะครับ มันเขียนมาเป็นแพทเทิรนแบบนี้ ก็เลยใช้เรื่อยมา

แต่ว่ายังไม่เชิงว่าเป็นเช่นนั้นมั๊งครับ
คือมันแค่แทนค่าที่จะส่งผ่านเข้าไปน่ะครับ ไม่ได้สร้าง mc ขึ้นมา
ประมาณว่า "ไอ้ค่าที่จะส่งเข้าไปในฟังก์ชั่นเนี่ย คือประเภทอะไรบอกๆไว้หน่อยจะได้จองหน่วยความจำถูก"

(เดาเอาล้วนๆ) 

สมมุติ
function xxx(mc:MovieClip,num:Number,txt:String){
mc._x = num
trace(txt)
}

อย่างฟังก์ชั่นนี้ผมจะส่งค่าเข้าไป 3 แบบ สมมุติ xxx(mc_1,500,"สำเร็จ")

ฟังก์ชั่นก็จะเอาค่าที่ส่งไปทำงานตามที่เราตั้งไว้คือ
ทำ mc_1._x = 500
trace("สำเร็จ")

 

ไม่รู้ตอบตรงป่าว
แต่ที่แน่ๆ ยังไม่เคยลองส่งค่าไม่ตรงประเภทสักที
เช่นเราประกาศว่า mc:MovieClip แต่ดันส่งตัวแปรประเภทตัวเลขแทน มันจะเป็นยังไงน้อ 

[มังกร]

เหนื่อยมั้ยคะ
มาบวกให้กำลังใจนะคะ แต่ยังไม่มีปัญญาเรียนง่ะ

แล้วเวลาประกาศไอ้เจ้า MovieClip ขึ้นมานี่
เราต้องมี mc ที่เป็นก้อนๆ จริงๆ อยู่ไหมครับ แล้วใส่ชื่อเอาด้วยการประกาศประเภท
หรือว่ามาจากอากาศก็ได้

[มังกร]

ไม่ต้องมีครับ เหมือนประมาณว่าสร้างท่อรูปกระต่าย เอาไว้ส่งกระต่าย( Rabbit Object )เข้ามา

ไม่สามารถส่งสิงโต ( Lion Object )เข้ามาได้ เพราะจะเออเร่อ

โดยที่สร้างท่อกระต่ายเนี้ย ไม่ต้องมีกระต่ายมาจริงๆ ก็ได้

เพราะเรามี แม่แบบกระต่าย (Rabbit Class) มาเป็นแบบอยู่แล้ว

ตามนั้นเลยครับ

ค่าที่อยู่ในวงเล็บหลังชื่อฟังก์ชั่น เขาเรียกว่า parameter

ซึ่งเป็นการบอกว่า การเรียกใช้ฟังก์ชั่นนี้ ต้องส่งค่าอะไรเข้ามาบ้าง ถึงจะใช้งานได้

มันจะไม่ใช่การสร้าง แต่จะเป็นการอ้างถึงครับ

ไม่ต้องมีครับ เหมือนประมาณว่าสร้างท่อรูปกระต่าย เอาไว้ส่งกระต่าย( Rabbit Object )เข้ามา

ไม่สามารถส่งสิงโต ( Lion Object )เข้ามาได้ เพราะจะเออเร่อ

โดยที่สร้างท่อกระต่ายเนี้ย ไม่ต้องมีกระต่ายมาจริงๆ ก็ได้

เพราะเรามี แม่แบบกระต่าย (Rabbit Class) มาเป็นแบบอยู่แล้ว

 

อ่านไปอ่านมาแล้วเริ่มมึน


แต่เข้าใจกว่าคนที่เคยสอนเยอะเลยค่ะ 

 

ติดตามอยู่นะครับผม  +

[ถ้า .... ให้ ทำงานต่อไป แต่ถ้า .... ให ้ทำอันนี้ ถ้า .... ไม่ใช่เลย ให้ ทำอันนี้]

ถ้า .... ให้ ทำงานต่อไป
แต่ถ้า .... ให ้ทำอันนี้
ถ้า .... ไม่ใช่เลย ให้ ทำอันนี้

 

ว่าด้วยเรื่องการเปรียบเทียบ กำหนดเงื่อนไข

อีกหนึ่งสิ่งที่สำคัญและจะทำให้โปรแกรมของเราฉลาดขึ้น
เหมือนเป็นยามคอยเฝ้าจับผิดสิ่งที่เราสั่งไว้ 

 

if(...){    //ถ้า ...
                   // ให้ทำอะไรก็ว่าไป
}; //จบการทำงาน

//ตัวอย่างเช่น

if(n==1){  //ถ้า  n มีค่าเท่ากับ 1 จริง
    trace(n);  //ให้ทำงาน ที่เราสั่งไว้คือ output ค่า n ออกมา
};  //จบการทำงาน

ทีนี้มาเพิ่มความวุ่นวายกัน    จากอันบน แค่ "ถ้า ... จริง ให้ทำงาน"
ด้วยการเพิ่มเงื่อนไขอีกว่า "ถ้าไม่ใช่ หรือไม่จริง ให้ทำอันนี้แทน"
ด้วยการ...

if(...){ //ถ้า ... จริง
         //ทำอะไรก็ว่าไป
}else{               //ถ้าไม่ใช่ หรือ ไม่จริง ให้ทำอันนี้แทน
        //ทำอะไรก็ว่าไป
}; จบการทำงาน

เห็นว่าเราจะเพิ่ม else เข้ามาเสนอหน้าด้วย
การใช้งานก็ง่ายๆ เช่น

if(n==1){         //ถ้า  n มีค่าเท่ากับ 1 จริง
    trace(n);        //ให้ทำงาน ที่เราสั่งไว้คือ output ค่า n ออกมา
}else{         //แต่ถ้าไม่ใช่ หรือไม่จริง คือ n ไม่ใช่ 1 ให้ทำงานอันนี้แทน
       n=10;        //ให้ทำงาน ที่เราสั่งไว้คือ ในที่นี้เราจะใส่ค่าให้ n = 10;
      trace(n);           //แล้ว output ค่า n  ออกมาคือ 10
};        //จบการทำงาน

ไม่งงนะ 

ทีนี้เพิ่มเงื่อนไขเข้าไปอีก ด้วยการมี "แต่ถ้า ... ให้ทำอันนี้แทน" ด้วยการเพิ่มเงื่อนไข else if(...)

if(n==1){         //ถ้า  n มีค่าเท่ากับ 1 จริง
    trace(n);        //ให้ทำงาน ที่เราสั่งไว้คือ output ค่า n ออกมา
}else if(n==2){         //แต่ถ้า n คือ 2 ให้ทำงานอันนี้
    n=5;           //  ให้ทำงาน ที่เราสั่งไว้คือ ในที่นี้เราจะใส่ค่าให้ n = 5
}else{         //แต่ถ้าไม่ใช่เลย หรือไม่จริงทั้งหมด คือ n ไม่ใช่ 1 n ไม่ใช้ 2 ให้ทำงานอันนี้แทน
       n=10;        //ให้ทำงาน ที่เราสั่งไว้คือ ในที่นี้เราจะใส่ค่าให้ n = 10;
      trace(n);           //แล้ว output ค่า n  ออกมาคือ 10
};        //จบการทำงาน

เอาล่ะนะ  มาหนักกระโหลกกันล่ะ

ผมจะสั่งให้ มูวี่คลิปตัวนึง ให้มันบวกตำแหน่งตัวเองเรื่อยๆๆๆๆๆๆ
แต่เมื่อสุดขอบเขตงาน ก็จะเจอเงื่อนไขว่า "ถ้ามรึงวิ่งไปจนสุดขอบนะ ให้วิ่งกลับไปด้านตรงข้ามเลย"
ถ้าสุดอีก"ก็กลับไปฝั่งตรงข้ามอีก" วนไปวนมา
ทีนี้มาถึงเรื่อง ทำยังไงให้มีการรันตลอดเวลา
เราจะใช้

mc.onEnterFrame = function(){
                         // ทำอะไรก็ว่าไป
}

โดย ตัวนี้จะทำการ รันตลอดเวลา การทำงานนับเป็น วินาที/เฟรมเรท ที่เราตั้งไว้
สมมุติเราตั้งเฟรมเรทไว้ 25 สคริปนี้จะรัน วินาทีละ 25 รอบ
ฉะนั้นคิดให้ดีในการใช้ เพราะจะกิน cpu ใช้ได้เลยล่ะ    (ไม่โหดร้ายขนาดนั้นหรอกครับ  ขู่ให้กลัวเฉยๆ)

เอาตัวอย่างไปดูก่อน
แบบนี้คือ
บวกค่าตำแหน่งตัวเองตลอดเวลา ทั้ง _x และ _y
เมื่อพิกัดใด เกินขอบเขตที่กำหนด
ให้เปลี่ยนตัวที่บวกเป็นค่าลบซะ ก็จะวิ่งกลับด้านแล้ว เราก็จะได้สคริปถึกๆแบบนี้มา

- สร้างงานสัก 350 x 130
- สร้างลูกกลมๆเล็กๆ ตั้งชื่อว่า _mc
- ก้อปสคริปไปแปะโลด

i = 10;
iy = 5;
_root._mc.onEnterFrame = function() {  //สั่งทำงานตลอดเวลา
   _mc._x += i;                               //เพิ่มค่าตำแหน่งตัวเองทุกๆรอบ
   _mc._y += iy;                             //เพิ่มค่าตำแหน่งตัวเองทุกๆรอบ
   if (_mc._x>330) {                       //ถ้าค่า._x มากกว่าที่กำหนดไว้เมื่อไร
      i = (i*-1);                          //ให้เอาค่าบวกตำแหน่งเปลี่ยนเป็นลบซะ ก็จะกลับด้านกัน
   }
   if (_mc._x<15) {                         // เหมือนๆกันแล้วลองดู
      i = (i*-1);
   }
   if (_mc._y>110) {
      iy = (iy*-1);
   }
   if (_mc._y<15) {
      iy = (iy*-1);
   }
};

<a href="http://img2.f0nt.com/flash/37bd9e7b95aeace1e22066fa77ac3e76.swf" target="_blank">http://img2.f0nt.com/flash/37bd9e7b95aeace1e22066fa77ac3e76.swf</a>

ยังติดตามอ่านอยู่นะคะ ชอบๆ แต่ยังไม่ได้ลองทำเลยอันหลังๆ ถ้าทำได้แล้วสัญญาจะเอามาส่งค่ะ  แอบมา + เพิ่ม