第1章自定義介面-基本程式碼

阿新 • • 發佈：2021-09-16

1.　　建立一個最基本的介面

1.1　　彈窗

import PySimpleGUI as sg

sg.Popup("一個簡單的彈窗！")   # 單行文字！


　　
sg.Popup("第1行內容！","第2行內容！","第3行內容！")   # 多行文字！

# text = '''  文字內容！    '''

# sg.Popup(text)   # 多行文字！

　　效果如下：

1.2　　基本框架---模板程式碼的組成

# 1）匯入模組
import PySimpleGUI as sg

# 2)定義佈局，確定行數
layout = [
    [sg.Text("請輸入基本資訊！")],
    [sg.Text("姓名"), sg.InputText()],
    [sg.Text("性別"), sg.InputText()],
    [sg.Text("電話號碼"), sg.InputText()],
    [sg.Button("確認"), sg.Button("取消")],
]

# 3)建立視窗
window = sg.Window("測試視窗", layout)

# 4)事件迴圈
while True:
    event, values = window.read()  # 視窗的讀取，有兩個返回值（1.事件；2.值）
    # print(event,values)

    if event == None:  # 視窗關閉事件，設定一個出口跳出迴圈
        break

# 5）關閉視窗
window.close()

2.　　主題

2.1　　檢視有效主題

import PySimpleGUI as sg

sg.theme_previewer()
print(sg.theme_list())   # 獲取有效主題名稱

2.2　　選擇主題

import PySimpleGUI as sg

sg.theme("主題名稱")
sg.theme("")   # 隨機主題

2.3　　修改主題部分設定

import PySimpleGUI as sg

sg.theme("LightGreen3")
sg.theme_button_color("black","#6df85")   # 修改LightGreen3的按鈕顏色

3.　　事件的介紹

3.1　　視窗關閉事件

# 第1種：
    if event == None:  # 視窗關閉事件
        break

# 第2種：
    if event == sg.WIN_CLOSED:    # 視窗關閉事件
        break

3.2　　按鈕點選事件

    if event =="確認":    # 點選確認按鈕後，判斷事件是否發生
        print("確認")     # 事件發生時要處理的任務
        sg.Popup("執行確認任務！")

3.2.1　　判斷事件是否發生的幾種方式

# 第1種
    if event =="exit":
        sg.Popup("你點選了exit按鈕！")
        break

# 第2種
    if event in("exit",None):        # 事件為exit或None
        sg.Popup("你點選了exit或視窗關閉！")
        break

# 第3種
    if event.startswith("exit"):     # 事件的前4個字母為exit
        sg.Popup("你點選了exit按鈕！")
        break

# 第4種
    if event.endswith("exit"):      # 事件的後4個字母為exit
        sg.Popup("你點選了exit按鈕！")
        break

3.2.2　　按鈕事件-案例

# 1）匯入模組
import PySimpleGUI as sg

# 2)定義佈局，確定行數
layout = [
    [sg.Text("請輸入基本資訊！")],
    [sg.Text("姓名"),sg.InputText(enable_events=True,key="-XM-")],
    [sg.Text("性別"),sg.InputText(enable_events=True,key="-XB-")],
    [sg.Text("電話號碼"),sg.InputText(enable_events=True,key="-DH-")],
    [sg.Button("確認"),sg.Button("取消")],
]

# 3)建立視窗
window = sg.Window("測試視窗",layout)

# 4)事件迴圈
while True:
    event,values = window.read()
    # print(event,values)

    if event == "確認":
        sg.Popup("你提交的資訊如下！",
                 "姓名:"+values["-XM-"],
                 "性別:" + values["-XB-"],
                 "電話號碼:" + values["-DH-"],keep_on_top=True
                 )

    if event == None:
        break

# 5）關閉視窗
window.close()

　　效果如下：

3.3　　其他事件（文字元素、輸入框、下拉選單）

　　1）像文字元素、輸入框、下拉選單等事件預設屬性是關閉的，當手動設定他們的事件屬性（enable_event=True)為真時，他們也將具備事件屬性。

　　2）未設定key值時，事件預設的event為第一個元素。

layout = [[sg.Text("OK",enable_events=True)]]    # 開啟時間屬性，點選文字時會觸發彈窗  
...

if event == "OK":
    sg.Popup("文字元素事件為ok，即彈窗！")

　　3）設定key值時，事件的event為key值。

layout = [[sg.Text("OK",enable_events=True,key="-WB-")]]    
...

if event == "OK":
    sg.Popup("不會彈窗的哦！")

if event == "-WB-":
    sg.Popup("彈窗！")

4.　　值的介紹

　　視窗讀取返回值，值的兩種獲取方式

通過列表索引獲取返回值-值。
通過字典的鍵獲取返回值-值。

# 第1種：通過列表的索引獲取返回值。預設是通過列表獲取。values[位置序號]
    if event =="確認":
        print(values[1])       # 列印第2行元素的值

# 第2種：通過字典的鍵獲取返回值。
    # 當給元素設定唯一識別符號key,則該元素無法通過列表索引，只能通過字典key進行索引。values[key]
    layout = [
        [sg.Text("請輸入基本資訊！")],
        [sg.Text("姓名"), sg.InputText(key="-XM-")]]   # key建議首字母為大寫，“ - ”不能少。
while True:
    event, values = window.read()  
    
    if event == "確認":
        print(values["-XM-"])  # 列印姓名的值

5.　　自定義視窗

5.1　　for迴圈簡介---它可以遍歷任何序列的專案

str1 = "abcd1234"
list1 =["喬治","佩琪","佩德羅"]

# for i in str1:
for i in list1:
    print(i)

>>喬治
>>佩琪
>>佩德羅

5.2　　配合使用for迴圈，自定義視窗

# 1）匯入模組
import PySimpleGUI as sg

# 2)定義佈局，確定行數
str = "ABCD"
# 第1種：
# 注意：有兩個中括號的。
layout = [[sg.Text(i)  for i in str]]   # for迴圈前面是 () 時，從左向右遍歷。

# 第2種
# layout = [[sg.Text(j)]   for j in str]  # for迴圈前面是 [] 時，從上向下遍歷。

# 3)建立視窗
window = sg.Window("測試視窗",layout)

# 4)事件迴圈
while True:
    event, values = window.read()
    # print(event,values)

    if event == None:
        break

# 5）關閉視窗
window.close()

　　效果如下：

5.3　　佈局和元素的組合方式

5.3.1　　第一種佈局方式

layout = [
    [sg.Text("請輸入基本資訊！")],
    [sg.Text("姓名"), sg.InputText(key="-XM-")],
    [sg.Text("性別"), sg.InputText()],
    [sg.Text("電話號碼"), sg.InputText()],
    [sg.Button("確認"), sg.Button("取消")],
]

layout_a = [[sg.B("增加按鈕")]]
layout = layout + layout_a

5.3.2　　第二種佈局方式

　　元素間除了用“ ，”隔開外，還可以用“ ] + [ ”替代。

layout = [
    [sg.Text("請輸入基本資訊！")],
    [sg.Text("姓名")]+[sg.InputText(key="-XM-")],
    [sg.Text("性別")]+[ sg.InputText()],
    [sg.Text("電話號碼")]+[sg.InputText()],
    [sg.Button("確認")]+[ sg.Button("取消")],
]