1. การสร้างลูกกลมสีขาว ก่อนอื่น คุณเปิดโปรแกรมแฟลชขึ้นมา ให้เป็น as 3.0 มาที่ช่องใส่สคริป และกำหนดสคริปตามข้าพเจ้า ดังนี้
stop(); //เอาไว้หยุดเฟรมไว้ที่เฟรมที่ 1
var pick:MovieClip = new MovieClip(); //สร้างตัวแปรชื่อ pick ที่มีชนิดตัวแปรเป็นมูฟวี่คลิ๊ป ซึ่งเป็นการสร้างมูฟวี่คลิ๊ปขึ้นมาใหม่
pick.graphics.beginFill(0xff66ff); //pickนั้นใช้คำสั่งในหมวดกราฟฟิคซึ่งเป็นหมวดเฉพาะ เริ่มสร้างรูปร่าง กำหนดสีเป็นสี ชมพู
pick.graphics.drawCircle(50,50,10); //วาดวงกลม ตำแหน่ง x อยู่ที่ 50 pixel และ y = 50 pixel มีรัศมีออกจากจุดทั้ง 2 =10 pixel
pick.graphics.endFill(); //วาดเสร็จแล้ว
addChild(pick); //วางลงบนหน้าจอ
เอาล่ะครับ สำหรับคำสั่งที่เห็นนี้จะเป็นการวาดวงกลมสำหรับหิมะ ในคำสั่ง pick.graphics.beginfill ผมกำหนดสีให้เป็นชมพู เพราะพื้นมันขาวอยู่ ถ้าอยากเปลี่ยนสีอื่นก็ตามใจครับ รหัสสีดูได้จากเว็บสี หรืออาจจะเปิกโฟโต้ชอปดูก็ได้ โดยสีนั้น จะเป็นตัวเลขไม่ก็ตัวอักษร 6 ตัว ตามตำแหน่งดังภาพ
รหัสสีจากโปรแกรมแฟลช
รหัสสีจากโฟโต้ชอป
พอได้ทั้ง 6 ตัวแล้ว ในการกำหนดสี ให้เติม 0x ไว้ข้างหน้า เพื่อบอกเครื่องว่า นี่คือรหัสสีครับ
หลังจากนั้นก็สั่งให้สคริป วาดวงกลม และจบการวาด รวมถึง วางภาพที่วาดแล้วลงกระดานหรือ stage ครับ
ถ้าทำอย่างนี้แล้ว เราจะได้อะไรที่มีลักษณะหน้าตาแบบนี้
ครับ ในตอนนี้เราสร้างลูกกลมแทนหิมะขึ้นมาจากสคริปได้แล้ว ต่อจากนี้จะเป็นการสั่งให้มันเคลื่อนไหวแบบอัตโนมัตินะครับ
การเคลื่อนไหวของหิมะนั้น ไม่มีกฏเกณฑ์ แต่มันมีรูปแบบอยู่นั่นคือ ร่วงจากบนลงล่าง และขยับซ้ายขวาตามแรงลมและอากาศที่ต้าน พูดง่ายๆ หิมะมันไม่ได้ร่วงลงมาเป็นเส้นตรงซะทีเดียว ดังนั้น ก่อนอื่นเรามาทำความเข้าใจการร่วงของภาพในมูฟวี่คลิ๊ปกันก่อน
การที่หิมะร่วงในระบบความเป็นจริงหรือ 3 มิตินั้น เมื่อกลายเป็น 2 มิติที่มีแค่ความกว้างและยาวเท่านั้น เราจำเป็นต้องกำหนดมิติหนึ่งให้เป็นความสูงแทนมิติความสูงปรกติ โดยมากจะใช้แกน y เป็นความสูง ดังนั้น เมื่อหิมะร่วงในภาพสองมิติ นั่นหมายถึง ตำแหน่งในแกน y ของภาพนั้นจะเปลี่ยนไปเรื่อยๆ
ปรกติ เมื่อจุด origin หรือจุดที่ x และ y มีค่าเท่ากับ 0 อยู่มุมบนซ้าย ในการกำหนดตำแหน่งในควอตร์ซแร้นทซ์นี้ หรือควอเตอร์นี้ ค่า x จะเป็น + และค่า y จะเป็น - แต่โปรแกรมแฟลชนั้น แม้จุด origin ของโปรแกรมจะอยู่บนซ้ายเช่นกัน แต่ค่า y จะถูกกำหนดให้เป็นบวก ซึ่งต่างจากการคำนวนคณิตศาสตร์ปรกติ
ดังนั้น ในโปรแกรมแฟลช ถ้าเคลื่อนที่ไปในแกน x จากซ้ายไปขวา ค่า x จะเพิ่มขึ้น
ถ้าเคลื่อนที่ในแกน y จากบนลงล่าง ค่า y จะเพิ่มขึ้น
ถ้าไปตรงกันข้าม เครื่องหมายก็ตรงกันข้าม
ดังนั้น ถ้าต้องการให้ลูกกลม ร่วงจากบนลงล่าง ก็ต้องกำหนดให้ตำแหน่ง y ของลูกกลม มีค่าเพิ่มขึ้นเรื่อยๆ
การกำหนดให้หิมะร่วงจึงกลายเป็น
pick.y += 2; //หมายถึง ตำแหน่งของตัวแปร pick ในทิศทาง y ไม่ว่าจะมีค่าเท่าไร ก็จะเพิ่มขึ้น +2
เพื่อความเข้าใจได้ง่ายๆ ก็จะขอสรุปความรู้ดังนี้
ถ้าวัตถุ มีค่า x เพิ่มขึ้น จะเคลื่อนที่จากซ้ายไปขวา
ถ้าวัตถุเคลื่อนที่ในแนว x มีค่า x ลดลง จะเคลื่อนที่จากขวาไปซ้าย
ถ้าวัตถุเคลื่อนที่ในแนว y มีค่า y เพิ่มขึ้น จะเคลื่อนที่จากบนลงล่าง
ถ้าวัตถุเคลื่อนที่ในแนว y มีค่า y ลดลง จะเคลื่อนที่จากล่างขึ้นบน
แล้วมาต่อกันคราวหน้านะครับ
ไม่มีความคิดเห็น:
แสดงความคิดเห็น