Python Program တွေမှာ အများအားဖြင့် Terminal ကနေပဲ Input/Output တွေ ထုတ်ကြပါတယ်။ ဒါဟာ ဘာကြောင့်လဲဆိုတော့ GUI တစ်ခုရေးတာထက်စာရင် ပိုလွယ်ကူပြီး အချိန်ကုန်သက်သာလို့ပါ။ Programmer တွေအတွက် Text-interface ကို သုံးပြီး အလုပ်လုပ်ရတာ မခက်ခဲပေမယ့် သာမန် User အနေနဲ့ ကြည့်မယ်ဆိုရင်တော့ ဒါက သိပ်အဆင်မပြေပါဘူး။ ကိုယ့်ရဲ့ Program မှာ GUI ထည့်လိုက်မယ်ဆိုရင် User တိုင်းအတွက် အဆင်ပြေသွားနိုင်ပါတယ်။ တစ်ချို့ Program တွေမှာဆိုရင် GUI တစ်ခု မရှိမဖြစ် လိုတတ်ပါတယ်။ ဒါပေမယ့် Tkinter လို GUI Library ကြီးတွေက Beginner တွေအတွက် သုံးဖို့ သိပ်မလွယ်ပါဘူး။ PySimpleGUI က Python programmer တိုင်း GUI တွေ လွယ်လွယ်နဲ့ မြန်မြန်ဖန်တီးနိုင်အောင် လုပ်ပေးတဲ့ Library တစ်ခုပါ။ PySimpleGUI က Tkinter နဲ့ တစ်ခြား GUI Framework တွေအပေါ်မှာ အခြေခံပြီး သုံးရအလွယ်ကူဆုံးဖြစ်အောင် ဖန်တီးထားတဲ့ Library တစ်ခုပါ။ PySimpleGUI မှာ App တွေကို စိတ်ကြိုက်ဖန်တီးလို့ ရသလို Portable လဲ ဖြစ်တဲ့အတွက် အခုနောက်ပိုင်း အသုံးများလာပါတယ်။ ဒီ Tutorial မှာတော့ PySimpleGUI နဲ့ App တွေ ဖန်တီးတဲ့အခါမှာ သိဖို့လိုအပ်တဲ့ အခြေခံတွေကို လေ့လာသွားမှာ ဖြစ်ပါတယ်။

Hello PySimpleGUI – First App

အရင်ဆုံး PySimpleGUI ကို install လုပ်ရပါမယ်။ Terminal တစ်ခုကို ဖွင့်ပြီး အောက်ကကုဒ်ကို run လိုက်ပါ။

pip install PySimpleGUI

Python file အသစ်တစ်ခုဖွင့်ပြီး PySimpleGUI အလုပ်လုပ်၊ မလုပ် စမ်းကြည့်ပါမယ်။

import PySimpleGUI as sg
# Settings for app
sg.set_options(font=("Arial", 20))
# GUI layout
layout = [
    [sg.Text("Hello World!")],
    [sg.Input()],
    [sg.Button("OK"), sg.Button("Cancel")]
]
# Main window
window = sg.Window("My First App", layout).read()

အပေါ်ကကုဒ်ကို run ကြည့်ရင် ဒီလို window လေး ပေါ်လာပါလိမ့်မယ်။ ဒီအတိုင်း အလုပ်လုပ်တယ်ဆိုရင် အဆင်ပြေပါပြီ။

Hello World App
Hello World App

Layout Elements

PySimpleGUI ထဲမှာ GUI layout ကို List တွေသုံးပြီး နေရာသတ်မှတ်ပါတယ်။ layout ဆိုတဲ့ main list ထဲမှာ List တွေ ထပ်ထပ်ထည့်ပြီး Row တွေ ဖန်တီးသွားပါတယ်။ Row list ထဲမှာ comma ခြားပြီး item တွေထပ်ထည့်လိုက်ရင် Column ဖြစ်သွားပါတယ်။ ဒီနမူနာထဲမှာဆိုရင် Row 2 မှာ Button နှစ်ခု ထည့်ထားတာပါ။ Row list တွေထဲမှာ ပါတဲ့ item တွေကို Element တွေလို့ ခေါ်ပါတယ်။ GUI တစ်ခုလုံးကို Element မျိုးစုံသုံးပြီး တည်ဆောက်ရတာ ဖြစ်ပါတယ်။ ဒီမှာဆိုရင် Text, Input နဲ့ Button Element တွေကို သုံးထားပါတယ်။ PySimpleGUI မှာ တစ်ခြား Element တွေ အများကြီး ရှိပါတယ်။

Event & Values

Button တစ်ခုခုကို နှိပ်လိုက်တာနဲ့ Window က ပိတ်သွားမှာပါ။ read() function က Button event တွေကို ဖတ်ပေးပါတယ်။ ဒါကြောင့် event တစ်ခုဝင်လာတာနဲ့ သူ့အလုပ်ပြီးပြီ ဖြစ်လို့ Program ရပ်သွားတာပါ။ ဒီလို မဖြစ်အောင် Event တွေကို Loop တစ်ခုထဲမှာ ဖတ်ပေးရပါတယ်။

read function ကို ဒီလို Loop ထဲမှာ ထည့်ပေးလိုက်ပါ။

window = sg.Window("My First App", layout)
# Main Event Loop
while True:
    event, values = window.read()
    if event == sg.WIN_CLOSED:
        break
    if event:
        print("Event: ", event)
        print("Values: ", values)
window.close()

ဒီကုဒ်ကို run လိုက်ရင် Button နှိပ်လိုက်တာနဲ့ Button name ကို Terminal output မှာ ထုတ်ပေးမှာ ဖြစ်ပါတယ်။ Values ဆိုတာကတော့ GUI ကနေ တစ်ဆင့် User ထည့်ပေးတဲ့ တန်ဖိုး တွေ ဖြစ်ပါတယ်။ ဒီတန်ဖိုးတွေကို values ဆိုတဲ့ Dictionary တစ်ခုထဲမှာ သိမ်းထားပါတယ်။ Input Box ထဲမှာ စာရေးပြီး Button နှိပ်လိုက်ရင် values Dictionary ထဲကို စာက ဝင်သွားမှာ ဖြစ်ပါတယ်။ အောက်မှာ နမူနာ ပြပေးထားပါတယ်။

Event & values
Adding Text to Input Box
Event:  OK
Values:  {0: 'Welcome to Pysimplegui'}

User-input တွေကို သိမ်းတဲ့ အခါမှာ Dictionary key ကို 0 ကနေစပြီး အစဉ်အတိုင်း သတ်မှတ်ပေးပါတယ်။ ကိုယ့်စိတ်ကြိုက် Key ကို သုံးချင်တယ်ဆိုရင် သုံးမယ့် Element မှာ Key argument အဖြစ် ထည့်ပေးရပါတယ်။ Program ထဲကနေ update လုပ်ချင်တဲ့ Element ကိုလည်း Key argument ထည့်ပေးရပါတယ်။

# Adding key args to Text and Input elements
# Pysimplegui convention for key: "-KEY-"
layout = [
	[sg.Text("Hello World!", key="-OUTPUT-")],
	[sg.Input(key="-MSG-")],
	[sg.Button("OK"), sg.Button("Cancel")],
]

ဒီမှာဆိုရင် Input element မှာ key ထည့်ထားတဲ့အတွက် Output မှာလည်း Key ပြောင်းသွားတာတွေ့ရမှာပါ။

Event:  OK
Values:  {'-MSG-': 'Welcome to amazing GUI!'}

Updating Element

GUI element တစ်ခုခုကို ပြောင်းလဲချင်တယ်ဆိုရင် window object ကနေတစ်ဆင့် Element key ကို သုံးပြီး Update လုပ်ရပါတယ်။

```python
# Main Event Loop
while True:
	event, values = window.read()
    if event == sg.WIN_CLOSED:
        break
    if event == 'OK':
	    input_text = values['-MSG-']
        window['-OUTPUT-'].update(input_text)
window.close()

အပေါ်ကကုဒ်ထဲမှာ Element key တွေကို သုံးပြီး Text element ကို update လုပ်ထားတာဖြစ်ပါတယ်။ Input box ထဲမှာ စာရိုက်ပြီး Button နှိပ်လိုက်ရင် အပေါ်က စာသား ပြောင်းသွားမှာပါ။

Updating Element

Conclusion

ဒါတွေကတော့ PySimpleGUI library သုံးတဲ့အခါမှာ သိထားရမယ့် အခြေခံတွေ အကုန်လုံးပဲ ဖြစ်ပါတယ်။ ဒီအထိပြောခဲ့တဲ့ အခြေခံတွေကို သေချာ နားလည်ပြီး လိုက်လုပ်ကြည့်လို့ အဆင်ပြေတယ်ဆိုရင် ကိုယ့်စိတ်ကြိုက် App တွေ ရေးလို့ ရပါပြီ။ ရေးတဲ့အခါမှာ ကိုယ်သုံးချင်တဲ့ Element ကို ရှာပြီး သုံးရုံပါပဲ။ ကျန်တာကတော့ Design နဲ့ Customization ပဲရှိပါတယ်။ PySimpleGUI နဲ့ Application ဖန်တီးပုံတွေကို နောက်အပိုင်းတွေမှာ ဆက်ရေးပေးပါမယ်။

Resources

PySimpleGUI မှာ သုံးနိုင်တဲ့ Element တွေနဲ့ သူတို့ရဲ့ Parameter တွေကို ဒီမှာ လေ့လာနိုင်ပါတယ်။

PySimpleGUI Call Reference

ဒါတွေကတော့ PySimpleGUI နဲ့ ရေးထားတဲ့ Program တွေပါ။

PySimpleGUI Demo Programs

Happy Coding!

Leave a comment