หน้าแรก
สาระการเรียนรู้ สาระความรู้อื่นๆ จุดประสงค์รายวิชา ติดต่อผู้ดูแล

การสร้าง popup menu ด้วยการวาด layer
:: วิธีการทำ ::
1. ให้เราทำการ New File หรือทำการเปิดไฟล์ที่เราต้องการทำ Popup Menu ขึ้นมาก
2. ทำการสร้าง Menu ที่จะเป็นจุดเริ่มต้นของเมนูที่เมื่อเรานำเมาส์มาวางที่เมนูนั้นแล้วจะเกิดเมนูย่อยแสดงออกมา ในตัวอย่างนี้พี่ใช้เมนูซึ่งเป็นรูปภาพ


3. จากนั้นให้เราทำการวาดเลเยอร์ลงไปใกล้ ๆ กับเมนูที่เราทำการสร้างจากข้อ 2 ที่ผ่านมา และทำการตกแต่งเลเยอร์นี้ตามต้องการ เช่น ในตัวอย่าง พี่ทำการแทรก Table ลงไปเป็น 1 col 2 row เพื่อเป็นเมนู และทำการใส่สีเขียวและเพิ่มไอคอนลงไปหน้าชื่อเมนู เป็นต้น


4. จากนั้นให้เรากำหนดค่าเริ่มต้นของ layer ที่เราสร้างให้เป็นแบบ hidden จาก properties (กำหนดตรง Vis) และกำหนดชื่อของ layer นี้ด้วย ในตัวอย่างพี่กำหนดชื่อ u3629 เลเยอร์นี้ว่า popup สังเกตดูจากรูป ด้านล่างนี้

5. เมื่อเราทำการซ่อนเลเยอร์เป็นที่เรียบร้อยแล้ว (hidden) ให้เราทำการ คลิ๊กเลือกไปที่เมนูที่เราสร้างขึ้นจากข้อ2 แล้วจากนั้นให้ทำการเปิด Panel ที่ชื่อว่า Behaviors ขึ้นมา (Main Menu ->Window -> Behaviors) เมื่อเราทำการเปิดหน้าต่างดังกล่าวขึ้นมาแล้ว ให้เราทำการคลิ๊กไปที่เครื่องหมายบวก (+) ดังรูป แล้วให้เราทำการ เลือกไปที่เมนูที่ชื่อว่า Show-Hide Layer ดังรูป

6. จากนั้นโปรแกรมจะทำการเปิดหน้าต่างขึ้นมาให้เรากำหนดค่า ดังรูป
ที่หน้าต่าง Show-Hide Layer นี้ ในขั้นตอนแรกให้เราเลือกไปที่ชื่อ Layer ที่เราได้ทำการตั้งชื่อไว้จากข้อที่ 4 แล้วให้เลือกไปที่ปุ่ม Show ดังรูป จากนั้นให้เราทำการคลิ๊กที่ OK ไปก่อน 1 ครั้ง


7. หลังจากนั้นให้เราทำซ้ำข้อที่ 5 อีกครั้ง คือการเลือกไปที่เมนู Show-Hide Layers อีกครั้ง จากนั้นให้เราทำซ้ำข้อที่6 อีกครั้ง แต่ครั้งนี้ให้เรากำหนดเป็น Hide โดยการกดเลือกไปที่ปุ่ม Hide แทน
8. เมื่อเราได้ทำการกำหนดค่าต่าง ๆ จากข้อที่ 5-7 เป็นที่เรียบร้อยแล้ว ให้เรามาดูที่ Behaviors Panel เราจะเห็นEvent เกิดขึ้นมา 2 เมนู ดังรูป


ที่หน้าต่าง Behaviors นี้ให้เราสังเกตที่ Events นะค่ะว่า...เราต้องมี Event เป็น OnMouseOut สำหรับการกำหนดHide ให้เลเยอร์ และต้องมี Event onMouseOver สำหรับการ Show เลเยอร์ หากใครมี Events อื่น ๆ ที่ไม่ใช่ 2แบบนี้ให้ทำการเปลี่ยน Event นะค่ะ (อ่านเรื่องการเปลี่ยน Event ได้ที่หน้า Articles นะค่ะ)
9. ที่นี่เราก็จะได้ popup menu ตามที่เราต้องการแล้ว แต่ยังไม่สมบูรณ์สักเท่าไหร่ ให้เราทำการเพิ่มเติมคุณสมบัติอีกดังนี้
- จากข้อ 5 ถึงข้อที่ 8 แต่คราวนี้ให้เราทำการ คลิ๊กเลือกไปที่ Layer ที่เราสร้างขึ้น แล้วทำการกำหนดค่าอื่น ๆเหมือนที่ผ่านมาตั้งแต่ข้อ 5 - 8
10. เราก็จะได้ POPUP Menu ตามที่เราต้องการ แถมเรายังจะสามารถปรับปรุงอื่น ๆ ได้ตามที่เราต้องการเช่นเราอาจจะแทรกไอคอนลงไปในเมนูของเราก็สามารถกระทำได้เช่นเดียวกัน

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Top