python GUI库图形界面开发之PyQt5浏览器控件QWebEngineView详细使用方法

站长资源 2024/11/24 佚名

2 0 1

PyQt5浏览器控件QWebEngineView

PyQt5使用QWebEngineView控件来展示HTML页面，对老版本的QWebView类不在进行维护，因为QWebEngineView使用CHromium内核可以给用户带来更好的体验

QWebEngineView类中常用方法

方法描述 load(QUrl url) 加载指定的URL并显示 setHtml（QString&html）将网页视图的内容设置为指定的HTML内容

QWebEngineView控件使用load（）函数加载一个Web页面，实际上就是使用HTTP Get方法加载web页面，这个控件可以加载本地的web页面，也可以加载外部的WEb页面，其核心代码如下

view=QWebEngineView（）
view.load(QUrl('https://www.jb51.net'))
view.show()

QWebEngineView加载显示外部的web页面实例

import sys
from 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('加载外部网页的例子')
    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_())

运行效果图如下

在这里，我输入的url是我的博客地址，所以加载的也就是这个网址请求的web界面

QWebEngineView加载并显示嵌入的HTML代码

import sys
from 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('加载本地网页的例子')
    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_())

运行图片如下

注意使用QWebEngineView对象的setHTML（）函数渲染HTml页面时，如果页面中使用的JavaScript代码超过2M，程序渲染就会失败

QWebEngineView调用JavaScript代码实例

通过QWebEnginePage类的runJavaScript（str,Callable）函数可以方便地实现PyQt和HTML、JavaScript的双向通信，也实现了python代码和Html，JavaScript代码的解耦，便于开发人员进行分工协作，在PyQt对象中，访问JavaScript的核心代码如下

QWebEnginePage.runJavaScript(str,Callable)

完整代码

import sys

from PyQt5.QtWebEngineWidgets import QWebEngineView
from PyQt5.QtWidgets import QApplication, QWidget, QVBoxLayout, QPushButton

# 创建一个 application实例
app = QApplication(sys.argv)
win = QWidget()
win.setWindowTitle('Web页面中的JavaScript与 QWebEngineView交互例子')

# 创建一个垂直布局器
layout = QVBoxLayout()
win.setLayout(layout)

# 创建一个 QWebEngineView 对象
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 style="display: none;" type="submit" id="submit-btn"></input>
   </form>
  </body>
 </html>
''')

# 创建一个按钮去调用 JavaScript代码
button = QPushButton('设置全名')


def js_callback( result ):
  print(result)


def complete_name():
  view.page().runJavaScript('completeAndReturnName();', js_callback)


# 按钮连接 'complete_name'槽，当点击按钮是会触发信号
button.clicked.connect(complete_name)

# 把QWebView和button加载到layout布局中
layout.addWidget(view)
layout.addWidget(button)

# 显示窗口和运行app
win.show()
sys.exit(app.exec_())

代码分析

在本例中，初始化一个QWebEngineView对象，对象名称View，然后通过View。page（）函数获得一个QWebEnginePage对象，就可以访问整个web界面了。这个QWebEnginePage对象有一个异步的runJavaScript（）函数，需要一个回调函数接收结果，其核心代码如下

def js_callback( result ):
  print(result)


def complete_name():
  view.page().runJavaScript('completeAndReturnName();', js_callback)

本文详细介绍了PyQt5浏览器控件QWebEngineView的使用方法，包括使用QWebEngineView调用JavaScript代码，更多关于PyQt5浏览器控件QWebEngineView的使用方法请查看下面的相关链接

python,GUI库图形界面开发,PyQt5浏览器控件QWebEngineView使用方法,python,PyQt5浏览器控件QWebEngineView,QWebEngineView调用JavaScript代码

广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！

评论“python GUI库图形界面开发之PyQt5浏览器控件QWebEngineView详细使用方法”

暂无评论...

《魔兽世界》大逃杀！60人新游玩模式《强袭风暴》3月21日上线

暴雪近日发布了《魔兽世界》10.2.6 更新内容，新游玩模式《强袭风暴》即将于3月21 日在亚服上线，届时玩家将前往阿拉希高地展开一场 60 人大逃杀对战。

艾泽拉斯的冒险者已经征服了艾泽拉斯的大地及遥远的彼岸。他们在对抗世界上最致命的敌人时展现出过人的手腕，并且成功阻止终结宇宙等级的威胁。当他们在为即将于《魔兽世界》资料片《地心之战》中来袭的萨拉塔斯势力做战斗准备时，他们还需要在熟悉的阿拉希高地面对一个全新的敌人──那就是彼此。在《巨龙崛起》10.2.6 更新的《强袭风暴》中，玩家将会进入一个全新的海盗主题大逃杀式限时活动，其中包含极高的风险和史诗级的奖励。
《强袭风暴》不是普通的战场，作为一个独立于主游戏之外的活动，玩家可以用大逃杀的风格来体验《魔兽世界》，不分职业、不分装备（除了你在赛局中捡到的），光是技巧和战略的强弱之分就能决定出谁才是能坚持到最后的赢家。本次活动将会开放单人和双人模式，玩家在加入海盗主题的预赛大厅区域前，可以从强袭风暴角色画面新增好友。游玩游戏将可以累计名望轨迹，《巨龙崛起》和《魔兽世界：巫妖王之怒经典版》的玩家都可以获得奖励。

更新日志

2024年11月24日