网站首页 文章专栏 pyqt5实现浏览器与下载文件弹框
pyqt5实现浏览器与下载文件弹框
创建于:2019-06-29 19:06:35 更新于:2024-03-19 02:09:06 羽瀚尘 6692
pyqt5 pyqt5

简介

之前的GUI方案是docker+flask+html+css+js+浏览器,但是很多人都说奇怪。可能他们没有见过这种快速开发桌面应用的方式,只会点击exe文件那种傻瓜的方式。

在实践中也碰到了一个问题,就是各个系统(win,linux)的浏览器各不相同,前端适配非常困难。另外我们希望打开软件时启动docker,关闭窗口时同步关闭docker,使用系统浏览器无法做到这点。因为打开系统浏览器有很多种方案,印象中都是异步,并且没有相应的通知接口。

所以考虑了新方案,docker+flask+html+css+js+自建浏览器,自建浏览器界面做成原生应用的样子。且自建浏览器打算采用pyqt5,其自带chromium。

安装pyqt5

似乎pyqt5比较挑版本,我这里使用ubuntu18.04,python版本为3.6.8

pip install PyQt5
pip install PyQtWebEngine

比较奇怪的是PyQt5.QtWebEngineWidgets并不是自带,而是另外的库,否则会报下面的错误1

ImportError: No module named 'PyQt5.QtWebEngineWidgets'

装好的pyqt5版本

PyQt5==5.12.2
PyQt5-sip==4.19.17
PyQtWebEngine==5.12.1

案例一:基础浏览器

from PyQt5.QtWidgets import QApplication
from PyQt5.QtWebEngineWidgets import QWebEngineView
from PyQt5.QtCore import QUrl

app = QApplication([])
view = QWebEngineView()
view.load(QUrl("http://www.baidu.com"))
view.show()
app.exec_()

案例二:打开新窗口

import sys
from PyQt5.QtWidgets import *
from PyQt5.QtCore import *
from PyQt5.QtWebEngineWidgets import QWebEngineView


################################################
#######创建主窗口
################################################
class MainWindow(QMainWindow):
    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        self.setWindowTitle('My Browser')
        self.showMaximized()

        self.webview = WebEngineView()
        self.webview.load(QUrl("http://localhost:8080/"))
        self.setCentralWidget(self.webview)




################################################
#######创建浏览器
################################################
class WebEngineView(QWebEngineView):
    windowList = []

    # 重写createwindow()
    def createWindow(self, QWebEnginePage_WebWindowType):
        print('Enter new windows')
        new_webview =   WebEngineView()
        new_window = MainWindow()
        new_window.setCentralWidget(new_webview)
        #new_window.show()
        self.windowList.append(new_window)  #注:没有这句会崩溃!!!

        return new_webview


################################################
#######程序入门
################################################
if __name__ == "__main__":
    app = QApplication(sys.argv)
    w = MainWindow()
    w.show()
    sys.exit(app.exec_())

案例三:实现下载功能2

注释掉的代码是为了去掉地址栏,让窗口看起来不像是浏览器。

# v1.2
# created
#   by Roger
# in 2017.1.3

from PyQt5.QtCore import *
from PyQt5.QtWidgets import *
from PyQt5.QtGui import *
from PyQt5.QtWebEngineWidgets import QWebEngineView
import configparser


import sys

class MainWindow(QMainWindow):

    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        # 设置窗口标题
        self.setWindowTitle('谐波分析')
        # 设置窗口图标
        self.setWindowIcon(QIcon('icons/penguin.png'))

        # 设置窗口大小900*600
        self.resize(750, 400)
        self.show()
        self.frame=1
        # 设置浏览器
        self.browser = MyEngineView()
        # config = configparser.ConfigParser()
        # config.readfp(open('url.ini'))
        # url= config.get("URL","url")
        url="http://localhost:8080"
        # 指定打开界面的 URL
        self.browser.setUrl(QUrl(url))
        # 添加浏览器到窗口中
        self.setCentralWidget(self.browser)

        self.tray = QSystemTrayIcon() #创建系统托盘对象  
        self.icon = QIcon('icons/back.png')  #创建图标  
        self.tray.setIcon(self.icon)  #设置系统托盘图标  
        self.tray.show()


        #使用QToolBar创建导航栏,并使用QAction创建按钮
        # 添加导航栏
        navigation_bar = QToolBar('Navigation')
        # 设定图标的大小
        navigation_bar.setIconSize(QSize(16, 16))
        #添加导航栏到窗口中
        self.addToolBar(navigation_bar)

        #QAction类提供了抽象的用户界面action,这些action可以被放置在窗口部件中
        # 添加前进、后退、停止加载和刷新的按钮
        back_button = QAction(QIcon('icons/back.png'), 'Back', self)
        next_button = QAction(QIcon('icons/next.png'), 'Forward', self)
        stop_button = QAction(QIcon('icons/cross.png'), 'stop', self)
        reload_button = QAction(QIcon('icons/renew.png'), 'reload', self)


        back_button.triggered.connect(self.browser.back)
        next_button.triggered.connect(self.browser.forward)
        stop_button.triggered.connect(self.browser.stop)
        reload_button.triggered.connect(self.browser.reload)

        # 将按钮添加到导航栏上
        navigation_bar.addAction(back_button)
        navigation_bar.addAction(next_button)
        navigation_bar.addAction(stop_button)
        navigation_bar.addAction(reload_button)
        '''
        #添加URL地址栏
        self.urlbar = QLineEdit()
        self.urlbar.setText(url)
        # 让地址栏能响应回车按键信号
        self.urlbar.returnPressed.connect(self.navigate_to_url)

        navigation_bar.addSeparator()
        navigation_bar.addWidget(self.urlbar)

        #让浏览器相应url地址的变化
        self.browser.urlChanged.connect(self.renew_urlbar)
        '''
    '''
    def navigate_to_url(self):
        q = QUrl(self.urlbar.text())
        if q.scheme() == '':
            q.setScheme('http')
        self.browser.setUrl(q)

    def renew_urlbar(self, q):
        # 将当前网页的链接更新到地址栏
        self.urlbar.setText(q.toString())
        self.urlbar.setCursorPosition(0)
    '''
class MyEngineView(QWebEngineView):
    '''
    浏览器类。
    '''
    def __init__(self, parent=None, ):
        super(MyEngineView, self).__init__(parent)
        self.parent = parent
        #有下载信号发起
        self.page().profile().downloadRequested.connect(self.on_downloadRequested)

    def createWindow(self,  type):
        '''
        实现点击跳转链接。
        '''
        return self  

    #以下函数里的 :后为注释,无实际作用

        #下载信号连接到的槽
    def on_downloadRequested(self, download : "QWebEngineDownloadItem" ):
        # download是QWebEngineDownloadItem对象;
        download.downloadProgress.connect(self._downloadProgress)
        download.finished.connect(self._finished)

        #下载文件的保存路径及文件名
        old_path = download.path()
        suffix = QFileInfo(old_path).suffix()
        #下载文件类型
        filttype = download.mimeType()
        #后缀切割
        unkonw_suffix = filttype.split(r'/')[-1]
        path, _ =QFileDialog.getSaveFileName(self, "Save File", old_path,  "*."+unkonw_suffix + ";;" + "*."+suffix )

        print(old_path, suffix)

        if path!="":
            download.setPath(path)
            download.accept()

    def _downloadProgress(self , bytesReceived:"qint64", bytesTotal:"qint64"):
        # bytesReceived 当前下载值 ; bytesTotal 文件总大小值
        # self.bytesReceived = bytesReceived
        # self.bytesTotal = bytesTotal
        print(bytesReceived , bytesTotal )

    def _finished(self):
        print("下载完成")

if __name__ == "__main__":
    # 创建应用
    app = QApplication(sys.argv)
    # 创建主窗口
    window = MainWindow()
    # 显示窗口
    window.show()
    # 运行应用,并监听事件
    app.exec_()   

案例四:浏览器与自身应用结合

只给出大致流程

if __name__ == "__main__":
    if False == check_images():
        load_images()

    start_container()
    # wait for sometime
    print('Wait for several seconds...')
    time.sleep(5)
    # 创建应用
    app = QApplication(sys.argv)
    # 创建主窗口
    window = MainWindow()
    # 显示窗口
    window.show()
    # 运行应用,并监听事件
    app.exec_()   

    # stop container
    stop_container()

参考: 1. pyqt5安装问题 2. pyqt5例子