python GUI庫(kù)圖形界面開發(fā)之PyQt5瀏覽器控件QWebEngineView詳細(xì)使用方法
PyQt5使用QWebEngineView控件來(lái)展示HTML頁(yè)面，對(duì)老版本的QWebView類不在進(jìn)行維護(hù)，因?yàn)镼WebEngineView使用CHromium內(nèi)核可以給用戶帶來(lái)更好的體驗(yàn)
QWebEngineView類中常用方法 方法 描述 load(QUrl url) 加載指定的URL并顯示 setHtml（QString&html） 將網(wǎng)頁(yè)視圖的內(nèi)容設(shè)置為指定的HTML內(nèi)容QWebEngineView控件使用load（）函數(shù)加載一個(gè)Web頁(yè)面，實(shí)際上就是使用HTTP Get方法加載web頁(yè)面，這個(gè)控件可以加載本地的web頁(yè)面，也可以加載外部的WEb頁(yè)面，其核心代碼如下
view=QWebEngineView（）view.load(QUrl(’https://www.jb51.net’))view.show()QWebEngineView加載顯示外部的web頁(yè)面實(shí)例
import sysfrom PyQt5.QtCore import *from PyQt5.QtGui import *from PyQt5.QtWidgets import *from PyQt5.QtWebEngineWidgets import *class MainWindow(QMainWindow): def __init__(self): super(MainWindow, self).__init__() self.setWindowTitle(’加載外部網(wǎng)頁(yè)的例子’) self.setGeometry(5,30,1355,730) self.browser=QWebEngineView() #加載外部的web界面 self.browser.load(QUrl(’https://www.jb51.net’)) self.setCentralWidget(self.browser)if __name__ == ’__main__’: app=QApplication(sys.argv) win=MainWindow() win.show() app.exit(app.exec_())
運(yùn)行效果圖如下
在這里，我輸入的url是我的博客地址，所以加載的也就是這個(gè)網(wǎng)址請(qǐng)求的web界面
QWebEngineView加載并顯示嵌入的HTML代碼import sysfrom PyQt5.QtCore import *from PyQt5.QtGui import *from PyQt5.QtWidgets import *from PyQt5.QtWebEngineWidgets import *class MainWindow(QMainWindow): def __init__(self): super(MainWindow, self).__init__() self.setWindowTitle(’加載本地網(wǎng)頁(yè)的例子’) self.setGeometry(5,30,1355,730) self.browser=QWebEngineView() # #加載外部的web界面 # url=r’index.html’ # self.browser.load(QUrl(url)) self.browser.setHtml(’’’<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <title>Title</title></head><body><h1>Hello PyQt5</h1><h1>Hello PyQt5</h1><h1>Hello PyQt5</h1><h1>Hello PyQt5</h1><h1>Hello PyQt5</h1></body></html>’’’) self.setCentralWidget(self.browser)if __name__ == ’__main__’: app=QApplication(sys.argv) win=MainWindow() win.show() app.exit(app.exec_())
運(yùn)行圖片如下
注意使用QWebEngineView對(duì)象的setHTML（）函數(shù)渲染HTml頁(yè)面時(shí)，如果頁(yè)面中使用的JavaScript代碼超過(guò)2M，程序渲染就會(huì)失敗
QWebEngineView調(diào)用JavaScript代碼實(shí)例通過(guò)QWebEnginePage類的runJavaScript（str,Callable）函數(shù)可以方便地實(shí)現(xiàn)PyQt和HTML、JavaScript的雙向通信，也實(shí)現(xiàn)了python代碼和Html，JavaScript代碼的解耦，便于開發(fā)人員進(jìn)行分工協(xié)作，在PyQt對(duì)象中，訪問(wèn)JavaScript的核心代碼如下
QWebEnginePage.runJavaScript(str,Callable)
完整代碼
import sysfrom PyQt5.QtWebEngineWidgets import QWebEngineViewfrom PyQt5.QtWidgets import QApplication, QWidget, QVBoxLayout, QPushButton# 創(chuàng)建一個(gè) application實(shí)例app = QApplication(sys.argv)win = QWidget()win.setWindowTitle(’Web頁(yè)面中的JavaScript與 QWebEngineView交互例子’)# 創(chuàng)建一個(gè)垂直布局器layout = QVBoxLayout()win.setLayout(layout)# 創(chuàng)建一個(gè) QWebEngineView 對(duì)象view = QWebEngineView()view.setHtml(’’’ <html> <head> <title>A Demo Page</title> <script language='javascript'> // Completes the full-name control and // shows the submit button function completeAndReturnName() { var fname = document.getElementById(’fname’).value; var lname = document.getElementById(’lname’).value; var full = fname + ’’ + lname; document.getElementById(’fullname’).value = full; document.getElementById(’submit-btn’).style.display = ’block’; return full; } </script> </head> <body> <form> <label for='fname'>First name:</label> <input type='text' name='fname' id='fname'></input> <br /> <label for='lname'>Last name:</label> <input type='text' name='lname' id='lname'></input> <br /> <label for='fullname'>Full name:</label> <input disabled type='text' name='fullname' id='fullname'></input> <br /> <input type='submit' id='submit-btn'></input> </form> </body> </html>’’’)# 創(chuàng)建一個(gè)按鈕去調(diào)用 JavaScript代碼button = QPushButton(’設(shè)置全名’)def js_callback( result ): print(result)def complete_name(): view.page().runJavaScript(’completeAndReturnName();’, js_callback)# 按鈕連接 ’complete_name’槽，當(dāng)點(diǎn)擊按鈕是會(huì)觸發(fā)信號(hào)button.clicked.connect(complete_name)# 把QWebView和button加載到layout布局中l(wèi)ayout.addWidget(view)layout.addWidget(button)# 顯示窗口和運(yùn)行appwin.show()sys.exit(app.exec_())
代碼分析
在本例中，初始化一個(gè)QWebEngineView對(duì)象，對(duì)象名稱View，然后通過(guò)View。page（）函數(shù)獲得一個(gè)QWebEnginePage對(duì)象，就可以訪問(wèn)整個(gè)web界面了。這個(gè)QWebEnginePage對(duì)象有一個(gè)異步的runJavaScript（）函數(shù)，需要一個(gè)回調(diào)函數(shù)接收結(jié)果，其核心代碼如下
def js_callback( result ): print(result)def complete_name(): view.page().runJavaScript(’completeAndReturnName();’, js_callback)
本文詳細(xì)介紹了PyQt5瀏覽器控件QWebEngineView的使用方法，包括使用QWebEngineView調(diào)用JavaScript代碼，更多關(guān)于PyQt5瀏覽器控件QWebEngineView的使用方法請(qǐng)查看下面的相關(guān)鏈接
相關(guān)文章：
1. python GUI庫(kù)圖形界面開發(fā)之PyQt5布局控件QGridLayout詳細(xì)使用方法與實(shí)例2. python GUI庫(kù)圖形界面開發(fā)之PyQt5中QWebEngineView內(nèi)嵌網(wǎng)頁(yè)與Python的數(shù)據(jù)交互傳參詳細(xì)方法實(shí)例3. python GUI庫(kù)圖形界面開發(fā)之PyQt5信號(hào)與槽事件處理機(jī)制詳細(xì)介紹與實(shí)例解析4. python GUI庫(kù)圖形界面開發(fā)之PyQt5窗口布局控件QStackedWidget詳細(xì)使用方法5. python GUI庫(kù)圖形界面開發(fā)之PyQt5布局控件QHBoxLayout詳細(xì)使用方法與實(shí)例6. python GUI庫(kù)圖形界面開發(fā)之pyinstaller打包python程序?yàn)閑xe安裝文件7. python GUI庫(kù)圖形界面開發(fā)之PyQt5布局控件QVBoxLayout詳細(xì)使用方法與實(shí)例8. python GUI庫(kù)圖形界面開發(fā)之PyQt5表格控件QTableView詳細(xì)使用方法與實(shí)例9. python GUI庫(kù)圖形界面開發(fā)之PyQt5單行文本框控件QLineEdit詳細(xì)使用方法與實(shí)例10. python GUI庫(kù)圖形界面開發(fā)之PyQt5表單布局控件QFormLayout詳細(xì)使用方法與實(shí)例
網(wǎng)公網(wǎng)安備