An application of TTKTheme to the app style

Question

I have installed the ttk themes through pip install ttkthemes, import and apply theme 'blue' in labels, entries and buttons, however, the app style did not apply the selected theme. Following is my py file.

import requests
from tkinter import *
from tkinter import ttk
from ttkthemes import ThemedTk

root = ThemedTk(theme='blue')
root.title('Currency Converter')
root.geometry("450x400")

style = ttk.Style()
style.theme_use('blue')  
                       
def currency_convertion():
    global result_label
    url = "https://api.apilayer.com/exchangerates_data/convert?to=" + to_currency_entry.get() + "&from=" + from_currency_entry.get() + "&amount=" + amount_entry.get()

    payload = {}
    headers= {
    "apikey": ""
    }

    response = requests.request("GET", url, headers=headers, data = payload)

    status_code = response.status_code
    data = response.text
   
    result_label = ttk.Label(label_frame, text=f'{to_currency_entry.get()} {data[231:240]}', font='Helvetica, 25',bd=0, bg='#292929', fg='silver')
    result_label.grid(row=5, column= 0, columnspan=2)
    
    
def clear_result_label():
    result_label.config(text=f'', font='Helvetica, 25',bd=0, bg='#292929', fg='silver')
    from_currency_entry.delete(0, END)
    to_currency_entry.delete(0, END)
    amount_entry.delete(0, END)
    
frame = Frame(master=root, width=200, height=300)
frame.pack(padx=20, pady=20)

label_frame = Frame(master=root, width=350, height=300)
label_frame.pack(pady=10)

from_currency_label = ttk.Label(frame, text='From Currency')
from_currency_label.grid(row=1, column=0, pady=10)

to_currency_label = ttk.Label(frame, text='To Currency')
to_currency_label.grid(row=2, column=0, pady=10)
 
amount_label = ttk.Label(frame, text='Amount')
amount_label.grid(row=3, column=0, pady=10)

from_currency_entry = ttk.Entry(frame, font="Helvetica, 15")
from_currency_entry.grid(row=1, column=1, stick=W+E+N+S, pady=10)

to_currency_entry = ttk.Entry(frame, font="Helvetica, 15")
to_currency_entry.grid(row=2, column=1, stick=W+E+N+S,pady=10)
 
amount_entry = ttk.Entry(frame, font="Helvetica, 15")
amount_entry.grid(row=3, column=1, stick=W+E+N+S, pady=10)

button = ttk.Button(frame, text="Convert", command=currency_convertion)
button.grid(row=4, column=0, pady=20, padx=35)

button = ttk.Button(frame, text="Clear", command=clear_result_label)
button.grid(row=4, column=1, pady=20)

root.mainloop()

Would each theme need to install individually? or change the themes only the way to change the style.theme_use that will affect every widget? How could I apply the select theme to the app style?

Answer 1

I know this is an old question but maybe it might help someone in the future:

The first problem is that on lines 39-40 you used a regular tkinter frame instead of a ttk.Frame.

Your lines:

frame = Frame(master=root, width=200, height=300)
frame.pack(padx=20, pady=20)

Corrected:

frame = ttk.Frame(master=root, width=200, height=300)
frame.pack(padx=20, pady=20)

Furthermore, I have noticed that when using themed tkinter, to get the background color right, you should start with a ttk.Frame that is set to fill and expand the entire main window and then use that frame as your master for all other widgets.

The updated code you showed would look as following:

import requests
from tkinter import *
from tkinter import ttk
from ttkthemes import ThemedTk

root = ThemedTk(theme='blue')
root.title('Currency Converter')
root.geometry("450x400")

style = ttk.Style()
style.theme_use('blue')


def currency_convertion():
    global result_label
    url = "https://api.apilayer.com/exchangerates_data/convert?to=" + to_currency_entry.get() + "&from=" + from_currency_entry.get() + "&amount=" + amount_entry.get()

    payload = {}
    headers = {
        "apikey": ""
    }

    response = requests.request("GET", url, headers=headers, data=payload)

    status_code = response.status_code
    data = response.text

    result_label = ttk.Label(label_frame, text=f'{to_currency_entry.get()} {data[231:240]}', font='Helvetica, 25', bd=0, bg='#292929', fg='silver')
    result_label.grid(row=5, column=0, columnspan=2)


def clear_result_label():
    result_label.config(text=f'', font='Helvetica, 25', bd=0, bg='#292929', fg='silver')
    from_currency_entry.delete(0, END)
    to_currency_entry.delete(0, END)
    amount_entry.delete(0, END)


master_frame = ttk.Frame()
master_frame.pack(fill="both", expand=True)

frame = ttk.Frame(master=master_frame, width=200, height=300)
frame.pack(padx=20, pady=20)

label_frame = ttk.Frame(master=master_frame, width=350, height=300)
label_frame.pack(pady=10)

from_currency_label = ttk.Label(frame, text='From Currency')
from_currency_label.grid(row=1, column=0, pady=10)

to_currency_label = ttk.Label(frame, text='To Currency')
to_currency_label.grid(row=2, column=0, pady=10)

amount_label = ttk.Label(frame, text='Amount')
amount_label.grid(row=3, column=0, pady=10)

from_currency_entry = ttk.Entry(frame, font="Helvetica, 15")
from_currency_entry.grid(row=1, column=1, stick=W + E + N + S, pady=10)

to_currency_entry = ttk.Entry(frame, font="Helvetica, 15")
to_currency_entry.grid(row=2, column=1, stick=W + E + N + S, pady=10)

amount_entry = ttk.Entry(frame, font="Helvetica, 15")
amount_entry.grid(row=3, column=1, stick=W + E + N + S, pady=10)

button = ttk.Button(frame, text="Convert", command=currency_convertion)
button.grid(row=4, column=0, pady=20, padx=35)

button = ttk.Button(frame, text="Clear", command=clear_result_label)
button.grid(row=4, column=1, pady=20)

root.mainloop()

And this way you can get the window to match the right theme:

Answer 2

I tried your code and below is the resulting theme. I think it has worked, especially when comparing it to the non-themed UI under that. I know that I don't pose an answer but I thought I'd just let you know that your theme works on my computer(linux). Maybe try reinstalling ttkthemes?