ทำปุ่มเคลื่อนไหวใส่เว็บด้วย Flash MX (ตอนที่ 2)

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


          รูปที่ 1 Insert Keyframe

ตอนนี้เรากำลังทำงานอยู่ในส่วนของ Movie Clip ให้คลิ้กขวาที่ เฟรมที่ 2 แล้วเลือก Insert Keyframe ดังรูปที่ 1 เพื่อทำการเพิ่มช่วงเวลาในการทำตัวอักษรเคลื่อนไหว


                 รูปที่ 2

จากนั้นคลิ้กขวาที่ช่องที่ 3 และเลือก Insert Keyframe และทำอย่างนี้ไปจนถึงช่องที่ 5 เพื่อเพิ่มข้อมูลในแต่ละช่อง จะได้ดังรูปที่ 2

                  รูปที่ 3

ต่อมาทำการลบข้อมูลในช่องที่ 2 และ 4 ออก โดยการคลิ้กที่ช่องนั้นแล้วกดปุ่ม delete จะได้ดังรูปที่ 3

            รูปที่ 4 ชื่อของปุ่ม

อาจจะมีคนแปลกใจว่าเราจะลบข้อมูลในช่องที่ 2 และ 4 ออกแล้วทำไมถึงต้อง Insert Keyframe ด้วย นั่นก็เพราะว่าถ้าคุณไม่เพิ่มข้อมูลมาใส่ในช่องนั้นก่อนแล้วถ้าคุณลบข้อมูลทั้งหมดจะหายไปเลย ลองดูก็ได้นะคะ ไม่ว่ากันค่ะ ลองกด enter ดูก็จะเห็นว่าตัวอักษรมันกะพริบได้ ทีนี้เราก็กลับไปทำงานที่ส่วนของ Button กันต่อคราวนี้ชื่อที่เราตั้งไว้ก็ได้ใช้แล้วล่ะค่ะโดยการคลิ้กที่ชื่อ Button นั้น ดังรูปที่ 4

สังเกตดูที่ timeline นะคะจะมีสถานะของปุ่มแสดงออกมาดังรูปที่ 5


        รูปที่ 5 สถานะของปุ่ม


         รูปที่ 6 Insert เลเยอร์

ให้คุณคลิ้กขวาที่ช่อง Hit ซึ่งโดยปกติแล้วช่องนี้จะไว้สำหรับใส่เสียงให้กับปุ่มแต่ถ้าไม่ใส่ก็ไม่เป็นไรหรอกค่ะ เลือก Insert Keyframe เพื่อเพิ่มช่วงของข้อมูล ต่อมาทำการเพิ่มเลเยอร์เพื่อสร้าง หน้ากากเป็นการเพิ่มพื้นที่ของปุ่มดังรูปที่ 6

จากนั้นให้ดึงเลเยอร์ที่ 2 ลงมาอยู่ใต้เลเยอร์ 1 คลิ้กที่ช่อง Up ดังรูปที่ 7


                  รูปที่ 7


           รูปที่ 8

กดคลิ้กเพื่อไม่ใส่สีในช่องของกรอบ ดังรูปที่ 8

คลิ้กที่รูปสีเหลี่ยมที่ ทูลบาร์วาดรูปสี่เหลี่ยมลงใน stage ต่อมาคลิ้กที่เมนู Insert > Convert to Symbol เลือก Movie Clip ดังรูปที่ 9


                   รูปที่ 9


                 รูปที่ 10

              รูปที่ 11

กดปุ่ม OK ตรงนี้ไม่ต้องใส่ชื่อก็ได้นะคะ เพราะว่าไม่ต้องใช้อ้างอิงกับส่วนอื่นๆ ต่อมาดูที่ส่วนของ Properties ในช่อง Color เลือก Alpha เป็น 0% ดังรูปที่ 10 จะได้ดังรูปที่ 11

ข้อมูลจาก : http://www.arip.co.th
โดย มรกต อุ่นเสรี