前言

PySimpleGUI库的功能非常之多，而且拥有200多个开发示例，很多时候只需要对这些示例稍作修改就可以拿来用了，本文主要介绍了一写PySimpleGUI库中一些宠用的函数，再不借助类似qt这类可视化界面设计的情况下如何快速的做出自己想要的界面，因为篇幅较长，因此大家可以根据目录进行跳转到自己需要的部分。

PySimpleGUI库

PySimpleGUI库介绍

PySimpleGUI是python用于制作用户交互界面的库，使用起来非常方便，官方的默认缩写为sg,因此使用时建议采用import PySimpleGUI as sg语句

PySimpleGUI库安装

如果是在命令行终端输入 pip install pysimplegui即可
如果是在pycharm中，那么可以在file–setting–python interpreter–±-输入PySimpleGUI–install，等待安装完成后即可

PySimpleGUI库常用函数

基本弹窗函数popup

popup函数以及其变体

sg.popup（‘基本函数’）
sg.popup_ok('带ok键的弹窗')
sg.popup_yes_no('带Yes和No按钮的弹窗')
sg.popup_cancel('带cancel按钮的弹窗')
sg.popup_ok_cancel('带OK和cancel按钮的弹窗')
sg.popup_error('带红色error按钮的弹窗')
sg.popup_auto_close('几秒后自动关闭的弹窗')

popup函数应用示例

import PySimpleGUI as sg
sg.popup(
    '小白超可爱的',#显示的内容
    '小白宇宙第一可爱',#显示的内容
    title='嗷呜',#窗口名
    button_color=('#000000','#FFFFFF'),#按钮颜色（前景色和背景色）
    line_width=10,#每一行的字数
    custom_text='？',#按键显示内容
    location=(857,857),#屏幕显示的位置
    auto_close=True,#会自动关闭
    auto_close_duration=5,#自动关闭的时间，单位秒
    text_color='blue',#文字颜色
    grab_anywhere=True,#窗口是否可以移动
    font='23',#字体大小
)

文字弹窗函数popup_scrolled

import PySimpleGUI as sg

text=''' 今天吃了德芙啊，做了泡芙啊，可还是没有和你一起写代码舒服啊。 '''
sg.popup_scrolled(text,title='写代码是地球ol最好玩的游戏！')

用户输入的弹窗popup_get_text

popup_get_text显示输入内容

import PySimpleGUI as sg

text1 = sg.popup_get_text('马师傅说：',title='松果弹抖闪电鞭')
print(text1)

popup_get_text不显示输入内容

import PySimpleGUI as sg

text1 = sg.popup_get_text('满血鲁班被凯爹一刀秒杀后打字到',#提示内容
                          title='王者峡谷一条gai',#窗口名称
                          password_char='*'#用*代替显示)
print(text1)

文件选择弹出窗口函数sg.popup_get_file

import PySimpleGUI as sg

path=sg.popup_get_file("嘿，siri,打开我的相册",
                       save_as=True,#是否另存为图片
                       multiple_files=True,#是否可以选择多个文件
                       file_types=(('图片','.jpg'),)#文件类型
                       )
print(path)

进度条弹窗函数one_line_progress_meter

import PySimpleGUI as sg

for i in range(1000):
    sg.one_line_progress_meter( '进度条',#窗口名称
                                i + 1,#当前进度
                                1000,#总进度
                                '该进度条key',#内容输出可以是多个字符串
                                '这是一个进度条',
                                orientation='h',#进度条方向h是横向，v是纵向
                                bar_color=('#AAFFAA','#FFAAFF'),#进度条颜色
)

进度条上的英文是自动产生的，我目前没有找到消除或者修改内容的方法。

主菜单的制作

基本窗口函数window

window函数可以创建一个窗口，在该窗口上可以放置各种各样的控件供我们使用。

   top_window = sg.Window('Everything bagel', #展示窗口 
   						  layout, #窗口控件布局
   						  finalize=True, #貌似是必要参数
   						  keep_on_top=True, #控件保持在屏幕上方
     					  grab_anywhere=True,#可以拖动窗口
   						  transparent_color=sg.theme_background_color(), #背景主题
   						  no_titlebar=True)#去掉标题栏

PySimpleGUI库常用控件

例程代码

想要掌握window，那么关键在于如何创建和使用控件，以及如何进行函数回调
先来看一下比较便于掌握控件的例程

import PySimpleGUI as sg

"""
    Highly experimental demo of how the illusion of a window with a background image is possible with PySimpleGUI.

    Requires the latest PySimpleGUI from GitHub.  Your copy of PySimpleGUI should be local to your application so that 
    the global variable _move_all_windows can be changed.  
    
    Copyright 2020 PySimpleGUI.org
"""


sg.Window._move_all_windows = True


def title_bar(title, text_color, background_color):
    """
    Creates a "row" that can be added to a layout. This row looks like a titlebar
    :param title: The "title" to show in the titlebar
    :type title: str
    :param text_color: Text color for titlebar
    :type text_color: str
    :param background_color: Background color for titlebar
    :type background_color: str
    :return: A list of elements (i.e. a "row" for a layout)
    :rtype: List[sg.Element]
    """
    bc = background_color
    tc = text_color
    font = 'Helvetica 12'

    return [sg.Col([[sg.T(title, text_color=tc, background_color=bc, font=font, grab=True)]], pad=(0, 0), background_color=bc),
            sg.Col([[sg.T('_', text_color=tc, background_color=bc, enable_events=True, font=font, key='-MINIMIZE-'), sg.Text('❎', text_color=tc, background_color=bc, font=font, enable_events=True, key='Exit')]], element_justification='r', key='-C-', grab=True,
                   pad=(0, 0), background_color=bc)]



def main():

    background_layout = [ title_bar('This is the titlebar', sg.theme_text_color(), sg.theme_background_color()),
                        [sg.Image(data=background_image)]]
    window_background = sg.Window('Background', background_layout, no_titlebar=True, finalize=True, margins=(0, 0), element_padding=(0,0), right_click_menu=[[''], ['Exit',]])

    window_background['-C-'].expand(True, False, False)  # expand the titlebar's rightmost column so that it resizes correctly


    # ------ Column Definition ------ #
    column1 = [[sg.Text('Column 1', justification='center', size=(10, 1))],
               [sg.Spin(values=('Spin Box 1', 'Spin Box 2', 'Spin Box 3'),
                        initial_value='Spin Box 1')],
               [sg.Spin(values=['Spin Box 1', '2', '3'],
                        initial_value='Spin Box 2')],
               [sg.Spin(values=('Spin Box 1', '2', '3'), initial_value='Spin Box 3')]]

    layout = [#控件的设置在这里
        [sg.Text('Window + Background Image\nWith tkinter', size=(30, 2), justification='center', font=("Helvetica", 25), relief=sg.RELIEF_RIDGE)],
        [sg.Text('Here is some text.... and a place to enter text')],
        [sg.InputText('This is my text')],
        [sg.Frame(layout=[
            [sg.CBox('Checkbox', size=(10, 1)),
             sg.CBox('My second checkbox!', default=True)],
            [sg.Radio('My first Radio!     ', "RADIO1", default=True, size=(10, 1)),
             sg.Radio('My second Radio!', "RADIO1")]], title='Options', relief=sg.RELIEF_SUNKEN, tooltip='Use these to set flags')],
        [sg.MLine(default_text='This is the default Text should you decide not to type anything', size=(35, 3)),
         sg.MLine(default_text='A second multi-line', size=(35, 3))],
        [sg.Combo(('Combobox 1', 'Combobox 2'),default_value='Combobox 1', size=(20, 1)),
         sg.Slider(range=(1, 100), orientation='h', size=(34, 20), default_value=85)],
        [sg.OptionMenu(('Menu Option 1', 'Menu Option 2', 'Menu Option 3'))],
        [sg.Listbox(values=('Listbox 1', 'Listbox 2', 'Listbox 3'), size=(30, 3)),
         sg.Frame('Labelled Group', [[
             sg.Slider(range=(1, 100), orientation='v', size=(5, 20), default_value=25, tick_interval=25),
             sg.Slider(range=(1, 100), orientation='v', size=(5, 20), default_value=75),
             sg.Slider(range=(1, 100), orientation='v', size=(5, 20), default_value=10),
             sg.Col(column1)]])
        ],
        [sg.Text('_' * 80)],
        [sg.Text('Choose A Folder', size=(35, 1))],
        [sg.Text('Your Folder', size=(15, 1), justification='right'),
         sg.InputText('Default Folder'), sg.FolderBrowse()],
        [sg.Submit(tooltip='Click to submit this form'), sg.Cancel()],
    [sg.Text('Right Click To Exit', size=(30, 1), justification='center', font=("Helvetica", 25), relief=sg.RELIEF_SUNKEN)], ]
	#只要把layout传递给window函数就可以让窗口搭载设定好的控件了
    top_window = sg.Window('Everything bagel', layout, finalize=True, keep_on_top=True, grab_anywhere=False,  transparent_color=sg.theme_background_color(), no_titlebar=True)

    # window_background.send_to_back()
    # top_window.bring_to_front()

    while True:
        window, event, values = sg.read_all_windows()
        print(event, values)
        if event is None or event == 'Cancel' or event == 'Exit':
            print(f'closing window = {window.Title}')
            break

    top_window.close()
    window_background.close()

if __name__ == '__main__':
	background_image = 图片的URL
	#链接太长了就不贴了，需要的话自己去找一下图片，也可以用本地图片但是只支持gif格式的图片
	main()

Frame控件

sg.Frame（）里面可以穿插其他控件，在同一个sg.Frame控件里的控件会被框起来代表是一组，比较常用语里面插入选择性的控件，主要参数有

1. tooltip：提示信息，鼠标放置在控件上会出现提示
2. title:标题

[sg.Frame(layout=[
            [sg.CBox('Checkbox', size=(10, 1)),
             sg.CBox('My second checkbox!', default=True)],
            [sg.Radio('My first Radio!     ', "RADIO1", default=True, size=(10, 1)),
             sg.Radio('My second Radio!', "RADIO1")]], title='Options', relief=sg.RELIEF_SUNKEN, tooltip='Use these to set flags')]

Text控件：文本

sg.Text（）里面可以插入文本内容，并显示在窗口上，是很常用的控件类型，主要参数有

1. size:文本框大小
2. justification：文字位置
3. font:字体型号以及字体大小

 sg.Text('Your Folder', size=(15, 1), justification='right')

Image控件：图片

sg.Image控件可以用来植入图片或者动态图，但是只支持gif格式和png格式，其他格式的图片需要转化成这俩种格式，不过我测试只有gif可用，常用的参数有

1. size:图片大小，比图片大的话不会被放大填充，但是比图片小的话图片会被缩放
   
   附上其他类型图片转化为gif图片的源码：

picref = Image.open(picref_path)
picrefNew.append(picref)
picrefNew[0].save("./picref.gif", 'gif', save_all=True, append_images=picrefNew[1:])

Button控件：按键

sg.Button控件可以创造一个按键，用户每当按下按键，则会返回所有当前所有选择框的状态，从而便于让开发者去调用对应的响应函数，在PySimpleGUI库中，有很多奇奇怪怪的按键函数，但实际上只是换了名字而已，与sg.Button并没有什么额外的内容。

1. OK
2. Ok
3. Submit
4. Cancel
5. Yes
6. No
7. Exit
8. Quit
9. Help
10. Save
11. SaveAs
12. Open
    sg.OK()就相当于sg.Button(‘OK’),Button的主要参数有
13. size:按键大小
14. key：传入一个字符串，代表键值

sg.Button('评估',size=(30,1),key='assess')

Radio控件：单项选择

一组sg.Radio同时只有一个控件可以被选择，可以用作单项选择或者确定是否，主要参数有

1. default：初始是否被选中
2. size：尺寸大小

sg.Radio('My first Radio!     ', "RADIO1", default=True, size=(10, 1))

Slider控件:滑块调节

sg.Slider（）可以产生一个可滑动调节的按钮，主要的参数有

1. range:可滑动范围，例如（1,100）
2. size:尺寸大小
3. default_value：默认滑块所在的位置

sg.Slider(range=(1, 100), orientation='h', size=(34, 20), default_value=85)

Listbox控件：列表框

listbox可以创建一个列表框供人选择，在触发回调事件时，列表框被选中的情况会被返回

sg.Listbox(values=('Listbox 1', 'Listbox 2', 'Listbox 3'), size=(30, 3))

Cbox控件：复选框

Cbox函数可以用来创建复选框，复选框可以有多个控件被同时选择,主要参数：

1. default:默认值为False，决定初始化后是否被选择
2. size:控件大小

[sg.CBox('Checkbox', size=(10, 1)),
             sg.CBox('My second checkbox!', default=True)]

Combo控件：下拉选框

Combo用于生成下拉选框，当有回调事件触发时会返回选框内的值，主要参数：
size:控件大小
default:默认选择哪个值

sg.Combo(('Combobox 1', 'Combobox 2'), default_value='Combobox 1', size=(20, 1))

FileBrowse控件：选取文件

FileBrowse常用于打开一个文件，但是该函数不会触发按键效果，所以就会出现用该函数打开了一个文件后却不可以即使更新到界面上，也无法触发其他回调函数，但是可以通过以下语句更新到文本框中

layout=[sg.Text('源图像', size=(8, 1)),sg.Input(),sg.FileBrowse('选择源图像', size=(30, 1))]

FolderBrowse控件：选取文件夹

和FileBrowse没有什么区别，不过对象从文件变成了文件夹，也一样不会触发回调，但是可以更新到文本框当中

layout=[sg.Text('源图像', size=(8, 1)),sg.Input(),sg.FolderBrowse('选择源图像', size=(30, 1))]

Table：列表

Table函数可以生成一个列表将需要展示的数据展示出来是很好用的函数

        [sg.Table(values=[["          ", "          ", "          ", "          ","          "]],#列的初始宽度
                  headings=['算法名称', '评估分数', '算法最高分', '归一化后分数','综合权值'],#列头的初始值
                  max_col_width=500,#行宽
                  auto_size_columns=True,  # 自动调整列宽（根据上面第一次的values默认值为准，update时不会调整）
                  display_row_numbers=True,  # 序号
                  justification='center',  # 字符排列 left right center
                  num_rows=7,  # 行数
                  row_height=30,  # 行高
                  key='_table_',#键值
                  font=('微软雅黑', 12),#字体大小和字体类型
                  text_color='black',#文本颜色
                  background_color='white',#背景颜色
                  enable_events=True,
                  bind_return_key=True,
                  tooltip='仿真评估表')],]#文本提示

用户交互界面设计注意事项

1. 为了保证用户界面使用的流畅性，要给界面处理单开一个线程，保证其实时性流畅性
2. 该库的背景板一般是单独的窗口，但如果不将其设为置顶，只要有其他软件在其上面就会被覆盖导致背景看不见，但如果设为置顶，则只要碰到控件窗口以外的地方，则控件窗口会被背景窗口覆盖，目前没有一个很好解决方法
3. 如果控件窗口设定为置顶，则弹窗可能会被覆盖，需要将弹窗也设定为置顶。

关于用户界面的美化

对于一名非颜值主义者，五官跟着三观走的人来说没有什么很好的美术设计功底与概念
简单来说：我不会作美化

目录

目标：根据自己写的函数，写一个交互式界面。

第一步：命令窗口输入guide，得到 “.fig” 和 “.m” 文件

第二步：设计界面

第三步：编写界面中元素对应代码

第四步 结果

参考资料

---

目标：根据自己写的函数，写一个交互式界面。

其实整体较简单，关键是理解整个MATLAB GUI 运行的逻辑！

PS 一切将简单问题复杂化的东西，真的可恨！

第一步：命令窗口输入guide，得到 “.fig” 和 “.m” 文件

第二步：设计界面

 

第三步：编写界面中元素对应代码

上述界面框对应的代码如下：

%%%%%%%%%%%%%%%%%%%%%%%%%%% 主函数 %%%%%%%%%%%%%%%%%%%%%%%%%%
function varargout = Example_test(varargin)
% EXAMPLE_TEST MATLAB code for Example_test.fig
%      EXAMPLE_TEST, by itself, creates a new EXAMPLE_TEST or raises the existing
%      singleton*.
%
%      H = EXAMPLE_TEST returns the handle to a new EXAMPLE_TEST or the handle to
%      the existing singleton*.
%
%      EXAMPLE_TEST('CALLBACK',hObject,eventData,handles,...) calls the local
%      function named CALLBACK in EXAMPLE_TEST.M with the given input arguments.
%
%      EXAMPLE_TEST('Property','Value',...) creates a new EXAMPLE_TEST or raises the
%      existing singleton*.  Starting from the left, property value pairs are
%      applied to the GUI before Example_test_OpeningFcn gets called.  An
%      unrecognized property name or invalid value makes property application
%      stop.  All inputs are passed to Example_test_OpeningFcn via varargin.
%
%      *See GUI Options on GUIDE's Tools menu.  Choose "GUI allows only one
%      instance to run (singleton)".
%
% See also: GUIDE, GUIDATA, GUIHANDLES

% Edit the above text to modify the response to help Example_test

% Last Modified by GUIDE v2.5 07-Aug-2020 15:16:01

% Begin initialization code - DO NOT EDIT
gui_Singleton = 1;
gui_State = struct('gui_Name',       mfilename, ...
                   'gui_Singleton',  gui_Singleton, ...
                   'gui_OpeningFcn', @Example_test_OpeningFcn, ...
                   'gui_OutputFcn',  @Example_test_OutputFcn, ...
                   'gui_LayoutFcn',  [] , ...
                   'gui_Callback',   []);
if nargin && ischar(varargin{1})
    gui_State.gui_Callback = str2func(varargin{1});
end

if nargout
    [varargout{1:nargout}] = gui_mainfcn(gui_State, varargin{:});
else
    gui_mainfcn(gui_State, varargin{:});
end
% End initialization code - DO NOT EDIT

%%%%%%%%%%%%%%%%%%%%%%%%%%% openingfucntion %%%%%%%%%%%%%%%%%%%%%%%%%%
% --- Executes just before Example_test is made visible.
function Example_test_OpeningFcn(hObject, eventdata, handles, varargin)
% This function has no output args, see OutputFcn.
% hObject    handle to figure
% eventdata  reserved - to be defined in a future version of MATLAB
% handles    structure with handles and user data (see GUIDATA)
% varargin   command line arguments to Example_test (see VARARGIN)

% Choose default command line output for Example_test
handles.output = hObject;

% Update handles structure
guidata(hObject, handles);


% UIWAIT makes Example_test wait for user response (see UIRESUME)
% uiwait(handles.figure1);

%%%%%%%%%%%%%%%%%%%%%%%%%%% output function %%%%%%%%%%%%%%%%%%%%%%%%%%
% --- Outputs from this function are returned to the command line.
function varargout = Example_test_OutputFcn(hObject, eventdata, handles) 
% varargout  cell array for returning output args (see VARARGOUT);
% hObject    handle to figure
% eventdata  reserved - to be defined in a future version of MATLAB
% handles    structure with handles and user data (see GUIDATA)

% Get default command line output from handles structure
varargout{1} = handles.output;


%%%%%%%%%%%%%%%%%%%%%%%%%%% 编辑文本1 %%%%%%%%%%%%%%%%%%%%%%%%%%
function edit1_Callback(hObject, eventdata, handles)
% hObject    handle to edit1 (see GCBO)
% eventdata  reserved - to be defined in a future version of MATLAB
% handles    structure with handles and user data (see GUIDATA)

% Hints: get(hObject,'String') returns contents of edit1 as text
%        str2double(get(hObject,'String')) returns contents of edit1 as a double


% --- Executes during object creation, after setting all properties.
function edit1_CreateFcn(hObject, eventdata, handles)
% hObject    handle to edit1 (see GCBO)
% eventdata  reserved - to be defined in a future version of MATLAB
% handles    empty - handles not created until after all CreateFcns called

% Hint: edit controls usually have a white background on Windows.
%       See ISPC and COMPUTER.
if ispc && isequal(get(hObject,'BackgroundColor'), get(0,'defaultUicontrolBackgroundColor'))
    set(hObject,'BackgroundColor','white');
end

%%%%%%%%%%%%%%%%%%%%%%%%%%% 编辑文本2 %%%%%%%%%%%%%%%%%%%%%%%%%%
function edit2_Callback(hObject, eventdata, handles)
% hObject    handle to edit2 (see GCBO)
% eventdata  reserved - to be defined in a future version of MATLAB
% handles    structure with handles and user data (see GUIDATA)

% Hints: get(hObject,'String') returns contents of edit2 as text
%        str2double(get(hObject,'String')) returns contents of edit2 as a double


% --- Executes during object creation, after setting all properties.
function edit2_CreateFcn(hObject, eventdata, handles)
% hObject    handle to edit2 (see GCBO)
% eventdata  reserved - to be defined in a future version of MATLAB
% handles    empty - handles not created until after all CreateFcns called

% Hint: edit controls usually have a white background on Windows.
%       See ISPC and COMPUTER.
if ispc && isequal(get(hObject,'BackgroundColor'), get(0,'defaultUicontrolBackgroundColor'))
    set(hObject,'BackgroundColor','white');
end



%%%%%%%%%%%%%%%%%%%%%%%%%%% 按钮1 %%%%%%%%%%%%%%%%%%%%%%%%%%
% --- Executes on button press in pushbutton1.
function pushbutton1_Callback(hObject, eventdata, handles)
% hObject    handle to pushbutton1 (see GCBO)
% eventdata  reserved - to be defined in a future version of MATLAB
% handles    structure with handles and user data (see GUIDATA)

[Filename, Pathname]=uigetfile('*.txt;*.xlsx','Select Input Ground Motion'); % Raw download PEER data
file=[Pathname,Filename];
data=importdata(file);
handles.data=data;  % 不同子函数之间进行数据传输

axes(handles.axes1);
plot(data,'k','linewidth',1,'Color',[0.7 0.7 0.7]);

guidata(hObject,handles)


%%%%%%%%%%%%%%%%%%%%%%%%%%% 按钮2 %%%%%%%%%%%%%%%%%%%%%%%%%%
% --- Executes on button press in pushbutton2.
function pushbutton2_Callback(hObject, eventdata, handles)
% hObject    handle to pushbutton2 (see GCBO)
% eventdata  reserved - to be defined in a future version of MATLAB
% handles    structure with handles and user data (see GUIDATA)

thres=get(handles.edit1,'string');
thres=str2double(thres);

data=handles.data;
data=data(data>thres);

axes(handles.axes2);
plot(data,'k','linewidth',1,'Color',[0.7 0.7 0.7]);


%%%%%%%%%%%%%%%%%%%%%%%%%%% 将结果写入 编辑文档2 %%%%%%%%%%%%%%%%%%%%%%%%%%
S=data(1:2,1);
C=num2str(S'); % 行向量！
set(handles.edit2,'String',C)

主要注意如下几点：

（1）核心是写“按钮”和“可编辑文档”对应的callback部分，其他（如主函数，opening function, output function）不需要动！

（2）了解不同子函数间数据是如何传递的，本文中采用的代码如下，其他方式详见Matlab的GUI参数传递方式总结。

data=importdata(file);
handles.data=data;  % 不同子函数之间进行数据传输

guidata(hObject,handles) % 在子函数最后，一定要加上这句！

（3）如何画图，本文采用的代码如下：

axes(handles.axes1);
plot(data,'k','linewidth',1,'Color',[0.7 0.7 0.7]);

（4）如何清空图形和“可编辑文本”内的文字，代码如下

function pushbutton3_Callback(hObject, eventdata, handles)
% hObject    handle to pushbutton3 (see GCBO)
% eventdata  reserved - to be defined in a future version of MATLAB
% handles    structure with handles and user data (see GUIDATA)
try
    delete(allchild(handles.axes1));
end

set(handles.edit1,'String','');

（5）理解“get函数”和“set函数”在GUI中的意义！

（6）一个文本框内放入向量，思路是将向量变成字符串，注意得是行向量！

S=data(1:2,1);
C=num2str(S'); % 行向量！
set(handles.edit2,'String',C)

 

第四步 结果

 

参考资料

[1] Matlab GUI界面设计

[2] matlab GUI界面编程总结

[3] matlab编程GUI基础