E-Book วิชาการเขียนโปรแกรมโดยใช้เครื่องมือกราฟิกโหมด รหัสวิชา 2204-2107

ผังงาน (Flowchart) หมายถงึ การเขียนอธบิ ายขนั้ ตอนวธิ กี ารทำงานในลักษณะของ
สัญลกั ษณ์ทเ่ี ปน็ รูปภาพ ประโยชน์ของผังงานใช้สำหรับชว่ ยในการพัฒนาลำดับขั้นตอนการแก้ปญั หา
เนอ่ื งจากผงั งานเปน็ การอธบิ ายข้ันตอนวธิ กี ารทำงานในลักษณะของรูปภาพ ทำให้สามารถเหน็ ลำดบั
ของขนั้ ตอนวิธีการทำงานได้ชดั เจนกว่าการอธิบายข้นั ตอนวิธีการทำงานในลักษณะข้อความ เมื่อ
ลักษณะของปัญหาทต่ี ้องการแก้ไขมคี วามซับซ้อนมากขน้ึ ความยงุ่ ยากในการเขยี นอธิบาย
ขัน้ ตอน หรือวิธีการทำงานจะมีมากข้นึ การใช้ผงั งานเพื่อช่วยสำหรับการหาขัน้ ตอนวธิ ีการทำงาน จะ
ทำใหส้ ามารถเขยี นอธบิ ายข้ันตอนวิธกี ารทำงานในลกั ษณะของขอ้ ความได้สะดวกย่งิ ขึน้

เมอื่ ได้พลังงานท่ใี ช้สำหรบั การแก้ไขปัญหาท่ตี ้องการแล้ว จากนัน้ จงึ ทำการพัฒนาโปรแกรม
จากผังงานใหเ้ ป็นการอธิบายข้นั ตอนวธิ ีการทำงานในลกั ษณะข้อความ หรอื รหัสเทยี ม และโปรแกรม
ภาษาคอมพิวเตอรท์ ต่ี ้องการไดต้ ามลำดับ

ประโยชนข์ องการเขยี นผังงาน

ผังงานนอกจากจะชว่ ยในการพฒั นาลำดบั ขัน้ ตอนการทำงานการแก้ไขปญั หายังมีประโยชน์
ต่อดงั น้ี

1. ชว่ ยลำดบั ข้ันตอนการทำงานไดง้ ่าย ไม่สับสนเข้าใจได้ง่าย
2. เมื่อเกดิ ข้อผดิ พลาดช่วยในการตรวจสอบ และแก้ไขงานได้ง่าย
3. ชว่ ยใหก้ ารดดั แปลง แก้ไข ทำได้อยา่ งสะดวกและรวดเร็ว
4. ช่วยให้ผู้อ่ืนสามารถศึกษา การทำงานของโปรแกรมได้อยา่ งง่าย และรวดเร็วมากข้ึน
5. สามารถเรียนร้แู ละเขา้ ใจผังงานได้ง่าย เพราะพังงานเปน็ การสือ่ ความหมายด้วยภาพ ทำ

ใหง้ า่ ยและสะดวกต่อการพิจารณา ลำดับขัน้ ตอนในการทำงานดีกว่าการบรรยายเป็น
ตวั อกั ษร

ข้อจำกดั ของผังงาน

ผูเ้ ขียนโปรแกรมบางคนไม่นยิ มการเขยี นผงั งานก่อนท่จี ะเขียนโปรแกรม เพราะจะทำให้
เสยี เวลาในการเขยี นเปน็ รปู ภาพหรือสญั ลักษณ์ต่างๆโดยข้อจำกดั ของผังงาน ดงั น้ี

1. ผงั งานเป็นการส่ือความหมายระหวา่ งบคุ คล ต่อบคุ คล มากกวา่ ท่ีจะส่ือความหมาย
ระหว่างบุคคลกับเคร่ืองคอมพวิ เตอร์ เพราะผงั งานระบบไมข่ ึ้นอยู่กบั ภาษาคอมพวิ เตอร์
ภาษาใดภาษาหนึ่ง ทำให้เคร่ืองคอมพิวเตอร์ไม่สามารถรบั และเขา้ ใจว่าภายในผงั งานนนั้
ต้องการให้ทำอะไร

2. บางครง้ั เมื่อพิจารณาจากผังงานระบบ จะไม่สามารถทราบไดว้ ่า ข้นั ตอนการทำงานใด
สำคัญกว่ากนั เพราะทกุ ๆขนั้ ตอน จะใชร้ ูปภาพหรือสญั ลักษณ์ในลกั ษณะเดยี วกนั

3. การเขยี นผังงานเปน็ การสิน้ เปลืองงบประมาณ และเวลา เพราะจะต้องใชก้ ระดาษและ
อปุ กรณ์อื่นๆ ประกอบการเขียนภาพ บางครัง้ การเขียนผงั งานอาจจะต้องใช้กระดาษ
มากกว่า 1 แผ่น ท้ังทีก่ ารอธบิ ายงานเดยี วกันแต่ใชเ้ นอ้ื ทเ่ี พียง 3-4 บรรทัดเทา่ นั้น

4. การเขยี นผังงานจะมีขนาดใหญ่ ถ้าโปรแกรมทีพ่ ัฒนาเป็นงานใหญ่ ทำให้ผงั งานระบบ
แลดูไมค่ ล่องตัว และถ้ามีการปรบั เปล่ียนผงั งานจะทำได้ยากบางครั้งอาจจะตอ้ งเขียนผัง
งานขึ้นใหม่

5. ผงั งานจะบอกข้ันตอนการปฏิบัติงานวา่ เป็นลำดับอยา่ งไร ปฏิบตั งิ านอะไรแต่จะไม่ระบุ
ให้ทราบวา่ ทำไมจึงต้องเปน็ ลำดับและต้องปฏิบัติงานอยา่ งน้ัน

6. ภาษาคอมพิวเตอร์ทีใ่ ช้กนั ในปจั จบุ นั ผังงานไม่สามารถแทนลกั ษณะคำส่งั และภาษาได้
ชัดเจนตรงไปตรงมา

ลกั ษณะการเขยี นผังงานทีด่ ี

1. ทุกผงั งานต้องมจี ุดเรม่ิ ตน้ และจดุ สิ้นสุดเพยี งจดุ เดยี วเท่านั้น
2. ทกุ สญั ลักษณ์ของผงั งานต้องมีลูกศรชที้ ศิ ทางเขา้ และลกู ศรชี้ทศิ ทางออกอยา่ งละ 1

แหง่ ยกเวน้ สญั ลักษณ์จุดเริม่ ตน้ สญั ลกั ษณ์จุดสิน้ สุด สัญลักษณ์ตัดสนิ ใจ และสัญลกั ษณ์
จดุ ต่อ
3. สัญลกั ษณ์จดุ เร่ิมต้นมเี ฉพาะลูกศรช้ที ิศทางออก สญั ลักษณ์จดุ สนิ้ สดุ มีเฉพาะลูกศรชที้ ิศ
ทางเขา้
4. สัญลักษณ์การตดั สินใจมลี ูกศรชี้ทศิ ทางเข้า 1 ทิศทาง มีลูกศรช้ที ิศทางออก 2 ทิศทาง
คอื กรณีทีผ่ ลท่ีไดจ้ ากการตัดสินใจเป็นจรงิ และกรณที ี่ผลท่ีไดจ้ ากการตดั สินใจเปน็ เทจ็
5. ทิศทางของลำดับขั้นตอนการทำงาน นยิ มเขียนจากบนลงล่างหรอื จากซ้ายไปขวา
6. เส้นของลูกศรทีใ่ ช้บอกทิศทางของลำดับข้ันตอนวิธกี ารทำงาน ไมค่ วรเขียนตัดกันหรือ
ทบั กัน
7. ไม่ควรเขยี นเส้นของลูกศรเพ่ือทำการเชื่อมโยงลำดับขั้นตอนที่อยู่ห่างกนั มา หากจำเปน็
ควรใช้สัญลักษณ์จดุ ต่อแทน
8. การเขียนผงั งานในส่วนของการกำหนดค่าหรือการคำนวณคา่ นิยมใชเ้ ครื่องหมายลูกศร
แทน การใช้เครื่องหมายเทา่ กับ เช่น MAX <— 100 (หมายถึง ค่า MAX มคี ่า 100) ,X
<— (หมายถึงคา่ X มีคม่ เท่ากบั

สญั ลักษณ์ในการเขียนผงั งาน

สญั ลักษณใ์ นการเขยี นผังงาน ( Flowchart) มีหลายชนิด แตล่ ะชนิดจะมีความหมายในการ
ใชง้ านท่ีต่างกัน สามารถอธิบายสัญลกั ษณต์ ่างๆได้ดงั น้ี



ตวั อยา่ งการแสดงผังงาน

ตัวอย่างผังงานที่ 1 แสดงการเดินทางไปทำงาน
☆ เริม่
☆ เดินทางจากบ้านไปยังป้ายรถเมล์
☆ ตรวจสอบเวบาท่ีไปถึงรถเมล์

▪ หากไปถึงก่อน 7:30 น. จะน่งั รถเมลไ์ ปทำงาน
▪ หากไปถงึ หลงั เวลา 7:30 น.จะน่ังมอเตอร์ไซรบั จ้างไปทำงาน
☆ เดนิ ทางถงึ ท่ีทำงาน
☆ จบการทำงาน

ตวั อย่างผงั งานท่ี 2 การคำนวณผลรวมของเลขตั้งแต่ 1 ถึง N

☆ เริม่ การคำนวณ

☆ รบั คา่ N จากผู้ใช้

☆ กำหนดค่า ผลรวม (Sum) เป็น 0 และคา่ l เปน็ 1

☆ ตรวจสอบค่า l ว่ามีค่ามากกวา่ N หรอื ไม่

▪ หาก l มีคา่ มากกวา่ N แสดงผลรวม และจบการทำงาน

▪ หาก l มีค่านอ้ ยกวา่ N
¤ เพิม่ คา่ l ลงในผลรวม
¤ เพิม่ คา่ ของ l ข้นึ มา 1
¤ ตรวจสอบค่า l และ N ใหม่อีกคร้งั

แผนภมู โิ ครงสรา้ ง

เป็นเคร่ืองมอื สำหรบั การออกแบบการเขยี นโปรแกรมแบบมอดูล โดยจะมีการแบง่ โปรแกรม
ใหญ่ๆออกมาเป็นมอดลู ยอ่ ยๆ และชว่ ยจดั การความสมั พันธ์ระหว่างมอดลู ยอ่ ยๆ มีการออกแบบโดย
ใชว้ ธิ ีจากบนลงลา่ ง (Top-down technique)

จากตวั อยา่ งจะมีการแบ่งโปรแกรมที่ใชใ้ นการคดิ คา่ เฉลย่ี ออกเปน็ 4 มอดลู
โดยมีมอดลู หลกั คอื Calculate Average ท่ีอยู่ตำแหนง่ บนสดุ และมอดลู หลกั นี้ประกอบดว้ ยมอดลู
ย่อยอีก 3 มอดูล ท่เี หลอื ซง่ึ ทำหน้าทีส่ ง่ และรบั ข้อมลู ท่ีใช้ในการคำนวณคา่ เฉล่ยี

ใบงาน 3.1

คำชีเ้ เจง ข้นั ตอนการปฏบิ ตั ิบัตรกจิ กรรม
ใหว้ เิ คราะหพ์ ฤติกรรมของผเู้ รยี นในวันท่มี าโรงเรยี น โดยเขยี นเป็นแผนผงั Flow Chart ตัง้ แต่ตนื่

นอนตอนเช้า ปฏิบตั ิภารกิจประจำวนั จนกระทั่งเข้านอนและบันทกึ ลงในท่วี ่างดา้ นลา่ ง
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………

ส่ิงท่ีได้รับจากการปฏบิ ตั ิกิจกรรม
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………

………………………………………………………………………………………………………………………………………………
…………………………

ใบงานท่ี 3.2
คำชแี้ จง ข้ันตอนการปฏบิ ตั ิกิจกรรม

ใหผ้ ู้เรยี นคิดเมนูอาหารมาหน่ึงชนิด แลว้ เขยี นรหสั จำลอง (Pseudo Code) ต้ังแต่การเลือกซื้อ
วัตถดุ ิบจนกระทั่งทำอาหารออกมาเป็นจานพร้อมรับประทาน
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………

สิง่ ท่ีไดร้ บั จากการปฏิบัตบิ ตั รกจิ กรรม
……………………………………………………………………………………………………………………………….……………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………...........................................................................................................
..........................



ใบงานที่ 3.3
คำชแี้ จง ขน้ั ตอนการปฏบิ ตั ิกจิ กรรม

ใหผ้ ้เู รยี นเขยี นผังงาน Flow chart การตัดเกรดรายวิชาคอมพวิ เตอร์ จากคะแนนที่เป็นตวั เลข
เป็น เกรด A,B,C,D,F, หรือ 4,3,2,1,0 ของโรางเรียนท่ีผู้เรยี นเรยี นอยู่
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………

สิง่ ทีไ่ ด้รับจากการปฏิบัตบิ ตั รกจิ กรรม
……………………………………………………………………………………………………………………………….……………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………................................................................................................... ........
..........................



ใบงานที่ 3.4

คำชีแ้ จง จงพิจารณาคำถามแต่ละข้อและเติมคำตอบท่ีถูกตอ้ งลงในชอ่ งวา่ งต่อไปน้ี

1. การสอบวชิ าคอมพิมเตอร์ ถา้ คะแนนเต็ม 100 คะแนน พูดไดค้ ะแนนตง้ั แต่ 50 คะแนนข้ึนไป

ถึงจะสอบผ่าน จากข้อความต่อไปนี้ถ้าเขียนFlow Chart จะตรงกบั รปู แบบในขอ้ ใด

ก.แบบลำดับ ข.แบบไม่ลำดบั

ค.แบบทางเลือก ง.แบบทำซ้ำ

2. 1. เรม่ิ ต้น จากรูปเปน็ การออกแบบโปรแกรมในขอ้ ใด

2.รับคา่ ปีเกิดของคณุ คือ ก. Pseudo Code

3.คำนวณ ปีปจั จุบัน-ปเี กดิ ข. Flow Chart

4.แสดงค่า อายุของคุณคือ… ค. Structure Chart

5.จบการทำงาน ง. Code Program

3. Start input a จากรปู เปน็ การออกแบยโปรแกรมในข้อใด
end input b ก. Pseudo Code
input c ข. Flow Chart
n = (a+b+c)/3 ค. Structure Chart
display n ง. Code Program

4. รปู แบบคำส่งั ในข้อใดท่ีมีการตรวจสอบเงอื่ นไขจนกว่าจะตรงกันจึงหยดุ การทำงาน
ก.แบบไม่ลำดบั ข.แบบลำดับ
ค.แบบทางเลือก ง.แบบทำซ้ำ

5. ขอ้ ใดตอ่ ไปนใี้ ช้รปู แบบอัลกอริทมึ แบบวนซำ้
ก. การเปรยี บเทียบความสูงของนกั เรยี น 2 คน
ข. การรบั คะแนนแลว้ ออกเกรดผลการเรียน
ค. การหาค่าเฉลีย่ คะแนนนักเรยี น
ง. การคำนวณหาเงนิ ทอนในการซ้อื ของ

6. สญั ลกั ษณน์ ี้ เป็นสัญลักษณท์ ่ีใช้ในทำอะไรในการออกแบบการเขยี นโปรแกรม
ก. เป็นสัญลกั ษณ์ทางเลอื ก ข.เป็นสัญลกั ษณเ์ รมิ่ ตน้ /สน้ิ สุด

ค.เป็นเสน้ ทางการดำเนินการ ง.เป็นสญั ลกั ษณใ์ นการทำคำสั่ง
7. สญั ลกั ษณ์ในขอ้ ใดเปน็ สญั ลกั ษณ์ทางเลอื กของการเขียน Flow Chart

ก. ข.
ค. ง.
8. สัญลกั ษณใ์ ดเปน็ คำสัง่ ที่ใชใ้ นการเขียน Flow Chart
ก. ข.
ค. ง.
9. สญั ลักษณน์ เ้ี ป็นสัญลักษณ์ทใ่ี ช้ทำอะไรในการออกแบบการเขยี นโปรแกรม
ก.Manual input
ข.Display
ค.Document
ง.input/output
10. ถา้ ตอ้ งการเขยี น Flow Chart ในการแสดงผลออกทางเครื่องพิมพ์ต้องใชส้ ัญลักษณใ์ นข้อใด
ก. ข.
ค. ง.

แบบประเมนิ ผลการเรียนรู้หนว่ ยที่ 3
ตอนที่ 1 จงเลือกคำตอบท่ถี ูกทส่ี ุดเพียงข้อเดียว

1. ขอ้ ใดควรปฏิบตั ิเปน็ อนั ดบั แรกในการออกแบบโปรแกรม

ก. วเิ คราะห์ปัญหา ข. เขยี นอัลกอริทมึ

ค. เขียน Flow Chart ง.เขยี น Pseudo Code

2. ในการวเิ คราะห์ปญั หาในการเขียนโปรแกรมคอมพวิ เตอร์ ควรจะพจิ ารณาสิง่ ใดเปน็ อนั ดับ

แรก

ก. ขอ้ มูลท่ีใชท้ ัง้ หมด ข. ข้อมลู จากผลลัพธ์

ค. ข้อมูลการประมวลผล ง. ขอ้ มูลจากแผนกอ่ืนๆ

3. เครือ่ งมือใดท่ใี ช้ในการออกแบบโปรแกรม

ก.การเขยี นโปรเเกรม Edit ข.การเขียนโค้ดโปรแกรมจรงิ

ค.เครอื่ งคอมพวิ เตอร์ ง.การเขยี นอลั กอริทึม

4. อลั กอริทึมในข้อใดท่ใี ชส้ ัญลักษณใ์ นการเขยี นเพ่ือออกแบบโปรแกรม

ก.Pseudo Code ข.Flow chart

ค.Structure chart ง.code Program

5. การออกแบบในข้อใดท่ีใชภ้ าษาที่ผู้อ่านสามารถเขา้ ใจได้งา่ ย

ก.Pseudo Code ข.Flow chart

ค.Structure chart ง.code Program

6. ขอ้ ใดเป็นจดุ เด่นของการออกแบบโปรแกรม แบบ Structure chart

ก.ใช้สญั ลกั ษณ์ในการออกแบบ

ข.ใช้ภาษาองั กฤษในการออกแบย

ค.ใชภ้ าษาไทยที่เขา้ ใจไดง้ า่ ย

ง.ใช้การแบง่ ออกเป็นมอดูลย่อยๆจากใหญไ่ ปเล็ก

7. การเลอื กโปรแกรมภาษาทีเ่ หมาะสมในการเขียนโปรแกรมจะอยใู่ นขั้นตอนใดในการเขยี น

โปรแกรมคอมพิวเตอร์

ก. การวิเคราะห์ปญั หา ข. การออกแบบโปรแกรม

ค. การเขยี นโปรแกรม ง. การทดสอบโปรแกรม

8. สง่ิ ท่ไี ดร้ บั จากการทำเอกสารประกอบโปรแกรมคือข้อใด

ก. เพื่อให้ออกแบบโปรแกรมได้งา่ ยข้นึ

ข. เพ่ือชว่ ยวเิ คราะหป์ ัญหาในการเขียนโปรแกรม

ค. เพ่อื ใหเ้ ขา้ ใจปญั หาของการทำงาน

ง. เพือ่ ใหใ้ ชง้ านโปรแกรมได้ง่าย

9. การทำงานของโปรแกรมทีเ่ ขียนขึ้นมาจะทำงานได้ถูกต้องหรอื ไม่ ขึ้นอยู่กับขน้ั ตอนใด

ก. การวิเคราะหป์ ญั หา

ข. การออกแบบ
ค. การทดสอบโปรแกรม
ง. การบำรุงรักษาโปรแกรม
10. รูปแบบของอลั กอริทึมในข้อใดที่มคี วามซับซอ้ นน้อยท่สี ดุ
ก. แบบไม่ลำดับ
ข. แบบลำดับ
ค. แบบทางเลอื ก
ง. แบบทำซ้ำ

ตอนที่ 2 จงตอบคำถามต่อไปน้ี
1. การเขยี นโปรแกรมคอมพิวเตอร์มีขน้ั ตอนอย่างไรบา้ ง
……………………………………………………………………………………………………………………………….……………
………………………………………………………………………………………………………………………………………………
…………….………………………………………………………………………………………………………………………………
…………………….………………………………………………………………………………………………………………………
…………………………….………………………………………………………………………………………………………………
…………………………………….
2. จงสรปุ สาระสำคัญของคำวา่ "อัลกอรทิ ึม"
……………………………………………………………………………………………………………………………….……………
………………………………………………………………………………………………………………………………………………
…………….………………………………………………………………………………………………………………………………
…………………….………………………………………………………………………………………………………………………
…………………………….………………………………………………………………………………………………………………
…………………………………….
3. อธิบายลกั ษณะของอลั กอริทึมดงั ตอ่ ไปนี้ แบบลำดบั แบบทางเลือก และแบบทำซ้ำ
……………………………………………………………………………………………………………………………….……………
………………………………………………………………………………………………………………………………………………
…………….………………………………………………………………………………………………………………………………
…………………….………………………………………………………………………………………………………………………
…………………………….………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
…………………………………………
4. การเขยี นอลั กอริทมึ มหี ลักการปฏบิ ตั อิ ยา่ งไรบ้าง
……………………………………………………………………………………………………………………………….……………
………………………………………………………………………………………………………………………………………………
…………….………………………………………………………………………………………………………………………………
…………………….………………………………………………………………………………………………………………………
…………………………….………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………

………………………………………………………………………………………………………………………………………………
………………………………………………

5. จงเขียน Flow Chart โดยเลอื กรปู แบบจากอัลกอริทมึ แบบลำดับ แบบทางเลือก หรือแบบทำซ้ำ
มา 1 รูปแบบ
……………………………………………………………………………………………………………………………….……………
………………………………………………………………………………………………………………………………………………
…………….………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
……………………………….………………………….…………………………………………………………………………………
……………………………………….……………………………………………………………………………………………………
……………………………………………….

หนว่ ยท่ี 4 โปรแกรม Visual Basic
แนวคดิ

การเขียนโปรแกรมระบบปฏิบัติการ GUI โดยใช้โปรแกรม Visual Basic เป็นที่นิยม
แพรห่ ลายเนอื่ งจากมกี ารใช้งานที่งา่ ย และมปี ระสิทธิภาพ โปรแกรมได้จดั เตรียมเคร่ืองมือและสภาวะ
แวดลอ้ ม ในการใช้งานได้อย่างเหมาะสม มคี วามยืดหย่นุ โดยผู้พฒั นาโปรแกรมสามารถกำหนดสภาวะ
แวดลอ้ มเองได้
สาระการเรียนรู้

◇ การใชง้ านของโปรแกรม Visual Basic

◇ การเปดิ โปรแกรม Visual Basic
◇ การสร้าง project ใหม่ และเรียก project เดิมขึน้ มาใชง้ าน
◇ การบันทึก Form และ project
◇ การออกจากโปรแกรม
◇ การกำหนดสภาวะแวดล้อมของโปรแกรม Visual Basic
◇ การใช้เครอ่ื งมอื Toolbra
◇ การใช้เครอื่ งมือ ToolBox

◇ การใชห้ น้าต่าง Project Explorer
◇ การใช้ Form Designar
◇ การใชห้ น้าตา่ ง Properties Window
◇ การกำหนด Properties ให้กับ Form
◇ การเพิม่ และลบ Form ออกจาก Project
◇ การส่งั ใหโ้ ปรแกรมทำงาน (Run Program)
ผลการเรยี นรู้ท่คี าดหวัง
¤ อธิบายการใบเงานของโปรแกรม Visusl Basic ได้
¤ เปิดโปรแกรมVisual Basic เพือ่ ใช้งานได้
¤ สรา้ ง Project ใหม่ และเรียกวา่ Project เดิมขึน้ มาใบ้งานได้
¤ บนั ทกึ Form และ Project ได้ ¤ ออกจากโปรแกรมได้
¤ กำหนดสภาวะแวดลอ้ มของโปรแกรม Visusl Basic ได้
¤ ใช้เคร่ืองมือ Toolbar ได้ ¤ ใช้เครอ่ื มอื ToolBox ได้
¤ ใช้หนา้ ตา่ ง Project Explorer ได้
¤ ใช้ Form Designer ได้
¤ ใชห้ นา้ ตา่ ง Properties Window ได้
¤ กำหนด Properties ใหก้ ับ Project ได้

¤ เพ่มิ และลบ Form ออกจาก Project ได้
¤ สง่ั ใหโ้ ปรแกรมทำงาน (Run Program)

การใชง้ านของโปรแกรม Visual Basic
Visual Basic เปน็ โปรแกรมบนระบบปฏิบตั กิ าร GUI ทม่ี ี ผูค้ นนยิ มนำมาใช้ในการพฒั นาเป็น

โปรแกรมประยุกตส์ ำหรับงานด้านต่างๆ ด้วยคุณสมบัติที่ใช้งานง่ายและมีความยืดหยุ่นสงู เครื่องมือท่ี

ใช้ประกอบในการพัฒนาโปรแกรมมีจำนวนมาก โดยมีชุดคำสั่งมาสนับสนุนการทำงานเพิ่มมากขึ้น มี
เครื่องมือ Control ไว้สำหรับช่วยในการออกแบบโปรแกรมหน้าจอที่ติดต่อกับผู้ใช้แบบกราฟิก
Graphic user Interface (GUI) ทำให้มีการออกแบบหน้าจอไดง้ ่ายและรวดเร็ว การเขียนโปรแกรมก็
ทำได้ง่ายๆโดยการเขียนแบบ Event Driven Programming เป็นการกำหนดให้โปรแกรมทำงานเมือ่
มีเหตกุ ารณ์
(Event) เกิดขึ้นซึ่งโปรแกรมได้จัดการในการกำหนดเหตุการณต์ ่างๆให้แล้ว เพียงให้ผู้ใชเ้ ลือกมาใชใ้ ห้
ถูกต้อง เชน่ เมอ่ื มีการคลิกทปี่ ุม่ คำนวณแลว้ โปรแกรมจะทำการคำนวณให้

โปรแกรม Visual Basic จะมองเครื่องมือหรือ Control ที่โปรแกรมเตรียมไว้ให้เป็นวัตถุ
(Object) ชิ้นหนึ่งซึ่งมีคุณสมบัติที่แตกต่างกันไม่ว่าจะเป็น form Textbox Label Picture Box ใน
แต่ละ Object สามารถกำหนดและแก้ไขคุณสมบัติของ Object ได้โดยตรง ในแต่ละ Object จะมี
คุณสมบตั ิ (Properties) และเมธอดท่เี หมือนกนั หรอื แตกตา่ งกันได้

โดยคุณสมบัติ (Properties) ของวัตถุ (Object) นั้นหากเทียบเป็นคุณสมบัติของรถยนต์ก็
ได้แก่ สี รนุ่ ย่ีหอ้ เป็นต้น และจะมีลกั ษณะเปน็ คำนาม

เมธอด (Method) เป็นคำสั่งให้โปรแกรมทำตามเมธอดที่ได้กำหนดไว้ในแต่ละวัตถุ
(Object) มีลกั ษณะเป็นคำกริยาหรอื การกระทำ เช่น เคล่ือนยา้ ย การแสดง การซ่อน เปน็ ตน้

วิธีการเขียน Code จะมีการแบ่งออกเป็นส่วนเรียกว่า Procedure ซี่งเป็นชุดคำสั่งที่ให้ทำ
การตอบสนองการกระทำของผ้ใู ช้ตามทไ่ี ด้โปรแกรมเอาไว้

หนังสือเล่มนี้จะใช้โปรแกรม Visual Basic Express 2010 ประกอบการอธิบายโดยใน
เนอ้ื หาตอ่ ไปนีจ้ ะใชต้ วั ยอ่ VBExpress 2010 แทน Visual Basic Express 2010

ความสามารถของโปรแกรม Visual Basic
ความสามารถของโปรแกรม visual Basic มดี งั น้ี
1. ไดพ้ ฒั นาให้สามารถสรา้ งโปรแกรมไดง้ า่ ยขึน้
2. มคี วามเรว็ ในการทำงานมากกว่าภาษาเบสิกรุ่นกอ่ น
3. สามารถใช้งานร่วมกับฐานข้อมูลและแหล่งข้อมูลอื่นๆและสามารถจัดการได้อย่างมี
ประสทิ ธิภาพ
4. มีเครอื่ งมอื ทส่ี ามารถนำไปใชใ้ นการพัฒนาโปรแกรมทางธรุ กิจไดอ้ ย่างเหมาะสม
5. สามารถสรา้ งสภาวะแวดล้อมการทำงานรว่ มกบั แหล่งข้อมลู ที่อยู่ในฐานข้อมูลผ่านระบบ
เครือข่ายรวมถึงอินเทอร์เน็ตไดอ้ ย่างมีประสทิ ธภิ าพ
6. สามารถสร้างโปรแกรมเพื่อใชง้ านในอินเทอร์เน็ตและอินทราเนต็ ได้อย่างมปี ระสิทธภิ าพ
เช่น การสร้างโปรแกรม Browser การสร้างห้องสนทนา (Chat Room) ผ่านระบบ
เครือขา่ ย

7. มีเครื่องมือที่สามารถนำไปพัฒนาโปรแกรมอื่นๆตามความต้องการของผู้ใช้ได้อย่างมี
ประสทิ ธภิ าพ

8. สามารถกำหนดคุณสมบัติให้กับ Class โดยใช้ไวยากรณ์ที่สั้นลงเนื่องจากไม่ต้องใช้คำส่งั
Get และ Set ในการกำหนดคณุ สมบตั ิ

9. สามารถกำหนดค่าเริ่มต้นของ collection ที่สร้างขึ้นได้มีประโยชน์สำหรับการสร้าง
collection ทท่ี ราบคา่ เร่มิ ต้น เช่น การสรา้ งรายการเมนู เปน็ ตน้

10. สามารถใช้ Statement ต่อเนื่องไปยังบรรทัดถัดไปได้โดยไม่ต้องใช้เครื่องหมาย
underscore (_)

11. เพม่ิ การสนบั สนุน Lambda Expressions ให้กับ Subroutines
12. เพิ่มคำสั่ง /langversion เพื่กำหนดให้ ckmplier ยอมรับเฉพาะ Syntax ที่กำหนด

สำหรบั เวอรช์ ันของ Visual Basic
13. สามารถใช้แอพพลิเคชัน่ ที่มชี นดิ ของข้อมลู แบบฝงั ตัว (Embedded type information)

แผนทชี่ นิดข้อมลู ท่นี ำเข้า(import) จาก Primary lnterlop Assembly (PIA)
14. สนับสนนุ วตั ถทุ ่มี าจากภาษาแบบ dynamic เชน่ lronPython และ lronRuby
15. Covariance and Contravariance
16. สามารถคน้ หา keyword ภายใน code ได้โดยการใชค้ ำสัง่ Navigate To

การเปดิ โปรแกรม Visual Basic
เพื่อให้ผู้ใช้ทำความเข้าใจและสามารถนำไปปฏิบัติได้ จึงขออธิบายการใช้งาน VBExpress

2010 อย่างละเอียดเก่ียวกับการเปดิ โปรแกรม Visual Basic ดังตอ่ ไปน้ี
1. คลิกที่ปุ่ม Start แล้วไปที่ Program จากนั้นคลิกเลือกที่ VBExpress 2010 หรือคลิปที่
ไอคอนของโปรแกรม VBExpress 2010 บน Desktop
2. เมื่อทำการเปิดโปรแกรม VBExpress 2010 ขึ้นมาเเล้วจะปรากฏหน้าต่างดังรูปโดย
รายละเอยี ดของตวั เลอื กทีส่ ำคัญมีดงั น้ี

2.1 New Project/ Open Project ใช้สำหรับการสรา้ ง project ใหม่ หรือเปิด project พี่
มีอย่แู ลว้

2.2 Recent Project ใชส้ ำหรบั เปดิ Project ท่มี ีการใชง้ านลา่ สุด
2.3 Get Started มีคำแนะนำที่เป็นประโยชน์เกี่ยวกับการใช้งานโปรแกรม VBExpress
2010
2.4 Latest News แสดงข่าวและความเคลื่อนไหวเกี่ยวกับ VBExpress 2010 โดยจะ
เกีย่ วข้องกับการอพั เดต
2.5 Solution Explorer แสดงคุณสมบัติตา่ งๆ ของ project ที่กำลงั ใชง้ าน

การสร้าง Project ใหม่และเรยี ก Project เดิมขน้ึ มาใช้งาน
การสร้าง Project ใหม่
1. ในการสร้าง Project ใหม่ทำไดโ้ ดยคลกิ ท่ี New Project จะปรากฏ dialog box ดังรูป

2. ใน dialog box นี้จะประกอบด้วย project ทั้งหมด 5 ประเภท ให้ทำการเลือก Windows
Forms Application

3. สามารถเปลี่ยนชื่อของ project ได้ในช่อง Name ที่อยู่ด้านล่างให้ทำการเปลี่ยนช่ือ
project ตามทต่ี ้องการและคลิกท่ี ok จะได้ดังรปู

การเรยี ก Project เดมิ ขึน้ มาใชง้ าน
1. ในกรณีที่เปิดโปรแกรม VBExpress 2010 ขึ้นมาใหม่ ให้คลิกที่ Open project จากน้ัน
เลอื ก Project ท่ตี ้องการเปดิ แลว้ คลกิ ท่ี open

2. เม่อื คลิกแลว้ จะได้ผลดงั ภาพ

3. หากต้องการเปิด project ที่มีการใชง้ านล่าสุดสามารถเบอื กดปิดได้จากในสว่ น Recent
Projects

การบนั ทกึ from และ project
การพฒั นาโปรแกรมจะมกี ารบนั ทึกงานสว่ นท่ีทำเสรจ็ แล้วหรอื ยงั ไมเ่ สรจ็ หรือยงั ทำเป็นสว่ นแล้วทำ

การบนั ทกึ ไวแ้ ลว้ นำมาทำตอ่ ภายหลัง การบันทึก from สามารถทำไดด้ ังนี้
1. คลิกที่ Menu bar > File > Save Form หรือ

หากต้องการบนั ทกึ Form เปน็ ชือ่ อืน่ สามารถทำไดโ้ ดยเลอื กท่ี Save Form As…
2. คลกิ ทปี่ มุ่ ….. บน Tool bar

สำหรบั การบันทึก Project สามารถทำได้ดงั น้ี
1. คลกิ ท่ี Menu bar > File > Close Project เพอื่ ปิด project

2. หาก project ทใ่ี ช้งานอยู่ยงั ไม่ไดบ้ นั ทึกไว้จะปรากฏ dialog box เพอ่ื ให้ทำการบนั ทึก

3. คลิก Yes เพื่อทำการบันทึกโปรเจคหรือ คลิก No เพื่อปิด project โดยไม่ทำการบันทึก
หรือ คลกิ Cancel เพอ่ื ยกเลิกการปิด project

การออกแบบโปรแกรม
หลงั จากทำงานตามที่ออกแบบไว้เสรจ็ แลว้ หรือยงั ไม่เสรจ็ และต้องการออกจากโปรแกรมสามารถ

ทำได้ดงั น้ี
1. คลกิ ที่ Menu bar > File > Exit เพือ่ ออกจากโปรแกรม

ใบงานท่ี 4.1

คำชี้แจง ให้ผู้เรียนทำการสร้าง project แบบ Window form froms Application
และปฏิบัติดังนี้

️ ต้ังช่อื Project เปน็ myFirstForm
️ บันทึก Form โดยใช้ช่อื Form เป็น myForm01
️ ทำการปิด myForm01 และเปดิ ขนึ้ มาใหม่
️ ทำการปดิ project และทำการเปดิ project myFirstForm ข้ึนมาอกี ครงั้
️ ออกจากโปรแกรม VBExpress 2010

การกำหนดสภาวะแวดลอ้ มของโปรแกรม Visual Basic
สภาวะแวดล้อมการโปรแกรมด้วย Visual Basic จะประกอบด้วยเครื่องมือจำนวนมากที่

โปรแกรมได้จัดเตรียมไว้ สามารถใช้งานในการสร้างโปรแกรมที่มีประสิทธิภาพได้อย่างรวดเร็ว ซ่ึง
เรยี กว่า IDE (Integrated Development Environment)

เคร่ืองมอื สำหรับการเคลอ่ื นย้าย ปรับขนาดและการทำ Docking

Visual Basic สามารถควบคุมรูปร่างและขนาดขององค์ประกอบในสภาวะแวดล้อมของการ
ใช้โปรแกรมได้ โดยทำการเคล่อื นย้ายวางตำแหนง่ (Docking) และเปลย่ี นขนาดของเครื่องมือสำหรับ
การเขียนโปรแกรมแต่ละตัวได้ เช่น การเคลื่อนย้ายหน้าต่าง Toolbox หรือ Toolbar ทำได้โดยการ
คลิกที่ บริเวณส่วนหัวของเครือ่ งมือแต่ละตัว และรากองค์ประกอบนั้นไปยังตำแหน่งใหม่ ถ้าต้องการ
จัดแนวของหน้าต่างไว้ที่ขอบของหน้าต่างอีกตัวหนึ่ง มันจะผูกติดด้วยกันทันทีสามารถจัดตำแหน่งให้
เป็นแนวเดียวกนั และเชื่อมตดิ กัน เพื่อให้องค์ประกอบทั้งหมดถกู มองเห็น visible และสามารถเข้าถึง
ได้ Accessible เรียกว่า การ Docking หน้าต่างที่ถูก Dock นี้จะมีข้อดีเนื่องจากจะปรากฏให้เห็น
เสมอโดยไม่ถกู บังไวด้ ว้ ยหน้าต่างอน่ื

การเคล่อื นยา้ ยเครือ่ งมอื ใน VBExpress 2010 สามารถทำไดด้ งั น้ี
1. คลิกที่สัญลักษณ์ Window Position เพื่อเลือกรูปแบบในการเคลื่อนย้าย โดยจะมี
ตัวเลือกดงั นี้

>> Float จะเป็นการกำหนดให้เครื่องมือมีอิสระ โดยจะไม่ยึดติดอยู่กับความขอบเขต
หนา้ ตา่ ง VBExpress 2010

>> Dock เป็นตัวเลือกสำหรับการวางเครื่องมอื ใหต้ ดิ กบั ขอบหนา้ ตา่ ง VBExpress 2010

>> Dock as Tabbed Document เปน็ ตวั เลือกสำหรับการวางเครอื่ งมอื ใหอ้ ยู่ใน Tab

>> Auto Hide และ Hide จะเป็นการซอ่ มเครื่องมือเมื่อไมต่ ้องการใช้งาน

การใช้เครื่องมือในการทำงานโดยแยกออกจากกันโดยอิสระ ทำให้การทำงานมีความยืดหย่นุ
เพราะสามารถวางเครอ่ื งมอื ไว้ทีต่ ำแหนง่ ใดก็ได้
การใช้เครอื่ งมอื Toolbar

โปรแกรมได้จัดเตรียมการใช้เครื่องมือในการพัฒนาโปรแกรมในลักษณะที่เป็นสัญลักษณ์
แทนการเลอื กใชผ้ ่านเมนูบาร์ ซ่ึงสามารถใชง้ านได้ง่าย สะดวก รวดเร็ว โดยท่ัวไปการทำงานโดยใช้ทูล
บาร์สัญลักษณ์จะเหมือนกับโปรแกรมอื่นๆ พี่มีมาตรฐานเดียวกัน ยกเว้นการใช้งานเฉพาะของ
โปรแกรม Visual Basic ซ่งึ จะมีสญั ลกั ษณเ์ ฉพาะของโปรแกรม เช่น การเปดิ from การสรา้ ง project
ใหม่ เป็นต้น

การใชเ้ ครื่องมอื Toolbox

เป็นเครื่องมือที่สามารถเพิ่มองค์ประกอบของส่วนติดต่อกับผู้ใช้เข้าไปในฟอร์ม เครื่องมือ
เหลา่ นีเ้ รียกว่าคอนโทรล (Controls) ซ่งึ จะอยใู่ น Toolbox การเปดิ Toolbox ทำไดโ้ ดยคลิกปุ่ม บน
Menubar โดย Toolbox จะประกอบด้วยคอนโทรลที่สามารถใช้ในการเพิ่มรูปกราฟิกพิเศษ
(Picture) ป้ายข้อความ (Label) ปุ่มคำส่งั (Boutton) กรอบการแสดง (Listbox) เขา้ ไปในส่วนติดต่อ
กับผใู้ ช้ คอนโทรลท่เี พม่ิ เขา้ ไปในฟอรม์ จะเรียกว่า วัตถุ (Object) ซึ่งเปน็ องค์ประกอบในส่วนติดต่อกับ
ผู้ใช้ที่สามารถเขียนคำสั่งหรือโปรแกรมได้ องค์ประกอบเหล่านี้จะปรากฏต่อผู้ที่ใช้โปรแกรมขณะท่ี
โปรแกรมกำลงั ทำงานเหมอื นกับ Object มาตรฐานท่วั ไปในแอพพลิเคช่ันบน วินโดวส์ อื่นๆ Toolbox
ใน VBExpress 2010 ได้ถกู จดั หมวดหมูต่ ามหน้าทก่ี ารทำงานไว้ดงั นี้

> Common Controls เป็นคอนโทรลพ้ืนฐานตา่ งๆ เช่น button คอนโทรลทใี่ ช้ในการสร้าง
ปุม่ กด, Label คอนโทรลที่ใชใ้ นการสร้างปา้ ยชือ่ เปน็ ต้น

> Container เป็นคอลโทรลที่ใช้ในการจัดกลุ่มคอลโทรลต่างๆโดยจะรวมคอนโทรลท่ี
ตอ้ งการไวใ้ นกลมุ่ เดียวกัน เช่น คอลโทรล GroupBox,Panel เป็นตน้

> Menu&ToolBars เป็นคอนโทรลทใี่ ช้ในการสร้างเมนตู ม่ งๆ

> Data เปน็ คอนโทรบสำหรบั ใช้งานกบั ฐานข้อมลู

> Component เป็นคอนโทรลที่ไม่ปรากฏรูปร่างในฟอร์ม โดยจะมีหน้าที่ในการจัด
เตรียมการทำงานใหก้ บั โปรแกรม เชน่ Timer ใชใ้ นการจบั เวลาทำงาน

> Printing เป็นคอนโทรลทเ่ี กี่ยวข้องกับการพิมพ์เอกสาร

> Dialog เป็นคอนโทรลสำหรับการสร้างกล่องข้อความต่างๆ เช่น Oper File Dialog ใช้ใน
การสร้างของข้อความสำหรับเปิดไฟล์

การใช้หนา้ ตา่ ง Project Explorer

Solution Explorer เป็นหน้าต่างที่แสดงโครงสร้างของ project ที่กำลังทำงาน และใช้
ควบคุมส่วนประกอบและแฟ้มข้อมูลต่างๆ ซึ่งในแต่ละ project ประกอบด้วยแฟ้มข้อมูลหลายชนิด
ซึ่งเราสามารถควบคุมได้ผ่านหน้าต่าง Solution Explorer เช่น การเพิ่ม ลบ Form และ Module
เปน็ ตน้

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

การใช้ Form Designer

Form Designer เป็นส่วนทีก่ ำหนดตำแหนง่ ของวตั ถใุ น Form เมื่อโปรแกรมทำงานจริง วัตถุ
ใน from จะแสดงผลตามที่กำหนดไว้ใน Form Designer โดยผู้ใช้สามารถย้ายตำแหน่งของวัตถุ
ภายใน from ได้ การยา้ ยตำแหน่งวตั ถสุ ามารถทำได้ดังนี้

1. คลิกซ้ายเลอื กวัตถุที่ต้องการย้าย จะปรากฏกรอบลอ้ มรอบวัตถทุ ่ีเลอื ก

2. คลกิ ซา้ ยค้างไวแ้ ล้วลากวัตถไุ ปไว้ในตำแหน่งทตี่ อ้ งการ
3. ปลอ่ ยเมาสแ์ ล้ววตั ถจุ ะย้ายไปยังตำแหน่งท่เี ลอื ก

4. เม่อื ทำการ Run Program จะแสดงผลตามท่ีกำหนดไวใ้ น Form Designer
การใช้หน้าตา่ ง Properties Window

Properties window เป็นหน้าต่างที่ใช้แสดงและกำหนดคุณสมบัติ (Properties) ของ
Object ต่างๆที่ถูกเลือกใช้งาน การคลิกเลือก Object ใดใน Form จะทำให้หน้าต่างคุณสมบัติ
(Properties) เปลย่ี นไปตามวัตถุ (Object) ทเี่ ลอื ก ซง่ึ มีคุณสมบตั ิแตกต่างกันไปตามหน้าท่ีการใช้งาน
การกำหนดค่าหรือการแก้ไขสามารถทำได้โดยตรงใน Properties ของแต่ละค่า ในหน้าต่าง
Properties window จะมี tab ให้เลือกอยู่ 2 tabs คือ Alphabetic จะแสดงคุณสมบัติเรียงตาม
ตัวอักษร Categorized จะแสดงคุณสมบัติเรียงตามลักษณะการใช้งาน การเรียกดูหน้าต่าง
Properties ให้คลิกเลือกที่เมนู view > Other windows > Properties window หรือกดปุ่ม F4
หรอื คลกิ ปุม่ Properties window ที่อยูบ่ น Toolbar ดังรปู

ลักษณะของ Poetries window เป็นดังนี้ และผู้ใช้สามารถศึกษาคำอธิบายได้ในช่อง
คำอธิบาย Properties ทางดา้ นล่าง

การกำหนด Properties ให้กับ Form
หน้าต่าง Properties จะทำหน้าที่กำหนด เปลี่ยนแปลง แก้ไขคุณสมบัติให้กับแต่ละ

องค์ประกอบของส่วนติดต่อกบั ผูใ้ ช้บนฟอร์ม เช่น การกำหนดชื่อให้กับฟอรม์ การกำหนดให้แสดงชื่อ
บนไตเติลบาร์ของ Form การกำหนดสีของ Form เป็นต้น หน้าต่าง Properties จะประกอบด้วย
Drop Donw List Box ซึ่งจะแสดง Object ทั้งหมดที่อยู่บน Form เช่น ปุ่มคำสั่ง (Common
Button) กรอบแสดงรายการ (List Box) เป็นต้น ถ้าต้องการทำงานกับ Object ใดก็สามารถเลือกได้
ท่ี Drop Donw List Box

หมายเหตุ control ทถ่ี ูกนำมาวางบน Form จะถอื วา่ เป็นวตั ถุ (Object) ชน้ิ หน่งึ
ตัวอยา่ งที่ 1 การกำหนด Properties ใหก้ ับ Form
1. เปิด project ข้ึนมาใหม่ ซ่งึ จะปรากฏ from ขน้ึ มา
2. กำหนด Properties ให้กบั Form โดยคดิ เมา้ ทบ์ รเิ วณ from

• กำหนดสีพื้นหลัง( Back Color)
• กำหนดชอ่ื บนไตเติลของ Form เป็นฟอร์มหลกั
• กำหนดไอคอนบนไตเติลของ Form
• กำหนด Font เป็น BroealliaUPC ขนาด 16

กำหนดสีพื้นหลัง (Back color) ทำได้ดังนี้ การกำหนดพื้นหลัง คลิกเมาส์ที่ช่อง ด้านขวาของ
Back color จากน้ันเลอื กท่ี tab Custom จะปรากฏถาดสี (Color Palate) ให้เลือกท่ีสเี หลอื งอ่อน

การกำหนดชื่อบนไตเติลของ Form เป็นฟร์อมหลัก ค่าเริ่มต้นของชื่อฟอร์มโดยทั่วไปจะเป็น form 1
หากต้องการเปลี่ยนชื่อฟอร์มใหม่ทำได้โดยพิมพ์ข้อความ "ฟอร์มหลัก" ที่ด้านขวาของ Properties
Texr ชือ่ ของฟอร์มจะเปลีย่ นจาก Form1 เป็น "ฟอร์มหลัก"

กำหนดไอคอนบนไตเติลของ Form

การกำหนดใหม้ ี lcon แสดงทบ่ี นไตเติลของ Form เปน็ รปู เครอื่ งคอมพิวเตอร์ (Setup) ให้คลิก
ท่ี … ที่อยู่ด้านขวาของ Properties lcon ซึ่งอยู่ในกลุ่ม Window Style จะปรากฏหน้าต่างขึ้นมา
เพอ่ื ให้เลอื กรปู Icon

การกำหนดรูปแบบ Font เป็น BrowalliaUPC ขนาด 16
การกำหนดรูปแบบตัวอักษร (Font) คลิกท่ี … ที่อยู่ด้านขวาของ Properties Font จะปรากฏ

หนา้ ต่างข้นึ มาเพ่อื ใหเ้ ลอื กรปู แบบ ใหท้ ำการคลิกเลือก Browallia ขนาด 16

การเพิ่มและลบ Form ออกจาก Project
Form ถือเป็นหัวใจในการใชง้ าน VBExpress 2010 เนืองจาก Form จะทำหน้าที่แสดงการทำงาน

ของโปรแกรม ในบางครั้งผู้ใช้อาจต้องการเพิ่มหรือลบ Form ออกจาก Project ซึ่งการเพิ่มหรือลบ
Form ออกจาก Project มขี ้ันตอนดงั น้ี
การเพิม่ Form เขา้ มาใน project

การเพ่ิม Form สามารถทำได้หลายวธิ ดี ังนี้
️ คลกิ ท่ี tab Project ใน MenuBar และเลอื ก App Windows from

️ คลกิ ที่ App New Item ทอี่ ยู่บน Toolbar และเลอื ก App Windows from

️ คลิกขวาที่ชื่อ project ใน Solution Explorer และเลือก App จากนั้นเลือก Windows
form

เมื่อทำการเพิ่ม Form แล้วจะปรากฏหน้าต่าง App New Item ให้ทำการตั้งชื่อ Form จากนั้น
คลกิ App

Form ใหม่ท่สี ร้างขึ้นจะปรากฏอยู่ใน Form Designer และ Solution Explorer

การลบ Form ออกจาก Project
การลบ Form ทำได้โดยการคลิกขวาที่ชื่อ Form ที่ต้องการลบใน Solution Explorer จากนั้น

เลือกคำสัง่ Delete

การสง่ั ให้โปรแกรมทำงาน (Run Program)
ขณะที่มีการทำงานพัฒนาโปรแกรมในแต่ละขั้นตอน เพื่อให้ได้การทำงานตามที่ต้องการควรมี

การทดสอบโปรแกรมในแต่ละขัน้ ตอนดว้ ย การสง่ั ให้โปรแกรมทำงานสามารถทำได้ดังนี้
️ คลิกที่ Menu Bar –> Debug –> Start Debugging

️ คลิกท่ี ▶️ บน Toolbar
️กดปุ่ม F5

ใบงานท่ี 4.2

คำชแ้ี จง ใหผ้ เู้ รยี นปฏบิ ตั ิดังนี้
1. สร้าง Project ใหม่ โดยต้ังชอ่ื วา่ Project02
2. เปล่ียนพืน้ หลงั ของ Form ให้เปน็ สีเขียวออ่ น
3. เปลย่ี นชอ่ื Form เปน็ Mein Form
4. เพม่ิ Form ใหม่ใน Project โดยตง้ั ชอ่ื เปน็ Sub Form

แบบประเมนิ ผลการเรยี นรู้หน่วยที่ 4
ตอนท่ี 1 จงเลือกคำตอบที่ถูกต้องทส่ี ดุ เพียงข้อเดียว

1. การสรา้ ง Project ใหมใ่ น VBExpress 2010 ทำได้โดยใชค้ ำสง่ั ใด
ก.New Project
ข.Open Project
ค.Get Started
ง.Latest News

2. หากต้องการสร้าง project ใหม่ เพื่อใช้งานกับ Windows โดยเฉพาะจะต้องเลือกสร้าง
project ชนดิ ใด

ก.Windows Forms Application
ข.WPF Application
ค.Console Application
ง.Class Library
3. สภาวะแวดล้อมที่ใช้แสดงสมบตั ิของ Form คือขอ้ ใด
ก.Menu Bar
ข.Tool Bar
ค.Solution Explorer
ง.Properties Window
4. Tool Bar ที่ใช้สำหรับบนั ทึก Form คอื ข้อใด
ก.Cut
ข.copy
ค.Save Form
ง.Save All
5. Control พใี่ ช้ในการจดั กลุ่ม Control ตา่ งๆเขา้ ไวด้ ว้ ยกนั จัดอยูใ่ นกลมุ่ ใด

ก.Common Controls
ข.Container
ค.Menu&ToolBers
ง.Data
6. Control ท่ใี ชใ้ นการจดั การเอกสารตา่ งๆจดั อยู่ในกลุ่มใด
ก.Component
ข.Printing
ค.Dialog
ง.Data
7. การเข้าสู่หน้าต่าง Code Editor เพื่อทำการเขียนคำสั่งควบคุมดารทำงานของ Control ทำ
ไดอ้ ย่างไร
ก.คลิกซ้ายทCี่ ontrol
ข.คลิกขวาที่ Control
ค.ดับเบลิ คลกิ ที่ Control
ง.คลิกปุ่ม Properties ท่ี Solution Explorer
8. การกำหนดสีให้กบั พ้นื หลังของ Form สามารถกำหนดไดจ้ ากคณุ สมบัติใดของ Form
ก.Font
ข.Backcolor
ค.Text
ง.Backgroundlmage
9. ขอ้ ใดเปน็ วิธกี ารเพม่ิ Form ใน Project
ก.คลิกท่ี tab Project ใน MenuBar และเลอื ก App Windows Form
ข.คลิกที่ App New Item บน ToolBar และเลือก App Windows Form
ค.คลกิ ขวาที่ Project ใน Solution Explorer เลือก App จากน้ัน เลอื ก Windows Form
ง.ถกู ทุกขอ้
10. หากต้องการสัง่ ให้โปรแกรมทำงานสามารถทำไดโ้ ดยใชค้ ำส่งั ใด

ก.คลกิ ท่ี ▶️ บน ToolBar
ข.Start Debugging
ค.กดปุม่ F5
ง.ถกู ทุกข้อ