Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Change the color of "tab header" in ttk.Notebook (tkinter)
Tabs are very useful for multipurpose GUI applications. They help isolate several tasks or processes within the application in the form of tabs, allowing users to process multiple tasks at a time. With the help of Tkinter Notebook widget, we can create tabs in our tkinter application.
To configure the property or style of the tabs, we must use a ttk themed widget. The ttk themed widget helps to style any widget present in the application. To configure the background color of the tab, you can use ttk 'default' theme along with passing 'TNotebook.Tab' as the style parameter in configuration.
Basic Tab Header Color Configuration
Here's how to change the tab header color using ttk.Style ?
# Import the required libraries
from tkinter import *
from tkinter import ttk
# Create an instance of tkinter frame
win = Tk()
# Set the size of the tkinter window
win.geometry("700x350")
# Create an instance of ttk style
s = ttk.Style()
s.theme_use('default')
s.configure('TNotebook.Tab', background="green3")
s.map("TNotebook", background=[("selected", "green3")])
# Create a Notebook widget
nb = ttk.Notebook(win)
# Add a frame for adding a new tab
f1 = ttk.Frame(nb, width=400, height=180)
# Adding the Tab Name
nb.add(f1, text='Tkinter-1')
f2 = ttk.Frame(nb, width=400, height=180)
nb.add(f2, text="Tkinter-2")
nb.pack(expand=True, fill=BOTH, padx=5, pady=5)
win.mainloop()
Advanced Styling with Different States
You can also customize tab colors for different states like hover and active ?
from tkinter import *
from tkinter import ttk
win = Tk()
win.geometry("700x350")
win.title("Advanced Tab Styling")
# Create ttk style instance
style = ttk.Style()
style.theme_use('default')
# Configure different tab states
style.configure('TNotebook.Tab',
background='lightblue',
foreground='black',
padding=[10, 5])
style.map('TNotebook.Tab',
background=[('selected', 'navy'),
('active', 'skyblue')],
foreground=[('selected', 'white'),
('active', 'black')])
# Create notebook
notebook = ttk.Notebook(win)
# Create multiple tabs
for i in range(3):
frame = ttk.Frame(notebook)
label = ttk.Label(frame, text=f"Content for Tab {i+1}")
label.pack(pady=20)
notebook.add(frame, text=f"Tab {i+1}")
notebook.pack(expand=True, fill=BOTH, padx=10, pady=10)
win.mainloop()
Key Configuration Options
| Style Element | Purpose | Example Value |
|---|---|---|
TNotebook.Tab |
Tab header styling | background="blue" |
selected state |
Active tab color | ("selected", "navy") |
active state |
Hover tab color | ("active", "lightblue") |
Conclusion
Use ttk.Style().configure() to set basic tab colors and map() for state-specific styling. The 'default' theme provides the most customization options for tab header colors.
