Creando un navegador con pestañas usando PyQt5

En este artículo, veremos cómo podemos crear un navegador con pestañas usando PyQt5.

El navegador web es una aplicación de software para acceder a información en la World Wide Web. Cuando un usuario solicita una página web de un sitio web en particular, el navegador web recupera el contenido necesario de un servidor web y luego muestra la página en la pantalla.
Tabulación : agregar pestañas complica un poco las funciones internas del navegador, ya que ahora será necesario realizar un seguimiento de la vista del navegador actualmente activa, tanto para actualizar los elementos de la interfaz de usuario (barra de URL) para cambiar de estado en la ventana actualmente activa como para garantizar la interfaz de usuario. los eventos se envían a la vista web correcta.
PyQt5es un kit de herramientas GUI multiplataforma, un conjunto de enlaces de python para Qt v5. Uno puede desarrollar una aplicación de escritorio interactiva con tanta facilidad debido a las herramientas y la simplicidad que ofrece esta biblioteca. Se ha instalado usando el comando dado a continuación. 

pip install PyQt5

Pasos de implementación de GUI: 
1. Cree una ventana principal 
2. Cree un QTabWidget para tabular, configúrelo como widget central, hágalos documentados y cerrables, a continuación se muestra cómo se verán las pestañas 

3. Cree una barra de estado para mostrar los consejos de estado 
4. Cree una barra de herramientas y agregue el botón de navegación y la edición de línea para mostrar la URL, a continuación está caliente, la barra de herramientas se verá así 

Pasos de implementación de back-end: 
1. Agregar acción al objeto QTabWidget cuando se presiona 
el doble clic 2. Dentro de la acción de doble clic, verifique si el doble clic no está en ninguna pestaña y luego llame al método de pestaña abierta 
3. Dentro de la pestaña abierta, método cree un objeto QUrl y el objeto QWebEngineView y establezca QUrl en él y obtenga el índice de la pestaña 
4. Agregue la acción de actualización de URL al objeto QWebEngineView cuando se cambie la URL. 
5. Dentro de la actualización, verifique la acción de URL si la pestaña abierta llama a la acción, luego cambie la URL de la barra de URL y cambie la posición del cursor 
6. Agregue otra acción de título de actualización al objeto QWebEngineView cuando finalice la carga 
7. Dentro del método de título de actualización, actualice el título de la ventana como el título de la página si la pestaña abierta solo llama a la 
acción. 8. Agregue acción a las pestañas cuando se cambie la pestaña 
. 9. Dentro de la acción de cambio de pestaña, obtenga la actualización de URL. la edición en línea de URL y el título 
10. Agregue acciones a los botones de navegación usando las funciones integradas del objeto QWebEngineView para recargar, retroceder, detener y avanzar botones 
11. Agregue acción al botón de inicio y dentro de la acción cambie la URL a google.com 
12. Agregue acción a la edición de línea cuando se presiona la tecla de retorno 
13. Dentro de la línea, edite la acción obtenga el texto y convierta este texto en el objeto QUrl y configure el esquema si es nulo y configure esta URL en el pestaña actual 
 

A continuación se muestra la implementación.  

Python3

# importing required libraries
from PyQt5.QtCore import *
from PyQt5.QtWidgets import *
from PyQt5.QtGui import *
from PyQt5.QtWebEngineWidgets import *
from PyQt5.QtPrintSupport import *
import os
import sys
 
# main window
class MainWindow(QMainWindow):
 
    # constructor
    def __init__(self, *args, **kwargs):
        super(MainWindow, self).__init__(*args, **kwargs)
 
        # creating a tab widget
        self.tabs = QTabWidget()
 
        # making document mode true
        self.tabs.setDocumentMode(True)
 
        # adding action when double clicked
        self.tabs.tabBarDoubleClicked.connect(self.tab_open_doubleclick)
 
        # adding action when tab is changed
        self.tabs.currentChanged.connect(self.current_tab_changed)
 
        # making tabs closeable
        self.tabs.setTabsClosable(True)
 
        # adding action when tab close is requested
        self.tabs.tabCloseRequested.connect(self.close_current_tab)
 
        # making tabs as central widget
        self.setCentralWidget(self.tabs)
 
        # creating a status bar
        self.status = QStatusBar()
 
        # setting status bar to the main window
        self.setStatusBar(self.status)
 
        # creating a tool bar for navigation
        navtb = QToolBar("Navigation")
 
        # adding tool bar tot he main window
        self.addToolBar(navtb)
 
        # creating back action
        back_btn = QAction("Back", self)
 
        # setting status tip
        back_btn.setStatusTip("Back to previous page")
 
        # adding action to back button
        # making current tab to go back
        back_btn.triggered.connect(lambda: self.tabs.currentWidget().back())
 
        # adding this to the navigation tool bar
        navtb.addAction(back_btn)
 
        # similarly adding next button
        next_btn = QAction("Forward", self)
        next_btn.setStatusTip("Forward to next page")
        next_btn.triggered.connect(lambda: self.tabs.currentWidget().forward())
        navtb.addAction(next_btn)
 
        # similarly adding reload button
        reload_btn = QAction("Reload", self)
        reload_btn.setStatusTip("Reload page")
        reload_btn.triggered.connect(lambda: self.tabs.currentWidget().reload())
        navtb.addAction(reload_btn)
 
        # creating home action
        home_btn = QAction("Home", self)
        home_btn.setStatusTip("Go home")
 
        # adding action to home button
        home_btn.triggered.connect(self.navigate_home)
        navtb.addAction(home_btn)
 
        # adding a separator
        navtb.addSeparator()
 
        # creating a line edit widget for URL
        self.urlbar = QLineEdit()
 
        # adding action to line edit when return key is pressed
        self.urlbar.returnPressed.connect(self.navigate_to_url)
 
        # adding line edit to tool bar
        navtb.addWidget(self.urlbar)
 
        # similarly adding stop action
        stop_btn = QAction("Stop", self)
        stop_btn.setStatusTip("Stop loading current page")
        stop_btn.triggered.connect(lambda: self.tabs.currentWidget().stop())
        navtb.addAction(stop_btn)
 
        # creating first tab
        self.add_new_tab(QUrl('http://www.google.com'), 'Homepage')
 
        # showing all the components
        self.show()
 
        # setting window title
        self.setWindowTitle("Geek PyQt5")
 
    # method for adding new tab
    def add_new_tab(self, qurl = None, label ="Blank"):
 
        # if url is blank
        if qurl is None:
            # creating a google url
            qurl = QUrl('http://www.google.com')
 
        # creating a QWebEngineView object
        browser = QWebEngineView()
 
        # setting url to browser
        browser.setUrl(qurl)
 
        # setting tab index
        i = self.tabs.addTab(browser, label)
        self.tabs.setCurrentIndex(i)
 
        # adding action to the browser when url is changed
        # update the url
        browser.urlChanged.connect(lambda qurl, browser = browser:
                                   self.update_urlbar(qurl, browser))
 
        # adding action to the browser when loading is finished
        # set the tab title
        browser.loadFinished.connect(lambda _, i = i, browser = browser:
                                     self.tabs.setTabText(i, browser.page().title()))
 
    # when double clicked is pressed on tabs
    def tab_open_doubleclick(self, i):
 
        # checking index i.e
        # No tab under the click
        if i == -1:
            # creating a new tab
            self.add_new_tab()
 
    # when tab is changed
    def current_tab_changed(self, i):
 
        # get the curl
        qurl = self.tabs.currentWidget().url()
 
        # update the url
        self.update_urlbar(qurl, self.tabs.currentWidget())
 
        # update the title
        self.update_title(self.tabs.currentWidget())
 
    # when tab is closed
    def close_current_tab(self, i):
 
        # if there is only one tab
        if self.tabs.count() < 2:
            # do nothing
            return
 
        # else remove the tab
        self.tabs.removeTab(i)
 
    # method for updating the title
    def update_title(self, browser):
 
        # if signal is not from the current tab
        if browser != self.tabs.currentWidget():
            # do nothing
            return
 
        # get the page title
        title = self.tabs.currentWidget().page().title()
 
        # set the window title
        self.setWindowTitle("% s - Geek PyQt5" % title)
 
    # action to go to home
    def navigate_home(self):
 
        # go to google
        self.tabs.currentWidget().setUrl(QUrl("http://www.google.com"))
 
    # method for navigate to url
    def navigate_to_url(self):
 
        # get the line edit text
        # convert it to QUrl object
        q = QUrl(self.urlbar.text())
 
        # if scheme is blank
        if q.scheme() == "":
            # set scheme
            q.setScheme("http")
 
        # set the url
        self.tabs.currentWidget().setUrl(q)
 
    # method to update the url
    def update_urlbar(self, q, browser = None):
 
        # If this signal is not from the current tab, ignore
        if browser != self.tabs.currentWidget():
 
            return
 
        # set text to the url bar
        self.urlbar.setText(q.toString())
 
        # set cursor position
        self.urlbar.setCursorPosition(0)
 
# creating a PyQt5 application
app = QApplication(sys.argv)
 
# setting name to the application
app.setApplicationName("Geek PyQt5")
 
# creating MainWindow object
window = MainWindow()
 
# loop
app.exec_()

Producción : 

Publicación traducida automáticamente

Artículo escrito por rakshitarora y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *