[VIDEO] การใช้งาน WebView2 (Edge-Chromium) ด้วย Visual Basic 2017+

thongkorn

Using WebView2 with Visual Basic .NET (2017+) ... คลิปวิดีโอนี้จะสาธิตถึงวิธีการเรียกใช้งาน WebView2 Control ซึ่งเป็น Web Browser ของฟรีตัวใหม่ล่าสุดของ Microsoft ด้วยชุด Canary Channel ซึ่งมีฐานมาจาก Edge-Chromium เท่าที่แอดมินได้ลองทดสอบดู ก็ค่อนข้างมีความเร็ว กินทรัพยากรระบบต่ำ เอามาฝากสำหรับนักพัฒนาที่จำเป็นต้องใช้งาน Desktop Application ผสมกับ Web Application กันล่ะครับ ...
UPDATE:
ต้องดาวน์โหลด WebView2 Runtime (Evergreen Standalone Installer) มาทำการติดตั้งก่อนด้วยครับ
ดาวน์โหลดได้ที่  Download the WebView2 Runtime



โค้ดตัวอย่าง ...

1. Public Class frmWebView
   
2.     Private Sub frmWebView_Load(sender As Object, e As EventArgs) Handles MyBase.Load
   
3.         txtURL.Text = "https://www.google.co.th"
   
4.     End Sub
   
5. 
   
6.     Private Sub txtURL_KeyPress(sender As Object, e As KeyPressEventArgs) Handles txtURL.KeyPress
   
7.         '// หากมีการกด ENTER
   
8.         If Asc(e.KeyChar) = 13 Then
   
9.             '// ปิดเสียงการกดคีย์
   
10.             e.Handled = True
    
11.             Try
    
12.                 '// หรือ --> WebView21.CoreWebView2.Navigate(txtURL.Text)
    
13.                 WebView21.Source = New Uri(txtURL.Text)
    
14.             Catch ex As UriFormatException
    
15.                 MessageBox.Show("ต้องปรับรูปแบบ URL ให้ครบ เช่นต้องนำหน้าด้วย HTTP[S]://")
    
16.             Catch ex As Exception
    
17.                 MessageBox.Show("Error: {ex}")
    
18.             End Try
    
19.         End If
    
20.     End Sub
    
21. End Class

คัดลอกไปที่คลิปบอร์ด

โค้ดทดสอบกับการรัน JavaScript (เราสามารถฝัง Script เอาไว้ในโปรเจค หรือดึงมาจากไฟล์เอกสาร HTML ก็ได้) ... เพิ่มปุ่ม Button เข้่ามา 1 ตัว ให้ชื่อว่า btnHTML

1. Public Class Form1
   
2.     Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
   
3.         txtURL.Text = "https://www.google.co.th"
   
4.         WebView21.Source = New Uri(txtURL.Text)
   
5.     End Sub
   
6.     Private Sub btnHtml_Click(sender As Object, e As EventArgs) Handles btnHtml.Click
   
7.         Dim strHtml As String = "<h1>สวัสดีชาวโลก</h1><h2>Hello, World</h2>"
   
8.         strHtml = strHtml + "<form><input type=""button"" id=""btn01"" value=""OK""></form>
   
9.         <p>Click the ""Disable"" button to disable the ""OK"" button:</p>
   
10.         <button onclick=""disableElement()"">Disable</button><script>
    
11.         function disableElement() {
    
12.           document.getElementById(""btn01"").disabled = true;
    
13.         }</script>"
    
14.         WebView21.NavigateToString(strHtml)
    
15.     End Sub
    
16.     Private Sub txtURL_KeyPress(sender As Object, e As KeyPressEventArgs) Handles txtURL.KeyPress
    
17.         '// Press Enter in TextBox
    
18.         If Asc(e.KeyChar) = 13 Then
    
19.             '// No Beep
    
20.             e.Handled = True
    
21.             Try
    
22.                 Me.WebView21.Source = New Uri(txtURL.Text)
    
23.                 '// OR
    
24.                 '// Me.WebView21.CoreWebView2.Navigate(txtURL.Text)
    
25.             Catch ex As UriFormatException
    
26.                 MessageBox.Show("Full URL ex. --> HTTP[S]://")
    
27.             Catch ex As Exception
    
28.                 MessageBox.Show(ex.Message)
    
29.             End Try
    
30. 
    
31.         End If
    
32.     End Sub
    
33. 
    
34. End Class

คัดลอกไปที่คลิปบอร์ด

ดาวน์โหลดโค้ดต้นฉบับ VB.NET (2017) ได้ที่นี่ (จำเป็นต้องใช้ .NET Framework 4.6.2 ขึ้นไปน่ะครับ) ...

Oplot

ขอบคุณมากครับ