มาสราง Web Browser แบบงายใชกันเองดกีวา [ultra_mcu@msn.com ] 

การพัฒนาโปรแกรมในทกุวันนี้งายขึ้นทุกวัน เพราะเครื่องมือที่ที่ใชพัฒนาโปรแกรมนั้นมคีวามสะดวกขึ้นมาก เชน

โปรแกรม Microsoft Visual Studio ที่ผูพัฒนาสามารถที่จะเลือก Control ตาง ๆ มีใสใน Form ไดทันทีโดยที ่tool จะเปน

ตัวสราง code ใหอัตโนมัต ิโดยในบทความนี้จะยกตัวอยางการสราง Web Browser แบบงาย  

โดย Tool ที่เลือกใชนั้นคือ Microsoft Visual Studio และภาษาที่ลเอกใชนั้นจะใช ภาษา C#

 หรือถาผูอานทานใดถนดัเขียนภาษา Basic กส็ามารถใช VB.NET ก็เพราทั้ง VB.NET และ C# นั้นใช object 

ที่รันอยูบนสถาปตยกรรม .NET ตัวเดียวกัน ดังนั้นการพัฒนาของทั้งสองภาษาจึงตางกันที่ syntax  

   รูปที่ 1 หนาตาง New Project 

จากรูปที่ 1 ในชอง Project types  เลือก ภาษาที่จะใชในการพัฒนา โดยในบทความนี้จะเลือก Visual C# 

ชอง Templates เลือกลกัษณะของ Application โดยบทความนี้จะพัฒนา Windows Application 

ชอง Name ใสชื่อ Project ในบทความนี้ใสเปน uEasyWebbrowser จากนั้นกด OK เพื่อสราง Project ใหม  

รูปที่ 2 Microsoft Visual Studio Design Explorer 

หลังจากเสร็จสิน้ขั้นตอนขางตนจะโปรแกรมจะสรางหนา Form (หนาตาง Windows) ใหอัตโนมัติ

ดังรูปที่ 2 โดย Form จะใชเปนพื้นที่ในการพัฒนาโปรแกรม  

รูปที่ 3 Tool Box  

ใน Tool Box จะเปนที่เก็บรวบรวม Control ตาง ๆ ที่จะใชในการพัฒนาโปรแกรม

โดยในโปรแกรมที่จะพัฒนา ๆ จะเลือกใช Control ตาง ๆ ดังนี้

1.  

2.  

3.  

4.         

   

เลือก Control ทั้งสามใสใน Form ดังรูปที่ 3  

 

รูปที่ 3 เลือก Control มาใสใน Form 

จากน้ันใหเปลี่ยน Properties ของ Control ทั้งหมด ดังตารางที่ 1   

Control Name  Rename  Text Label1  lbl1  URL: textBox1  txtUrl  “” button1  btGo  Go button2  btBack  Back webBrowser1  wb1  ‐ Form1  ‐  My Easy Web Browser 

ตารางที่ 1 รายละเอียด Control 

จากน้ัน Copy Code ลงในหนา source code   private void btGo_Click(object sender, EventArgs e) { if (txtUrl.Text.IndexOf("http://") == -1) { txtUrl.Text = "http://" + txtUrl.Text; wb1.Navigate(txtUrl.Text); } else { wb1.Navigate(txtUrl.Text); } } private void btBack_Click(object sender, EventArgs e) { wb1.GoBack(); }  

จากน้ัน Build Project แลวทําลองรันดูจะไดผลดังนี ้

 

หรือจะลองสราง Shortcut จาก ปุมกดงายโดยการเพิ่มลงไปดังนี้ 

จากน้ันใหเปลี่ยน Properties ของ Control label1 – label4 ดังตารางที่ 2 

 

Control Name  Rename  Text lable1  lblRobot  Robot NU lable2  lblGoogle  Google lable3  lblMornor  Mornor.com lable4  lblCPENU  CPE.nu.ac.th  จากน้ันเพิ่ม Event Double Click ให Label ตาง ๆ ดังนี้ private void lblRobot_DoubleClick(object sender, EventArgs e) { wb1.Navigate("http://www.robotnu.com"); txtUrl.Text = "http://www.robotnu.com"; } private void lblCPENU_Click(object sender, EventArgs e) { wb1.Navigate("http://www.cpe.nu.ac.th"); txtUrl.Text = "http://www.cpe.nu.ac.th"; } private void lblGoogle_Click(object sender, EventArgs e) { wb1.Navigate("http://www.google.co.th"); txtUrl.Text = "http://www.google.co.th"; } private void lblMornor_Click(object sender, EventArgs e) { wb1.Navigate("http://www.mornor.com"); txtUrl.Text = "http://www.mornor.com"; }

จากน้ัน Build Project แลวทําลองรันดู

 

หลังจากเสร็จสิน้บทความนี้ทานผูอานกส็ามารถที่จะสราง  Web Browser งาย ๆ ไดดวยตัวทานเอง

ultra mcu