ඒකකය 3 – Tkinter සමඟ UI (පරිශීලක අතුරුමුහුණත) නිර්මාණය

UI (User Interface) යනු මෘදුකාංගයක පරිශීලකයා (user) දකින සහ භාවිතා කරන කොටසයි. එනම්, එහි පෙනුමයි. Tkinter මඟින් මෙම පෙනුම සෑදීම සඳහා අපට "විජට්" (Widgets) නමින් හැඳින්වෙන ගොඩනැගිලි ද්‍රව්‍ය රාශියක් ලබා දේ.

🧱 මූලික Widgets: Labels, Buttons, සහ Entry fields

මේවා ඕනෑම මෘදුකාංගයක පාහේ දකින්නට ලැබෙන, අත්‍යවශ්‍යම විජට් වර්ග තුනකි.

• Labels (ලේබල්): මේවා මෘදුකාංගයේ තොරතුරු පෙන්වන පුවරු වැනිය. පරිශීලකයාට වෙනස් කළ නොහැකි මාතෘකා, උපදෙස්, හෝ පණිවිඩ පෙන්වීමට යොදා ගනී.
• Buttons (බොත්තම්): යම්කිසි ක්‍රියාවක් ආරම්භ කිරීමට (උදා: "Save", "Delete", "Calculate") පරිශීලකයාට click කිරීමට සලස්වන විජට් එකකි. එය මෘදුකාංගයක ඇති ස්විච් එකක් වැනිය.
• Entry fields (එන්ට්‍රි ෆීල්ඩ්): පරිශීලකයාගෙන් තොරතුරු (උදා: නම, වයස, මුරපදය) ලබා ගැනීමට භාවිතා කරන තනි පේළියේ ටෙක්ස්ට් box එකකි.

📐 Frames සහ Layouts (pack, grid)

අපි මේ විජට්ස් නිර්මාණය කළාට පසුව, ඒවා වින්ඩෝව තුළ පිළිවෙලකට සකස් කළ යුතුය. මේ සඳහා Tkinter අපට "Layout Managers" ලබා දේ. ප්‍රධාන කළමනාකරුවන් දෙදෙනෙකි.

Frames (ෆ්‍රේම්)

Layout Managers ගැන කතා කිරීමට පෙර, Frames ගැන දැන සිටීම වැදගත්. Frame යනු අනිත් විජට්ස් ඇතුළේ දමා කාණ්ඩ කිරීමට (group) හැකි, නොපෙනෙන රාමුවක් හෝ පෙට්ටියක් වැනිය. සංකීර්ණ UI නිර්මාණයේදී, කොටස් වලට වෙන් කර වැඩ කිරීම පහසු කිරීමට මෙය ඉතා ප්‍රයෝජනවත් වේ.

Layout Managers

• pack(): මෙය සරලම ක්‍රමයයි. ඔබ pack() භාවිතා කරන විට, එය ස්වයංක්‍රීයව විජට් එක වින්ඩෝව තුළ ඇති ඉඩ ප්‍රමාණයට අනුව "අසුරනු" ලබයි. සාමාන්‍යයෙන්, එය විජට් එකින් එක, ඉහළ සිට පහළට පිළිවෙලට තබයි. සරල UI සඳහා මෙය ඉතා ඉක්මන් සහ පහසු ක්‍රමයකි.
• grid(): මෙය වඩාත් බලවත් සහ නම්‍යශීලී ක්‍රමයයි. මෙහිදී, වින්ඩෝව නොපෙනෙන වගුවක් මෙන් පේළි (rows) සහ තීරු (columns) වලට බෙදා, ඔබට අවශ්‍ය විජට් එක, අවශ්‍ය පේළියේ සහ තීරුවේ ස්ථානගත කළ හැක. Calculator එකක් වැනි, විජට්ස් නිශ්චිත ස්ථානවල තැබිය යුතු අවස්ථා සඳහා grid() ඉතාම සුදුසු වේ.

🎨 වර්ණ සහ අක්ෂර මෝස්තර (Fonts) එකතු කිරීම

ඔබේ මෘදුකාංගය වඩාත් ආකර්ෂණීය සහ පරිශීලක-හිතකාමී (user-friendly) කිරීමට, ඔබට විජට් වල පෙනුම වෙනස් කළ හැක.

• bg (background): විජට් එකේ පසුබිම් වර්ණය වෙනස් කිරීමට.
• fg (foreground): විජට් එකේ ඇති අකුරුවල වර්ණය වෙනස් කිරීමට.
• font: අකුරුවල මෝස්තරය (font family) සහ ප්‍රමාණය (size) වෙනස් කිරීමට.

උදාහරණයක් ලෙස:

# නිල් පසුබිමක් සහ සුදු අකුරු සහිත බොත්තමක්
my_button = tk.Button(root, 
                      text="Click Me", 
                      fg="white", 
                      bg="blue", 
                      font=("Helvetica", 12))
            

🖱️ බොත්තම් click කිරීම හැසිරවීම (Handling button clicks)

බොත්තමක් click කළ විට කිසිවක් සිදු නොවන්නේ නම්, එයින් කිසිදු ප්‍රයෝජනයක් නැත. බොත්තමක් click කළ විට යම් කාර්යයක් සිදු වීමට සැලැස්වීම සඳහා, අපි Python ශ්‍රිතයක් (function) භාවිතා කර, එය බොත්තමේ command යන විකල්පයට (option) සම්බන්ධ කරමු.

පහත උදාහරණය බලන්න:

# 1. බොත්තම click කළ විට ක්‍රියාත්මක විය යුතු function එක නිර්මාණය කිරීම
def on_button_click():
    print("බොත්තම click කරන ලදී!")

# 2. බොත්තම නිර්මාණය කර, 'command' එකට ඉහත function එක ලබා දීම
# වැදගත්: on_button_click() ලෙස වරහන් යොදන්නේ නැත.
button = tk.Button(root, text="මාව click කරන්න", command=on_button_click)
button.pack()
            

දැන්, ඔබ මෙම බොත්තම click කරන සෑම අවස්ථාවකම, "බොත්තම click කරන ලදී!" යන පණිවිඩය ඔබේ terminal/console එකේ දිස්වනු ඇත. දැන් ඔබට පරිශීලකයා සමඟ අන්තර්ක්‍රියා කළ හැකි (interactive) මෘදුකාංග නිර්මාණය කිරීමේ මූලික දැනුම තිබේ!