มาสราง 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