How to insert a web browser in Python QT Designer

Question

I have created a simple user interface in QT Designer 5 and would like to include a widget that displays a webpage. I use the following code to use the ui file with python:

from PyQt5 import uic, QtWidgets
import sys

app = QtWidgets.QApplication(sys.argv)
window = uic.loadUi("test.ui")
window.show()
sys.exit(app.exec_())

There doesn't seem to a widget I can use to insert a web browser widget in QT Designer so am looking for a widget to implement this by using a class or something and adding the widget to the interface already created in Designer.

eyllanesc · Accepted Answer · 2018-10-05T02:08:07.313

A simple solution is to use QWebEngineView, in my case I can find it in Qt Designer:

But if you do not have it, there is no problem, for that there is to promote a widget. In a previous answer I point out how it is done with QVideoWidget, but in your case you should only change

Promoted class name: QWebEngineView
Header file: PyQt5.QtWebEngineWidgets

test.ui

<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
 <class>Form</class>
 <widget class="QWidget" name="Form">
  <property name="geometry">
   <rect>
    <x>0</x>
    <y>0</y>
    <width>400</width>
    <height>300</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string>Form</string>
  </property>
  <layout class="QVBoxLayout" name="verticalLayout">
   <item>
    <widget class="QWebEngineView" name="widget" native="true"/>
   </item>
  </layout>
 </widget>
 <customwidgets>
  <customwidget>
   <class>QWebEngineView</class>
   <extends>QWidget</extends>
   <header>PyQt5.QtWebEngineWidgets</header>
   <container>1</container>
  </customwidget>
 </customwidgets>
 <resources/>
 <connections/>
</ui>

main.py

import os
import sys

from PyQt5 import QtCore, QtWidgets, QtWebEngineWidgets, uic

if __name__ == '__main__':
    app = QtWidgets.QApplication(sys.argv)
    path_ui = os.path.join(os.path.dirname(__file__), "test.ui")
    window = uic.loadUi(path_ui)
    window.widget.load(QtCore.QUrl("https://stackoverflow.com/"))
    window.show()
    sys.exit(app.exec_())

Amazing, thanks a lot!!! How do you get to know all this stuff though?. I'm having a hard time piecing together the documentation and haven't found any good easy to follow Pyqt tutorials. Or is it mostly just a good understanding of how classes work? — West, Oct 05 '18 at 02:37
@West I recommend reading the Qt docs, although it is for C++ many of the concepts are maintained for Python, and the other is to try and understand. With the questions I ask I learn more and finally not only check the PyQt posts but also the Qt ones as many are conceptually applicable to PyQt. — eyllanesc, Oct 05 '18 at 02:42

How to insert a web browser in Python QT Designer

1 Answers1