Rendering HTML in PySimpleGUI?

Question

Does anyone know if it's possible to have PySimpleGUI render HTML?

I am not after a full-blown browser, just an HTML viewer that lives in a PySimpleGUI window.

I know tkinter has a module called tk_html_widgets, I'm also investigating what webview module can do.

I know it is possible with Qt as PySide comes with a widget of this nature, though I'm really enjoying PySimpleGUI.

I was just wondering if anyone has a suggestion to achieve this.

For example, could I somehow import a TK widget such as tk_html_widgets into PySimpleGUI.

Maybe I'm missing something and pysimpleGUI already has an HTML element that I am unaware of.

score 3 · Accepted Answer · answered Jan 30 '22 at 07:26

Here, just for reference, library tkhtmlview used for HTML parser and builder.

You can call set_html(advertise, html) to update new advertise/html when timeout event, it may hold there when loading something from internet.

from tkhtmlview import html_parser
import PySimpleGUI as sg

def set_html(widget, html, strip=True):
    prev_state = widget.cget('state')
    widget.config(state=sg.tk.NORMAL)
    widget.delete('1.0', sg.tk.END)
    widget.tag_delete(widget.tag_names)
    html_parser.w_set_html(widget, html, strip=strip)
    widget.config(state=prev_state)

html = """
<td colspan="2" class="infobox-image"><a href="https://en.wikipedia.org/wiki/RoboCop" class="image">
<img alt="RoboCop (1987) theatrical poster.jpg" src="https://upload.wikimedia.org/wikipedia/en/thumb/1/16/RoboCop_%281987%29_theatrical_poster.jpg/220px-RoboCop_%281987%29_theatrical_poster.jpg" decoding="async" width="250" height="386" class="thumbborder" srcset="//upload.wikimedia.org/wikipedia/en/1/16/RoboCop_%281987%29_theatrical_poster.jpg 1.5x" data-file-width="248" data-file-height="374"></a>
<div class="infobox-caption" style="text-align:center">Directed by Paul Verhoeven<br>Release date July 17, 1987</div></td>
"""

font = ("Courier New", 12, 'bold')
sg.theme("DarkBlue3")
sg.set_options(font=font)

layout_advertise = [
    [sg.Multiline(
        size=(25, 10),
        border_width=2,
        text_color='white',
        background_color='green',
        disabled=True,
        no_scrollbar=True,
        expand_x=True,
        expand_y=True,
        key='Advertise')],
]

keypad = [
    ["Rad/Deg",          "x!",   "(",  ")", "%", "AC"],
    ["Inv",       "sin", "ln",   "7", "8", "9", "÷" ],
    ["Pi",        "cos", "log",  "4",  "5", "6", "x" ],
    ["e",         "tan", "√",    "1",  "2", "3", "-" ],
    ["Ans",       "EXP", "POW",  "0",  ".", "=", "+" ],
]

layout_calculator = [
    [sg.Button(
        key,
        size=(7, 4),
        expand_x=key=="Rad/Deg",
        button_color=('white', '#405373') if key in "1234567890" else sg.theme_button_color(),
     ) for key in line]
            for line in keypad]

layout = [
    [sg.Frame("Calculator", layout_calculator, expand_x=True, expand_y=True),
     sg.Frame("Advertise",  layout_advertise, expand_x=True, expand_y=True)],
]
window = sg.Window('Title', layout, finalize=True, use_default_focus=False)
for element in window.key_dict.values():
    element.block_focus()

advertise = window['Advertise'].Widget

html_parser = html_parser.HTMLTextParser()
set_html(advertise, html)
width, height = advertise.winfo_width(), advertise.winfo_height()

while True:

    event, values = window.read()
    if event in (sg.WINDOW_CLOSED, 'Exit'):
        break
    print(event, values)

window.close()

Do you have an example in PySimpleGUIQt? – SkySibe Sep 11 '22 at 16:56 — SkySibe, Sep 11 '22 at 16:56
No, I have no idea now about how it to go in PySimpleGUIQt. – Jason Yang Sep 12 '22 at 00:19 — Jason Yang, Sep 12 '22 at 00:19

score 1 · Answer 2 · answered Jan 30 '22 at 02:41

It looks like you can do this with tkhtmlview widgets. I think the key is to get a handle to the tk root node using the TKroot attribute of the PySimpleGUI Window. You should be able to draw most tk widgets using that handle. Here's a simple example that draws an HTML label in a PySimpleGUI window:

import PySimpleGUI as sg
from tkhtmlview import HTMLLabel

layout = [[]]

window = sg.Window('Canvas test', layout, finalize=True)

my_label = HTMLLabel(window.TKroot, html='<h1>foobar</h1>')

my_label.pack()

while True:
    event, values = window.read()
    if event == sg.WIN_CLOSED:
        break

Rendering HTML in PySimpleGUI?

2 Answers2

Linked