tech vb 2008 express

เทคนคเพมเตม ใน Visual Basic 2008 Express

1. การเพมฟอรมในโปรเจค

ถาตองการเพมฟอรมหลายๆฟอรมในโปรเจคเดยวกน สามารถท าไดโดยก าหนดขนตอนดงตอไปน 1.1 สมมตเรามฟอรมอยแลวชอวา Form1 สงเกตท Solution Explorer ชอ Form1.vb แลวถาตองการเพม

ฟอรมทสอง ใหเลอกไปยงเมน Project Add Windows Form… กจะปรากฏดงรปท 1

รปท 1 หนาตางการเพม Templates ของฟอรมใหม 1.2 เลอกรายการทตองการในทนเนองจากเราตองการเพมฟอรมวนโดวใหม เราตองเลอกเปน Windows

Form กอน 1.3 จากนนตงชอทชอง Name ในทนขอตงชอวา Form2.vb จากนนกดป ม Add เรากจะไดฟอรมเพมขนมาท

tab Start Page ดงรปท 2 “Form2.vb[Design]”

รปท 2 หนาตางใหม Form2.vb 1.4 น าป ม Buttons มาวางทฟอรมทหนงและฟอรมสองอยางละป ม เพอท าใหกดแลวแสดงฟอรมสลบกนไป

มาได 1.5 จากนนทป มแตละป มใสค าสงตอไปน

1

2

3

Tips for “Visual Basic 2008 Express”……………………………………………………

>โดย สญญา เครอหงษ http://www.iamsanya.com .................................................................................... 2 ภาควชาวทยาการคอมพวเตอรและเทคโนโลยสารสนเทศ มหาวทยาลยนเรศวร

ทป มฟอรมท 1 ทป มฟอรมท 2

รปท 3 การออกแบบป มบนฟอรมท 1 และ 2

หมายเหต การใช Form1.Show () และ Form1.ShowDialog () มความแตกตางกนคอ การใช Show หลงการรนแลวฟอรมสามารถสลบไปมาได แตถา ShowDialog จะไมสามารถสลบฟอรมไปมาได มกจะใชส าหรบการบงคบผใชงานใหท าเสรจกอนหรอตองมป มปดฟอรมนน

Me.Close() 'เพอปดโปรแกรมท งหมด เพราะเปนฟอรมหลก

Me.Hide()

'เพอซอนฟอรม 2



2. การก าหนดฟอรมทตองการใหรนขนมากอน (Startup Form) ฟอรมทสรางมาครงแรกเราอาจจะไมตองการใหแสดงกอนเสมอไปกได บางครงเราอาจจะใหฟอรมทสองแสดง

ขนมากอน ซงสามารถท าไดดงน 2.1 หลงเปดโปรเจคใหเลอกเมน Project ชอโปรเจค Properties … ตวอยางเชน

“WindowsApplication1 Properties…” ดงรป 4 ซงจะแสดงคณสมบตตางๆของโปรเจคนน

รปท 4 หนาตางใหม Form2.vb 2.2 เลอกฟอรมทตองการใหแสดงกอนในหวขอ Startup form 2.3 จากนนลองทดสอบรนด

3. การมองภาพรวมของเมน และ Control ตางๆไดโดยใช Document Outline บางครงการก าหนด Event ตางๆใหเมนหรอคอนโทรลตางๆ เราอาจจะสบสนได ดงนนเราสามารถเรยกดรายการเมน

และคอนโทรลตางๆ ในมมมองภาพรวมทงหมดได โดยเลอกไปทเมน View Other Windows Document Outline จากนนกจะปรากฏดงรปท 5

รปท 5 มมมอง Document Outline

เลอกฟอรมทตองการแสดง

กอน



4. การเมน Context Menu เวลาคลกขวาใน Control ตางๆ (ContextMenuStrip) ถาตองเราตองการท าเมน Context Menu เมอเวลาคลกขวาใน Control ตางๆเมอรนโปรแกรม เราสามารถท าได

โดยใชคอนโทรลชอวา ContextMenuStrip ซงอยในชด Toolbox วา Menus&Toolbars 3.1 น า ContextMenuStrip มาวางทฟอรมเมอคอนโทรลนอยบนฟอรมมนจะแสดงอยใตฟอรมเสมอ ดงรปท

6 เวลาจะแกไขเมนหรอออกแบบ Context menu ใหน าเมาสไปคลกเลอกท ContextMenuStripบนฟอรม กอน จงจะแสดงการแกไขให ดงรปท 6

รปท 6 การใชคอนโทรล Context Menu Strip 3.2 จากนนใหออกแบบตามวตถประสงคทจะน าไปใช โดยพมพขอความเมนลงใน Type Here โดยอาจจะท า

เมนยอยกได ถาตองการขดเสนระหวางรายการเมนใหใช - (สญลกษณลบ) ถาตองการใหรายการเมนมเขยนเสนใตตวอกษรทตองการใหใช & (Ampersand) น าหนาอกษร ใน properties ชอวา Text ของรายการนน เชน เ&ปด กจะไดผลลพธเปน เปด ระวงอยาใชน าหนาอกษรซ ากนถาอยในเมนระดบเดยวกน

3.3 นอกจากนนยงสามารถก าหนดรปภาพ Icon ในแตละเมนได โดยเปลยนภาพไดท Properties ชอวา Images เมอกด … กจะปรากฏดงรปท 7 จากนนถาตองการน าภาพมาใชใหกด Import …

รปท 7 หนาตางการแทรกรปภาพดวย Select Resource และการแสดง Solution Explorer

คลกทนกอน

แกไขรายการ



ถาเลอก Local resource จะเปนการหาภาพจากเครองทเลนอย เมอยายเครองท างานไฟลจะตองน าไปดวย แตถาเลอก Project resource files ภาพจะถกบนทกลงในไฟลชอ Resources.resx ซงอยในโฟลเดอร Projects ของเรา เมอยายเครองตองน าไฟลนไปดวย

3.4 นอกจากนนยงสามารถก าหนดคยลด (ShortcutKeys) ไดดวย โดยรายการเมนทตองการแลวไปท Properties จากนนเลอกคยทตองการตามรปแบบของรปท 8 ก าหนดใหครบทกเมนตามตองการ

รปท 8 Properties ของรายการเมน Context Menu เพอก าหนดคยลด 3.5 โดยเราสามารถสราง Context Menu Strip ไวกอนกได เมอออกแบบเสรจวธการเรยกใช เราจะตองเลอก

Control จากนนเลอก Properties ของ ContextMenuStrip ดงรปท 9

รปท 9 การใชคอนโทรล Context Menu Strip กบป ม 3.6 ลองทดสอบรนด เมอเราคลก ขวาทป ม Show Form2 กจะปรากฏ Context Menu Strip ขนมา ดงนนถา

เราจะใหเกดเมนทไหน เราตองไปก าหนด Properties ชอ ContextMenuStrip ทคอนโทรลนน โดยการออกแบบหนงครงจะน าไปใชกบคอนโทรลกตวกได เชนทฟอรม

3.7 สวน Properties อนๆของ ContextMenuStrip ลองศกษาเพมเตมไดท Help



5. การออกแบบเมนดวย (MenuStrip) ถาตองเราตองการท าเมน เราสามารถท าไดโดยใชคอนโทรลชอวา MenuStrip ซงอยในชด Toolbox ชอวา

Menus&Toolbars มขนตอนตอไปน 4.1 น า MenuStrip มาวางทฟอรมเมอคอนโทรลนอยบนฟอรมมนจะแสดงอยใตฟอรมเสมอ ดงรปท 9 เวลาจะ

แกไขเมนหรอออกแบบเมน ใหน าเมาสไปคลกเลอกท MenuStrip บนฟอรมกอน จงจะแสดงการแกไขให ดงรปท 10

รปท 10 การใชคอนโทรล Menu Strip กบป ม

4.2 สวนการออกแบบกคลายกบคอนโทรล Context Menu Strip ทงการท าเสนขวาง การขดเสนใตตวอกษร การท าคยลดและการแทรกภาพ icon เปนตน

4.3 ใหสงเกตท Properties ของ Form ดวยวาก าหนด MainMenuStrip ไวหรอไม เพราะบางครงในฟอรมเดยวกน ถาไมก าหนดไวเวลารนโปรแกรมจะไมมเมนแสดงขนมา และการออกแบบเมนนน สามารถออกแบบเมนไวไดหลายอนได แลวคอยมาก าหนดเรยกใชอนไหนกอนกได ดงรปท 11

รปท 11 การก าหนด Properties ทฟอรมเพอใหใช MenuStrip 4.4 ทดสอบโดยการรนโปรแกรมด 4.5 สวน Properties อนๆของ MenuStrip ลองศกษาเพมเตมไดท Help



6. การออกแบบแถบเครองมอดวย (ToolStrip)

การท าป มเครองมอ(Toolbar) ซงจะ เปนป มไอคอนทอยใตเมนบาร โดยใชคอนโทรลชอวา ToolStrip ซงอยในชด Toolbox ชอวา Menus&Toolbars มขนตอนตอไปน

5.1 น า ToolStrip มาวางทฟอรม เมอคอนโทรลนอยบนฟอรมมนจะแสดงอยใตฟอรมเสมอ ดงรปท 12 เวลาจะแกไขหรอออกแบบ ใหน าเมาสไปคลกเลอกท ToolStrip ใตฟอรมกอนจงจะแสดงการแกไขให ดงรปท 12

รปท 12 การออกแบบโดยใช ToolStrip

5.2 จากนนคลกเลอกประเภทแถบเครองมอทตองการ

รปท 13 ประเภทรายการใน ToolStrip 5.3 เมอเลอกป มไดตามตองการแลว กเลอกก าหนดภาพไอคอนในป มแตละป ม โดยเลอก Properties ชอ

Image… ในแตละอน ถ าตองการใหภาพบนป มมขนาดเทากบภาพไอคอนตนฉบบใหก าหนด



Properties ชอ ImageScaling เปน None หรอถาตองการก าหนดขอความแสดงเวลาน าเมาสไปช (Tooltips Text) ใหไปแกไขท Properties ชอ TooltipsText ของแตละป ม

รปท 14 ตวอยางป มทออกแบบแลว 5.4 ถาตองการจดการรายการบนป มแตละป มรวมๆนน สามารถเขาไปท Properties ของ ToolStrip1 ชอ

Items.. กจะปรากฏ Items Collection Editor ดงรปท 15

รปท 15 การออกแบบป ม Items Collection Editor 5.5 สวนค าสงในแตละป มวาจะใหเปนอยางไรนน ท าไดโดยการดบเบลคลกในแตละป มแลวก าหนด

เหตการณทตองการเอง 7. การก าหนด MDI (Multiple Document Interface) เพอใหควบคมฟอรม

ถาจะท าใหฟอรมหลกสามารถควบคมฟอรมยอยๆ ไดนน ท าไดโดยการก าหนด MDI ใหฟอรมหลกเสยกอน ซงตองไปก าหนดท Properties ชอ IsMdiContainer ของฟอรมนน แลวก าหนดใหเปน True เสยกอน แลวกจะไดผลดงรปท 16 ผลของการท าแบบนจะคลายกบโปรแกรม Photoshop ทฟอรมหลกจะท าหนาทควบคมหนาตางหรอฟอรมทงหมด ใหอยในกรอบของฟอรมหลกเสมอ

เสน Separator

ปม

DropDownButton

รปท 16 การก าหนด MDI ใหฟอรมหลก



7.1 เลอกฟอรมหลกทตองการท า MDI แลวก าหนด Properties ชอ IsMdiContainer เปน TRUE 7.2 จากนนลอง Add Windows Form ขนมาเปนตวอยาง 2 ฟอรม สมมตวาเพมฟอรมชอ Form2 และ Form3 7.3 จากนนก าหนดค าสงในฟอรม Form1_Load กบป มบนแถบเครองมอ 7.4 จากนนลองลองรนโปรแกรมจะไดผลลพธดงรปท 17

รปท 17 การใสค าสงในฟอรมหลก

จากค าสง Form2.MdiParent = Me เปนการก าหนดให Form2 อยภายใตฟอรมหลก Me หรอ Form1 นนเอง เรายงสามารถทจะ เพมฟอรมแบบ MDI ไดแบบงายๆ โดยไปทเมน Projects Add New Items.. จากนนใหเลอกไปท MDI Parent Form แลวตงชอไฟล เรากจะไดฟอรมทออกแบบมาตรฐาน MDI มาใหทนทดงรปท 19

Private Sub Form1_Load(ByVal …) Form2.MdiParent = Me ‘ ก าหนดให Form2 เปนลกของ Form1 Form3.MdiParent = Me ‘ ก าหนดให Form3 เปนลกของ Form1 End Sub

Private Sub ToolStripButton1_Click(ByVal….) Form2.MdiParent = Me ‘ หรอก าหนดให Form2 เปนลกของ Form1 ไวทนกได Form2.Show() End Sub

Private Sub ToolStripButton2_Click(ByVal….) Form3.MdiParent = Me ‘ หรอก าหนดให Form3 เปนลกของ Form1 ไวทนกได Form3.Show() End Sub

รปท 18 หนาจอใหเลอกรายการ Templates ทตองการ

รปท 19 ฟอรมแบบ MDI ทเพมมาพรอมคอนโทรลตางๆ



8. การใช Status bar (StatusStrip) การออกแบบ Status bar เพอแสดงสถานการณท างานตางๆของโปรแกรม สามารถจะออกแบบไดโดยใช

คอนโทรลชอ StatusStrip เลอกแลวมาคลกวางไวทฟอรม ซงโดยปกตจะแสดงอยดานลางฟอรมเสมอ t

รปท 20 การออกแบบ Status bar 8.1 เมอน า StatusStrip มาวางทฟอรมในทนชอวา StatusStrip1

8.2 จากนนกดเลอกเพมประเภทรายการทตองการใหแสดงใน Status bar ดงรปท 21 ซงในตวอยางนม 2 รายการคอ ToolStripStatusLabel1 และ ToolStripStatusLabel2

รปท 21 เพมรายการใน Status bar 8.3 ลงเขยนโปรแกรมเพอเรยกใชงาน โดยแกไขใสค าสงเพมเตมในป ม ขอใหพจารณาโคดจากในกรอบ

ดานลางน

รปท 22 แกไขโคดในป มทก าหนด 8.4 ทดสอบรนโปรแกรมด แลวใหกดป มทไดก าหนดค าสงไวแลวสงเกตท Status Bar

Private Sub ToolStripButton1_Click(ByVal….) ToolStripStatusLabel1.Text = "วนท " + Today() ToolStripStatusLabel2.Text = "สรางงานใหม.." Form2.Show() End Sub



9. การเรยกใช นาฬกา (Timer)

ถาตองการใชงานเกยวกบเวลา จะตองเรยกใชคอนโทรล Timer เชน ถาตองการใหมวนและเวลาปจจบนของเครองมา แสดงท Status bar แบบ Real Time มขนตอนดงน

9.1 น า Timer มาวางทฟอรม ในชอนจะแสดงดานลางชอวา Timer1

รปท 23 วาง Timer ไวทฟอรม 9.2 จากนนไปก าหนด Properties ชอ Enabled ใหเปน True เพอให Timer ท างานได

รปท 24 ก าหนด Properties ของ Timer 9.3 ใสโคดท event ชอ Tick ของ Timer โดยการดบเบลคลกท Timer1 แลวก าหนดโคดดงน

รปท 25 ก าหนดโคดลงของ Timer ใน Event Tick - ค าสง DateTime.Now คอ จะแสดงวนทและเวลา - ค าสง DateTime.Now .Minute คอ จะแสดงนาท - ค าสง DateTime.Now .Second คอ จะแสดงวนาท - ค าสง DateTime.Now .Millisecond คอ จะแสดง 1/1000 วนาท - ค าสง DateTime.Now .Month คอ จะแสดงเดอน - ค าสง DateTime.Today คอ จะแสดงวนท

9.4 ทดสอบรนโปรแกรม สงเกตท Status Bar กจะแสดงวนทและเวลาของเครองออกมาแบบ Real Time

Private Sub Timer1_Tick(ByVal ……..) ToolStripStatusLabel1.Text = DateTime.Now End Sub



10. การใช Notify Icon (NotifyIcon) การท าไอคอนเลกๆ ใหแสดงบรเวณ Taskbar ดานขวาลาง เพอใชแปนเสนทางลดการท างานหรอใหรสถานการณ

ท างานของโปรแกรมทพฒนา ซงเราเรยกไอคอนนวา Notify Icon สามารถท าไดดงน

รปท 26 ตวอยาง Notify Icon ทแสดงบน Taskbar 10.1 เรมจากการเลอก Notify Icon คลกวางทฟอรม จากนนกจะปรากฏชออยดานลางวา NotifyIcon1

รปท 27 Notify Icon ทอยบน Form 10.2 จากนนคลก NotifyIcon1 แลวก าหนด Properties ชอ Icon เพอเลอกไอคอนทตองการใหแสดงท

Taskbar ก าหนด ContextMenuStrip กรณคลกขวาทไอคอน เปน ContextMenuStrip1 (ตองสรางไวกอน) และก าหนด Text วา ‘ทดสอบ” ซงเปน TooltipsText ของไอคอนทแสดงบน Taskbar

รปท 28 ตวอยางการก าหนด Properties ของ Notify Icon 10.3 ทดสอบรนโปรแกรมแลวคลกขวาทไอคอนทท าไวทอยบรเวณ Task bar ดานขวา ซงจะไดผลลพธดงรป

รปท 29 ผลการรนโปรแกรมแลวเรยกใช Notify Icon

ก าหนด ContextMenuStrip

ก าหนด Icon

ก าหนด ToolTipsText



11. การใชกลองรายการรป (ImageList)

การก าหนดรปภาพแทนสญลกษณตางๆนนนอกจากใช Properties ชอ Image หรอ Icon แลว กยงสามารถใชกลองรายการรปภาพ (Image List) ทจะมคอนโทรลบางตวสามารถเรยกใชวธการแบบนได เชน TabControl เปนตน

11.1 เรมจากการเลอก ImageList คลกวางทฟอรม จากนนกจะปรากฏชออยดานลางวา ImageList1

รปท 30 การก าหนด ImageList ทอยบนฟอรม 11.2 ท าการเพมรายการเขาไปไวท Images (Collection) โดยจะเลอกทละรายการ เพอเพมเขาไปใน Images

Collection Editor โดยการกดป ม ADD เพอเพมรายการ กดป ม Remove เพอลบรายการรปทง ซงจะมล าดบแสดงใหเหน ปกตจะเรมจากล าดบท 0 ขนไป ดงรป 32 ในขณะทมการเลอกรปภาพนน อาจจะเลอกหลายรปพรอมกนไดดงรปท 33 เมอพอใจแลวกกดป ม OK กลบไปยงฟอรมหลกเพอเรยกใชงานตอไป

รปท 31 การก าหนด Images ใน properties

รปท 32 หนาจอรายการรปใน Images Collection Editor



รปท 33 การเลอกรายการรปหลายๆรป

12. การใชพานอล (Panel) ถาตองการฟอรมมความเปนระเบยบและงายตอการจดการ เชน การเปลยนส การยายเปนกลม เปนตน สามารถท าได

โดยการจดกลมคอนโทรลใหอยในกลมเดยวกน โดยจดวางคอนโทรลทตองการลงในพาเนลได และออกแบบใหไมตองมเสนขอบได รป 34

รปท 34 การวางคอนโทรลตางๆ ลงในพาเนล

13. การใช TabControl (TabControl) บางครงการออกแบบบนฟอรมอาจจะมพนทจ ากด ท าใหเรายากในการทออกแบบเพอวางคอนโทรลใหครบหมดในหนา

เดยว ดงนนเราสามารถออกแบบเพอใชพนทไดมากขน โดยการใชแถบแบงเปนชดๆ ซงจะออกแบบใหวางคอนโทรลตางๆ ลงบน Tab Control แทน วธการนนอกจากจะท าใหดเรยบรอยแลวยงเปนการจดกลมของขอมลเปนชดๆ เมอน าไปออกแบบใชงานแลว ท าใหผใชเขาใจไดงายขนดวย

13.1 เรมจากการเลอก TabControl คลกลากวางทฟอรม ตามขนาดทตองการ ซงคาเรมตนจะปรากกฎแถบขนมา 2 แถบ กอน ดงรป 35 แตสามารถเพมเตมทหลงไดใน Properties



รปท 35 การวางคอนโทรล TabControl 13.2 การเพมจ านวนแถบการแสดงสามารถท าไดโดยการ คลกขวาท TabControl จากนนกจะปรากกฎเมน

ขนมา แลวใหเลอกเมนชอ Add Tab นอกจากเพมแลวกใชวธการเดยวกนเพอใชลบแถบออก

รปท 36 การเพม/ลบ แถบรายการใน TabControl 13.3 ถาตองการเปลยนขอความบนแถบรายการกสามารถแกไขไดท Properties ซงจะม Properties 2 ระดบ

คอ อนแรกจะเปนของ TabControl ทงอน สวนอนท 2 จะเปนเฉพาะของ TabPage แตละหนา เชน ถาตองการเรยกใช ImageList กตองก าหนดท TabControl หลกกอนวาจะเรยกใชตวไหน จากนนคอย

เขาไปในระดบ TabPage แลวก าหนดวาจใชล าดบภาพทเทาไหร ดงรปท 38

รปท 37 การเพม/ลบ แถบรายการใน TabControl



14. การใช GroupBox (GroupBox)

tech vb 2008 express

Documents

text

form2

end

show

tabcontrol

datetime

gt

toolstripstatuslabel1