On/Off Toggle Button Switch in Tkinter

Creating an on/off toggle button in Tkinter is useful for implementing features like dark mode, settings toggles, or any binary state controls. This involves changing button images and associated text when clicked.

Basic Toggle Button Structure

A toggle button requires three key components: a state variable, images for both states, and a function to switch between them ?

import tkinter as tk
from tkinter import ttk

# Create main window
root = tk.Tk()
root.title('Toggle Button Demo')
root.geometry('400x200')

# State variable
is_on = True

# Toggle function
def toggle():
    global is_on
    is_on = not is_on
    if is_on:
        toggle_btn.config(text='ON', bg='green', fg='white')
        status_label.config(text='Status: Active')
    else:
        toggle_btn.config(text='OFF', bg='red', fg='white')
        status_label.config(text='Status: Inactive')

# Create widgets
toggle_btn = tk.Button(root, text='ON', bg='green', fg='white', 
                       font=('Arial', 16), command=toggle, width=10)
toggle_btn.pack(pady=20)

status_label = tk.Label(root, text='Status: Active', font=('Arial', 12))
status_label.pack()

root.mainloop()

Advanced Toggle with Custom Styling

For a more polished look, we can create a custom toggle button with specific colors and styling ?

import tkinter as tk

class ToggleButton:
    def __init__(self, parent):
        self.parent = parent
        self.is_on = False
        
        # Create frame for the toggle
        self.frame = tk.Frame(parent, bg='white')
        self.frame.pack(pady=20)
        
        # Create the toggle button
        self.button = tk.Button(
            self.frame,
            text='OFF',
            command=self.toggle,
            bg='#ff4757',
            fg='white',
            font=('Arial', 14, 'bold'),
            relief='flat',
            width=12,
            height=2
        )
        self.button.pack()
        
        # Status label
        self.status = tk.Label(
            parent,
            text='Feature is OFF',
            font=('Arial', 11),
            fg='#2c2c54'
        )
        self.status.pack()
    
    def toggle(self):
        if self.is_on:
            # Turn OFF
            self.button.config(
                text='OFF',
                bg='#ff4757',
                activebackground='#ff3838'
            )
            self.status.config(text='Feature is OFF', fg='#ff4757')
            self.is_on = False
        else:
            # Turn ON
            self.button.config(
                text='ON',
                bg='#2ed573',
                activebackground='#26d166'
            )
            self.status.config(text='Feature is ON', fg='#2ed573')
            self.is_on = True

# Create application
root = tk.Tk()
root.title('Custom Toggle Button')
root.geometry('300x150')
root.config(bg='white')

# Create toggle button
toggle = ToggleButton(root)

root.mainloop()

Toggle Button with Icons

You can enhance the toggle button by using Unicode symbols or creating simple graphical representations ?

import tkinter as tk

def create_toggle_app():
    root = tk.Tk()
    root.title('Icon Toggle Button')
    root.geometry('250x150')
    root.config(bg='#f5f5f5')
    
    # State variable
    is_enabled = False
    
    def toggle_state():
        nonlocal is_enabled
        is_enabled = not is_enabled
        
        if is_enabled:
            btn.config(text='? ON', bg='#4CAF50', fg='white')
            info_label.config(text='System Enabled', fg='#4CAF50')
        else:
            btn.config(text='? OFF', bg='#f44336', fg='white')
            info_label.config(text='System Disabled', fg='#f44336')
    
    # Toggle button
    btn = tk.Button(
        root,
        text='? OFF',
        command=toggle_state,
        font=('Arial', 12, 'bold'),
        bg='#f44336',
        fg='white',
        relief='raised',
        borderwidth=2,
        width=15,
        height=2
    )
    btn.pack(pady=30)
    
    # Info label
    info_label = tk.Label(
        root,
        text='System Disabled',
        font=('Arial', 10),
        bg='#f5f5f5',
        fg='#f44336'
    )
    info_label.pack()
    
    return root

app = create_toggle_app()
app.mainloop()

Key Features

Conclusion

Toggle buttons in Tkinter provide intuitive binary controls for your applications. Use state variables to track status and update visual elements accordingly for clear user feedback.