🐍 Python UI Programming Series — Part 3: Styling Your UI with Tkinter
📘 Overview
In Part 1 and 2, you learned how to create GUI windows and organize widgets using layout managers. Now, let’s give your app some style and make it visually appealing.
In this part, we’ll cover:
-
Setting fonts and colors
-
Customizing buttons and labels
-
Using themes with
ttk
-
A styled form example
🎨 Why Styling Matters
An intuitive and attractive UI:
-
Improves user experience
-
Enhances usability
-
Makes your app feel polished and professional
Tkinter allows basic styling through widget options and more advanced styling with the ttk
module.
🖌️ Basic Styling with Tkinter Widgets
✅ Set Font and Color
import tkinter as tk
root = tk.Tk()
root.title("Styled Widgets")
label = tk.Label(root, text="Welcome!", font=("Arial", 16, "bold"), fg="white", bg="blue")
label.pack(pady=10)
button = tk.Button(root, text="Click Me", font=("Verdana", 12), bg="#4CAF50", fg="white")
button.pack(pady=10)
root.mainloop()
🔎 Key Style Options:
-
font
: (family
,size
,style
) like("Helvetica", 12, "italic")
-
bg
: background color -
fg
: text color -
relief
: button border style (flat
,raised
,sunken
,ridge
)
💼 Using ttk
for Themes and Consistency
The ttk
(Themed Tkinter) module provides modern-looking widgets with built-in themes.
import tkinter as tk
from tkinter import ttk
root = tk.Tk()
root.title("Using TTK")
ttk.Style().theme_use("clam") # Try: 'alt', 'default', 'classic', 'clam'
label = ttk.Label(root, text="Enter your name:")
label.pack(pady=5)
entry = ttk.Entry(root)
entry.pack(pady=5)
button = ttk.Button(root, text="Submit")
button.pack(pady=5)
root.mainloop()
✅ ttk
improves:
-
Visual consistency across platforms
-
More modern default styles
-
Better alignment and padding
🧠 Tip: Change TTK Widget Style
You can create custom styles for buttons or labels:
style = ttk.Style()
style.configure("TButton", foreground="white", background="#007ACC", font=("Segoe UI", 10, "bold"))
Apply it to your ttk.Button
— it will inherit the new look.
📋 Example: Styled Login Form
import tkinter as tk
from tkinter import ttk
def login():
user = entry_user.get()
result_label.config(text=f"Welcome, {user}!")
root = tk.Tk()
root.title("Styled Login")
root.geometry("300x200")
style = ttk.Style()
style.theme_use("clam")
style.configure("TButton", padding=6, relief="flat", background="#4CAF50", foreground="white")
style.configure("TLabel", font=("Arial", 10))
style.configure("TEntry", padding=4)
ttk.Label(root, text="Username:").pack(pady=5)
entry_user = ttk.Entry(root)
entry_user.pack(pady=5)
ttk.Button(root, text="Login", command=login).pack(pady=10)
result_label = ttk.Label(root, text="")
result_label.pack(pady=10)
root.mainloop()
👀 Simple, styled, and responsive!
💡 Recap
In this part, you learned:
-
How to style basic widgets with fonts, colors, and reliefs
-
How to use
ttk
for modern themes -
How to create a clean, styled form
🚀 Coming Up in Part 4:
"Building a Multi-Page UI in Tkinter"
-
Learn to navigate between multiple windows or frames
-
Build a real-world application structure (e.g., dashboard, form wizard)
No comments:
Post a Comment