หน้าที่ของคอนโทรล Command Button คอนโทรล Command Button ใช้สาหรับบรรจุคาสั่งเพื่อดาเนินการกับข้อมูล และคาสั่งควบคุม การทางานของโปรแกรม ซึ่งจะขาดไม่ได้สาหรับโปรแกรมที่ทางานบน เครื่องที่ใช้ระบบปฏิบัติการ GUI(Graphic User Interface)
การจัดวางคอนโทรล Command Button ลงบนฟอร์ม ขั้นตอนมีดังต่อไปนี้ 1. คลิกเมาส์ที่ปุ่ม Command Button ที่แถบเครื่องมือ 1 ครั้ง(ปุ่มจะยุบลง)
1 2
3 2. เลื่อนเมาส์ไปยังพื้นที่ฟอร์ม คลิกเมาส์ค้างไว้วาดลงบนฟอร์ม แล้วปล่อยปุ่มเมาส์ 3. ย้าย หรือ ปรับขนาดของ Command Button ตามความเหมาะสม
คุณสมบัติ (Properties) ที่สาคัญของคอนโทรล Command Button Properties Name Caption Font BackColor Enable Visible ToolTipText Style Picture
รายละเอียด ชื่อของคอนโทรลที่ใช้อ้างถึงในโปรแกรม ข้อความที่แสดงบนตัวคอนโทรล แบบอักษรที่แสดงบนตัวคอนโทรล สีของคอนโทรล อนุญาต/ไม่อนุญาต ให้คอนโทรลทางาน
ให้แสดงหรือไม่แสดง คอนโทรลในขณะโปรแกรมทางาน แถบข้อความที่แสดงขณะเลื่อนเมาส์ไปทับที่คอนโทรล รูปแบบของคอนโทรล(Standard = ธรรมดา,Graphical = แบบรูปภาพ) กาหนดรูปภาพที่แสดงบนคอนโทรล Command Button หมายเหตุ ตัวอักษรในตารางที่ไม่เป็นตัวหนาคือค่า Properties พื้นฐานสามารถกาหนด ได้เหมือนกับคอนโทรลทั่วไป ซึ่งในบทนี้จะเสนอเฉพาะที่จาเป็นและนิยมใช้ กับ คอนโทรล Command Button เท่านั้น
เหตุการณ์ (Event) สาคัญที่เกิดขึ้นกับคอนโทรล Command Button Event Click DblClick GotFocus LostFocus
รายละเอียด เมื่อคลิกเมาส์ที่คอนโทรล เมื่อดับเบิลคลิกเมาส์ที่คอนโทรล เมื่อคอนโทรลได้รับการโฟกัส(ถูกเลือก) เมื่อคอนโทรลไม่ได้รับการโฟกัส(ไม่ถูกเลือก)
หมายเหตุ การกาหนด Event สามารถทาได้โดยการดับเบิลคลิกเมาส์ที่คอนโทรล จะปรากฏช่องให้เลือกอยู่ ด้านขวาบน ของหน้าต่างรหัสโปรแกรม
ความสามารถ (Method) ที่สาคัญของคอนโทรล Command Button Method Refresh Zorder SetFocus
รายละเอียด สั่งให้ปรับปรุงการแสดงผลคอนโทรล จัดลาดับการแสดงผลซ้อนกันของคอนโทรล (0 อยู่บนสุด 1 อยู่ล่างสุด) สั่งให้คอนโทรลได้รับการโฟกัส(ถูกเลือก)
หมายเหตุ การกาหนด Method สามารถทาได้ที่หน้าต่างการเขียนรหัสโปรแกรมเท่านั้น
ตัวอย่างการกาหนด Properties ที่สาคัญของคอนโทรล Command Button ขั้นตอนมีดังนี้ 1. วาดคอนโทรล Command Button ลงบนฟอร์ม 1 คอนโทรล
1
2. คลิกเลือกที่หน้าต่าง Properties (อยู่บริเวณด้านขวาของหน้าจอ)
2
3. กาหนด Properties ของคอนโทรล Command Button ดังนี้ 3.1. กาหนดหัวข้อ Name(ชื่อคอนโทรล) พิมพ์ CmdOK
3.1
3.2. กาหนดหัวข้อ Caption (ข้อความที่แสดง) พิมพ์ ตกลง
3.2
3.3. กาหนดหัวข้อ Enable(อนุญาต/ไม่อนุญาต ให้คอนโทรลทางาน) โดย 3.3.1 คลิกในหน้าต่าง Properties หัวข้อ Enable เลือก False (ไม่อนุญาต ให้ทางาน)
3.3.1
3.3.2 กดแป้นพิมพ์ F5 (Run โปรแกรม หรือคลิก ที่แถบเครื่องมือด้านบน) 3.3.3 จะพบว่าปุ่ม จะไม่ทางาน(เป็นสีจางและคลิกไม่ยุบลง) 3.3.4 หยุดการทางานของโปรแกรม คลิก ที่แถบเครื่องมือด้านบน 3.3.5 กาหนด Properties หัวข้อ Enable เป็น True (อนุญาต ให้คอนโทรลทางานได้) 1.1. กาหนด Visible (ให้แสดงหรือไม่แสดง คอนโทรลในขณะโปรแกรมทางาน) โดย 3.4.1 คลิกในหน้าต่าง Properties หัวข้อ Visible เลือก False
3.4.1
3.4.2 กดแป้นพิมพ์ F5 (Run โปรแกรม หรือคลิก ที่แถบเครื่องมือด้านบน) 3.4.3 จะปรากฏเพียงฟอร์มว่างเปล่าเนื่องจาก ปุ่ม ถูกซ่อน 3.4.4 หยุดการทางานของโปรแกรม คลิก ที่แถบเครื่องมือด้านบน 3.4.5 กาหนดค่า Visible เป็น True (แสดงคอนโทรลในขณะโปรแกรมทางาน) 1.2. กาหนด ToolTipText (แถบข้อความที่แสดงขณะเลื่อนเมาส์ไปทับที่คอนโทรล) โดย
3.5.1
3.5.1 คลิกในหน้าต่าง Properties หัวข้อ ToolTipText พิมพ์ นี่คือคาแนะนาของปุ่มนี้
3.5.2 กดแป้นพิมพ์ F5 (Run โปรแกรม หรือคลิก
3.5.2
ที่แถบเครื่องมือด้านบน)
นี่คือคาแนะนาของปุ่มนี้
3.5.3 เลื่อนเมาส์พอยเตอร์ไปทับบนปุ่ม รอประมาณ 2 วินาที จะปรากฏแถบข้อความ นี่คือ คาแนะนาของปุ่มนี้ บริเวณพอยเตอร์ของเมาส์ 3.4.4 หยุดการทางานของโปรแกรม คลิก ที่แถบเครื่องมือด้านบน 3.4. กาหนด Style(รูปแบบของคอนโทรล) และ Picture(รูปที่แสดงบนปุ่ม) 3.6.1 ต้องกาหนด Properties หัวข้อ Style เป็น 1-Graphical ก่อน
3.6.2
3.6.3
3.6.4
3.6.2 กาหนด Properties หัวข้อ Picture คลิกที่ 3.6.3 คลิกเลือกภาพที่จะนามาแสดงบนปุ่มที่ C:\Program Files\Microsoft Visual Studio\Common\Graphics\Icons\Computer\
หรือ C:\Program Files\Microsoft Visual Studio\Common\Vss\ หรือ เลือกไปยังที่เก็บภาพ ตามความต้องการ ตัวอย่างเลือกภาพชื่อ Folder จาก C:\Program Files\Microsoft Visual Studio\Common\Vss\ 3.6.4 คลิกเลือกภาพที่ต้องการ แล้วคลิกปุ่ม 3.6.5 จะปรากฏภาพที่เลือกบนปุ่ม
3.6.5
ตัวอย่างการกาหนด(Event) ที่สาคัญของคอนโทรล Command Button ขั้นตอนมีดังนี้ 1. วาดคอนโทรล Command Button จานวน 1 คอนโทรล และกาหนด Properties หัวข้อ Name เป็น CmdHello
2. กาหนดข้อความที่แสดงบนคอนโทรล ที่ Properties หัวข้อ Caption เป็น Hello
3. กาหนดคาสั่งตามเหตุการณ์ให้กับคอนโทรลดังนี้ 3.1. เมื่อเกิดเหตุการณ์ Click บนคอนโทรล CmdHello 3.1.1. ดับเบิลคลิกที่คอนโทรล CmdHello จะปรากฏหน้าต่างรหัสโปรแกรม(Code) 3.1.2. คลิกเลือกเหตุการณ์ Click 3.1.2
3.1.3
3.1.3. พิมพ์คาสั่ง MsgBox “Hello! Hello! สวัสดี” 3.2. กดแป้นพิมพ์ F5 (Run โปรแกรม หรือคลิก ที่แถบเครื่องมือด้านบน) 3.3. ทดลองคลิกเมาส์ที่ปุ่ม จะปรากฏผลดังรูป
3.4. หยุดการทางานของโปรแกรม คลิก
ที่แถบเครื่องมือด้านบน
ตัวอย่างการกาหนด Method ของคอนโทรล Command Button มีขั้นตอนดังต่อไปนี้ 1. สร้าง Project ใหม่ คลิกที่ เมนู File > New Project เลือก Standard EXE 2. วาด คอนโทรล Command Button จานวน 2 คอนโทรล
2
3. กาหนดให้เมื่อเกิดเหตุการณ์ Command1 ถูกคลิก ให้คอนโทรล Command2 ถูกเลือก(SetFocus) โดยมี ขั้นตอนดังนี้ 3.1. ดับเบิลคลิก Command1 จะปรากฏหน้าต่างรหัสโปรแกรม ให้เลือกเหตุการณ์ Click 3.1
3.2
3.2. พิมพ์คาสั่ง Command2.SetFocus 4. กาหนดให้เมื่อเกิดเหตุการณ์ Command2 ถูกคลิก ให้คอนโทรล Command1 ถูกเลือก(SetFocus) โดยมี ขั้นตอนดังนี้ 4.1. ดับเบิลคลิก Command2 จะปรากฏหน้าต่างรหัสโปรแกรม ให้เลือกเหตุการณ์ Click 4.1
5. 6. 7. 8.
4.2. พิมพ์คาสั่ง Command1.SetFocus Run โปรแกรม สังเกตกรอบเส้นประล้อมที่ Command1 (ถูกโฟกัส) เมื่อคลิกเมาส์ที่ Command1 กรอบเส้นประล้อมที่ Command2 (ถูกโฟกัส) เมื่อคลิกเมาส์ที่ Command2 กรอบเส้นประล้อมที่ Command1 (ถูกโฟกัส) หยุดการทางานของโปรแกรม คลิก ที่แถบเครื่องมือด้านบน
ตัวอย่างการใช้ Command Button กับคอนโทรลพื้นฐานมาสร้าง โปรแกรม 1. สร้าง Project ใหม่ คลิกที่เมนู File > New Project เลือก Standard EXE 2. วาดคอนโทรล Label จานวน 2 คอนโทรล กาหนด Properties หัวข้อ Caption เป็น รหัส, ชือ่ ตามลาดับ 3. วาดคอนโทรล Text Box จานวน 2 คอนโทรล กาหนด Properties หัวข้อ Text ลบข้อความออกให้ เหลือเพียงช่องว่าง 4. วาดคอนโทรล Command Button จานวน 6 คอนโทรล กาหนด Properties หัวข้อ Caption เป็น ล็อก ,ปลดล็อก,ซ่อน,แสดง,แสดงข้อมูล,ปิดโปรแกรม ตามลาดับ 5. จัดวางคอนโทรลตามรูปตัวอย่าง
6. กาหนดคาสั่งตามเหตุการณ์ให้กับคอนโทรลดังนี้ 6.1. เมื่อเกิดเหตุการณ์ Click บนคอนโทรล Command1 (
)
6.1.1. ดับเบิลคลิกที่คอนโทรล Command1 ( (Code)
) จะปรากฏหน้าต่างรหัสโปรแกรม
6.1.2
6.1.3
6.1.2. คลิกเลือกเหตุการณ์ Click 6.1.3. พิมพ์คาสั่ง Text1.Locked = True 6.2. เมื่อเกิดเหตุการณ์ Click บนคอนโทรล Command2 ( 6.2.1. ดับเบิลคลิกที่คอนโทรล Command2 ( (Code)
) )จะปรากฏหน้าต่างรหัสโปรแกรม
6.2.2
6.2.3
6.2.2. คลิกเลือกเหตุการณ์ Click 6.2.3. พิมพ์คาสั่ง Text1.Locked = False 6.3. เมื่อเกิดเหตุการณ์ Click บนคอนโทรล Command3 (
)
6.4. 6.4.1. ดับเบิลคลิกที่คอนโทรล Command3 ( (Code)
)จะปรากฏหน้าต่างรหัสโปรแกรม
6.3.2
6.3.3
6.4.2. คลิกเลือกเหตุการณ์ Click 6.4.3. พิมพ์คาสั่ง Text2.Visible = False 6.5. เมื่อเกิดเหตุการณ์ Click บนคอนโทรล Command4 ( 6.5.1. ดับเบิลคลิกที่คอนโทรล Command4 ( (Code)
) )จะปรากฏหน้าต่างรหัสโปรแกรม
6.4.2
6.4.3
6.5.2. คลิกเลือกเหตุการณ์ Click 6.5.3. พิมพ์คาสั่ง Text2.Visible = True 6.6. เมื่อเกิดเหตุการณ์ Click บนคอนโทรล Command5 ( 6.6.1. ดับเบิลคลิกที่คอนโทรล Command5 ( (Code)
) )จะปรากฏหน้าต่างรหัสโปรแกรม
6.5.2
6.5.3
6.6.2. คลิกเลือกเหตุการณ์ Click 6.6.3. พิมพ์คาสั่ง Msgbox Text2.Text 6.7.เมื่อเกิดเหตุการณ์ Click บนคอนโทรล Command6 ( 6.7.1. ดับเบิลคลิกที่คอนโทรล Command6 ( โปรแกรม(Code)
) )จะปรากฏหน้าต่างรหัส
6.6.2
6.6.3
1.1.1. คลิกเลือกเหตุการณ์ Click 1.1.2. พิมพ์คาสั่ง Unload Me (หรือพิมพ์ End ก็ได้) 2. Run โปรแกรม พิมพ์ รหัส และชื่อ ในกล่องข้อความ 3. คลิกเมาส์ที่ ปุ่ม 3.1. จะไม่สามารถแก้ไขข้อความในช่อง รหัส ได้ 3.2. จะสามารถแก้ไขข้อความในช่อง รหัส ได้ 4. คลิกเมาส์ที่ ปุ่ม 4.1. 4.2. 5. คลิกที่ปุ่ม 6. คลิกที่ปุ่ม
กล่องข้อความหลัง ชื่อ จะไม่ปรากฏ กล่องข้อความหลัง ชื่อ จะปรากฏ จะปรากฏหน้าต่างแสดง ชื่อ(อยู่ในกล่องข้อความที่ 2) โปรแกรมจะหยุดการทางาน