Dùng trình duyệt ảo và mở web trong Unreal Engine

Trong bài viết này mình sẽ hướng dẫn các bạn tạo một trình duyệt ảo (bằng UMG) hoặc mở một website với trình duyệt mặc định của PC.

Cài đặt plugin Web Browser

Unreal Engine đã cung cấp cho người dụng một tiện ích (plugin) tên là Web Browser. Các bạn chỉ cần vào mục thiết lập, bật tiện ích lên và khởi động lại editor

Mở một trang web bằng trình duyệt mặc định máy tính

Để mở môt trang web bằng trình duyệt mặc định của máy tính, với Blueprint, các bạn chỉ cần gọi hàm LaunchURL:

Với C++, các bạn có thể gọi cú pháp như sau:

FPlatformProcess::LaunchURL(TEXT("https://jakesto.com"), NULL, NULL);

Tạo một trình duyệt ảo với UMG

Các bạn cũng có thể tạo cho mình một trình duyệt ảo bằng cách tận dụng UMG để thiết kế và hiển thị.

Trước tiên, ta hãy tạo một UMG và đặt tên là WBP_WebBrowser.

Mở WBP_WebBrowser lên, ở tab Palette, hãy kiếm component tên là Web Browser và thả vào giữa Canvas Panel. Nhớ chỉnh vị trí, kích thước và anchor theo ý của bạn.

Ở mục Initial URL, các bạn có thể điền một địa chỉ mặc định vào.

Để truyền địa chỉ web cần mở và thực hiện mở web trên trình duyệt ảo, các bạn chỉ cần gọi hàm LoadURL từ WebBrowser

Như vậy là chúng ta đã xong trình duyệt ảo cơ bản.

Ngoài ra các bạn cũng có thể tạo một thanh địa chỉ giống ở trình duyệt ngoài, sau đó có thể vừa cho người dùng nhập địa chỉ, vừa hiển thị địa chỉ đầy đủ của web:

Ở ảnh trên, mình tạo một VerticalBox để giữ thanh trình duyệt và trình duyệt. Sau đó, tạo 2 event tương ứng từ WebBrowser và EditableTB:

• On Url Changed (của WebBrowser): sự kiện này sẽ được gọi khi địa chỉ web đã trả về url đầy đủ.
• On Text Commited (của EditableTB): sự kiện này sẽ được gọi khi người dùng thực hiện các thao tác commit (thông thường là ấn enter).

Kết quả cuối cùng ta được như sau 😀