how to change displayed images in pysimplegui

giovanni trivieri 0
Viewed 37

I've created the GUI as per following code. Is it feasible to change the displayed image with a new one by clicking on the image button, so that the new image can be saved when the form is updated? Moreover, is it feasible to display only the filled fields once the updated (and saved) form is uploaded? Thanks in advance

# ----------- Importing Libraries ---------------

import PySimpleGUI as sg
from datetime import datetime
import base64


sg.theme('DarkTeal9')      
#------------------------------Create single layouts----------------------------------

flower_base64 = "image code here"

layout_img = [[sg.Button('', image_data=flower_base64, button_color=(sg.theme_background_color(),sg.theme_background_color()),border_width=0, key='-GRAPH-')]]


   
layout_1 = [[sg.InputText("", key="-IT2-", font='Arial 9', size=(10,1)),
             sg.Combo(["Item1", "Item2", "Item3"],size=(20,1), key='-TEST2-', font='Arial 9'),
             sg.CalendarButton("", close_when_date_chosen=True,  target='-IN2-', font='Arial 9', no_titlebar=False, format='%d-%b-%Y'),
             sg.InputText("", key='-IN2-', size=(20,1), font='Arial 9')]]


layout_a = [[sg.Button("row 2")]]

layout_2 = [[sg.InputText("", key="-IT3-", font='Arial 9', size=(10,1)),
             sg.Combo(["Item1", "Item2", "Item3"],size=(20,1), key='-TEST3-', font='Arial 9'),
             sg.CalendarButton("", close_when_date_chosen=True,  target='-IN3-', font='Arial 9', no_titlebar=False, format='%d-%b-%Y'),
             sg.InputText("", key='-IN3-', size=(20,1), font='Arial 9')]]

layout_b =[[sg.Button("row 3")]]

layout_3 = [[sg.InputText("", key="-IT4-", font='Arial 9', size=(10,1), visible=True),
             sg.Combo(["Item1", "Item2", "Item3"],size=(20,1), key='-TEST4-', font='Arial 9'),
             sg.CalendarButton("", close_when_date_chosen=True,  target='-IN4-', font='Arial 9', no_titlebar=False, format='%d-%b-%Y'),
             sg.InputText("", key='-IN4-', size=(20,1), font='Arial 9', justification="c")]]

#------------------------------Create master layout----------------------------------
               
layout = [[sg.Column(layout_img, key="-AZZ-")],
          [sg.Column(layout_1, key='-LAY1-'), sg.Column(layout_a, visible=True, key="-LAYA-")],
          [sg.Column(layout_2, visible=False, key='-LAY2-'), sg.Column(layout_b, visible=False, key='-LAYB-')],
          [sg.Column(layout_3, visible=False, key='-LAY3-')],
          [sg.Button ("Save"), sg.Button ("Load"), sg.Button("Upload"), sg.Button('Exit')]]
        

window = sg.Window("", layout, no_titlebar=True)


while True:
    event, values = window.read()
        
    if event == 'Save':
        filename = sg.popup_get_file("Save", save_as=True, no_window=True)
        window.SaveToDisk(filename)
    if event == 'Load':
        filename = sg.popup_get_file('Load', no_window=True)
        window.LoadFromDisk(filename)
        if "-IT2-":
            window[f'-LAY2-'].update(visible=True)
            window[f'-LAYA-'].update(visible=False)
        if "-IT3-":
            window[f'-LAY3-'].update(visible=True)
            
    if event == sg.WIN_CLOSED or event == 'Exit':
        break
        window.close()
    if event == 'row 2':
        window[f'-LAY2-'].update(visible=True)
        window[f'-LAYA-'].update(visible=False)
        window[f'-LAYB-'].update(visible=True)
        layout = str(event)
    if event == 'row 3':
        window[f'-LAY3-'].update(visible=True)
        window[f'-LAYB-'].update(visible=False)
        layout = str(event)

window.close()
base64 image pysimplegui
1 Answers

Here's a simple script, just for demo, and there's only one Image element to save and to load in the GUI.

import json
from pathlib import Path
import PySimpleGUI as sg

settings_file = 'settings.json'
settings = {'-Image-':None}

if Path(settings_file).is_file():
    with open(settings_file, 'rt') as f:
        settings = json.load(f)

layout = [
    [sg.FileBrowse(target='Browse', enable_events=True, key='Browse')],
    [sg.Image(filename=settings['-Image-'], visible=(settings['-Image-'] is not None), key='-Image-')],
]
window = sg.Window('Window Title', layout)

while True:
    event, values = window.read()

    if event == sg.WIN_CLOSED:
        break
    elif event == 'Browse':
        filename = values['Browse']
        window['-Image-'].update(filename=filename, visible=True)
        window.refresh()
        window.move_to_center()
        settings['-Image-'] = filename

with open(settings_file, 'wt') as f:
    json.dump(settings, f)

window.close()
Jason Yang0
Related