Assigning color to ttk.Button

I would like to assign color to the background of my button as well as the text of my button. I thought I could assign it with fg and bg but there seems to be no reference at all in ttk.Button.

How can I assign text and background color to my button?

class tkinterApp(tk.Tk):
     
    # __init__ function for class tkinterApp
    def __init__(self, *args, **kwargs):
         
        # __init__ function for class Tk
        tk.Tk.__init__(self, *args, **kwargs)
        
        #Gridding the tkinter window
        self.grid_rowconfigure(0, weight = 1)
        self.grid_columnconfigure(0, weight = 1)
         
        # creating a container
        container = tk.Frame(self) 
        container.grid(row=0, column=0, sticky = 'nsew')
  
        container.grid_rowconfigure(0, weight = 1)
        container.grid_columnconfigure(0, weight = 1)
  
        # initializing frames to an empty array
        self.frames = {} 
  
        # iterating through a tuple consisting
        # of the different page layouts
        for F in (Home, FoldClothes, Joke):
  
            frame = F(container, self)
  
            # initializing frame of that object from
            # Home, FoldClothes, Joke respectively with
            # for loop
            self.frames[F] = frame
  
            frame.grid(row = 0, column = 0, sticky ="nsew")
  
        self.show_frame(Home)
  
    # to display the current frame passed as
    # parameter
    def show_frame(self, cont):
        frame = self.frames[cont]
        frame.tkraise()
  
class Home(tk.Frame):
    def __init__(self, parent, controller):
        tk.Frame.__init__(self, parent)
        Frame.configure(self, background="#272933" )
        # label of frame Layout 2
        welcome = ttk.Label(self, text =" ", foreground='white',background="#272933" ,font = LARGEFONT, padding=40,  )
        sub = ttk.Label(self, text =" ", foreground='white',background="#272933",font = ("Verdana", 28), anchor="e",  )
        welcome.grid(row = 0, column = 1, )
        sub.grid(row = 2, column = 1,  )
        
        
        #Creating a frame exclusively for the buttons
        self.frame_buttons = tk.Frame(parent)
        self.frame_buttons.grid(row = 1, column = 0, columnspan = 3,)
        self.frame_buttons.grid_remove()
        
        #Gridding self.frame_buttons
        self.frame_buttons.grid_columnconfigure((0,1), weight = 2)
        self.frame_buttons.grid_rowconfigure(0, weight = 1)


        style = ttk.Style()
        style.theme_use("default")

        style.map("work",
          background = [("active", "red"), ("!active", "blue")],
          foreground = [("active", "yellow"), ("!active", "red")])

        button1 = ttk.Button(self.frame_buttons , style="work",text =" " ,command = lambda : controller.show_frame(FoldClothes),width=50, padding=40,  )
        button1.grid(row = 0, column = 0,  )

        button2 = ttk.Button(self.frame_buttons, text =" ", command = lambda : controller.show_frame(Joke), width=50, padding=40 )
        button2.grid(row = 0, column = 1,)

        button3 = ttk.Button(self.frame_buttons, text =" ", command = lambda : controller.show_frame(FoldClothes),  width=30, padding=40)
        button3.grid(row = 0, column = 2, )
        
    def tkraise(self):
        self.frame_buttons.grid()
        tk.Frame.tkraise(self)

# second window frame page1
class FoldClothes(tk.Frame):
     
    def __init__(self, parent, controller):
        tk.Frame.__init__(self, parent)
        Frame.configure(self, bg="yellow")
        label = ttk.Label(self, text ="Page 1", font = LARGEFONT)
        label.grid(row = 0, column = 2)
        
        #Creating a frame exclusively for the buttons
        self.frame_buttons = tk.Frame(parent)
        self.frame_buttons.grid(row = 1, column = 0, columnspan = 3)
        self.frame_buttons.grid_remove()
        
        #Gridding self.frame_buttons
        self.frame_buttons.grid_columnconfigure((0,1), weight = 1)
        self.frame_buttons.grid_rowconfigure(0, weight = 1)
        
        button1 = ttk.Button(self.frame_buttons,text ="Home", command = lambda : controller.show_frame(Home), width=50, padding=40)
        button1.grid(row = 0, column = 0, )

        button2 = ttk.Button(self.frame_buttons, text ="Tell me a Joke", command = lambda : controller.show_frame(Joke), width=50, padding=40)
        button2.grid(row = 0, column = 1, )

        button3 = ttk.Button(self.frame_buttons, text ="Today's Lucky Numbers", command = lambda : controller.show_frame(FoldClothes), width=30, padding=40)
        button3.grid(row = 0, column = 2, )
        
    def tkraise(self):
        self.frame_buttons.grid()
        tk.Frame.tkraise(self)

Error when calling style

Traceback (most recent call last):
    app = tkinterApp()
  File "c:UsersJustinDesktoppiPi-that-folds-your-clothesGUI.py", line 43, in __init__
    frame = F(container, self)
  File "c:UsersJustinDesktoppiPi-that-folds-your-clothesGUI.py", line 82, in __init__
    button1 = ttk.Button(self.frame_buttons ,text ="Let's Fold some Clothes" ,command = lambda : controller.show_frame(FoldClothes),width=50, padding=40,style='work' )  
  File "C:UsersJustinminiconda3libtkinterttk.py", line 607, in __init__
    Widget.__init__(self, master, "ttk::button", kw)
  File "C:UsersJustinminiconda3libtkinterttk.py", line 552, in __init__
    tkinter.Widget.__init__(self, master, widgetname, kw=kw)
  File "C:UsersJustinminiconda3libtkinter__init__.py", line 2572, in __init__
    self.tk.call(
_tkinter.TclError: Layout work not found

Answer

Python docs explain how to change colors using ttk. Here is a simplified example.

Note the use of style map that alters the colors based on user interaction.

import tkinter as tk
from tkinter import ttk

master = tk.Tk()

style = ttk.Style()
style.theme_use("default")

style.map("Mod.TButton",
          background = [("active", "red"), ("!active", "blue")],
          foreground = [("active", "yellow"), ("!active", "red")])

txt_btn = ttk.Button(master, text="Text", style="Mod.TButton").pack()

master.mainloop()

In your code you map button1 with style.map("work", this should be style.map("work.TButton",. Also your button1 style declaration needs to change accordingly.

Advertisement

Answer