Tkinter: explaining the use of ttk with radiobutton example

Video with code for ttk and radiobuttons

With ttk (from the tkinter module) we can have a better look for our widgets. With some little changes in our code we can obtain this, as you will see in the lines of code below and the video that follows.

import tkinter as tk
import tkinter.ttk as ttk

root = tk.Tk()
vstring = tk.IntVar()
values = [
    ("option 1"),
    ("option 2"),
    ("option 3"),
    ("option 4")
]

for v in values:
	# Here is the ttk style widget
    rb = ttk.Radiobutton(root,
        text=v,
        value= v[-1],
        variable = vstring)
    rb.pack(anchor=tk.W)

root. mainloop()

The result is this new look of the radiobuttons and the old look

# for the old style just change this (tk instead of ttk before Radiobutton)

rb = tk.Radiobutton(root, text=v, value= v[-1], variable = vstring)

As you can see the ttk round shape of the radiobuttons looks more flat and newer than the tk version. The tk radiobutton, also, occupies more space among each other, as you can see by the fact that the window is taller for the tk version.

Give the ttk Radiobuttons some style

In ttk to change the style of the widgets things work a little different than in tkinter regular widgets. This is an example of how to apply some changes to the style of the Radiobuttons in ttk.

# the code
# for the original tkinter

import tkinter as tk
import tkinter.ttk as ttk

root = tk.Tk()
vstring = tk.IntVar()
values = [
    ("Rome 1"),
    ("Paris 2"),
    ("London 3"),
    ("New York 4")
]


style = ttk.Style()
style.configure("BW.TRadiobutton", foreground="red", background="yellow")

for v in values:
	# Here is the ttk style widget
    rb = ttk.Radiobutton(root,
        text=v[:-1],
        value= v[-1],
        variable = vstring,
        style = "BW.TRadiobutton"
        )
    rb.pack(anchor=tk.W)

root. mainloop()

The result is this:

Using Images instead of text

In this example we modified the previous code to use images instead of text

# the code
# for the original tkinter

import tkinter as tk
import tkinter.ttk as ttk

root = tk.Tk()
vstring = tk.IntVar()
values = [
    ("walk01.png1"),
    ("walk02.png2"),
    ("walk04.png3"),
    ("walk03.png4")
]


style = ttk.Style()
style.configure("BW.TRadiobutton", foreground="red", background="yellow")

img = [tk.PhotoImage(file=x[:-1]) for x in values]
for n,v in enumerate(values):
	# Here is the ttk style widget
    rb = ttk.Radiobutton(root,
        image=img[n],
        value= v[-1],
        variable = vstring,
        style = "BW.TRadiobutton"
        )
    rb.pack(side="left", anchor=tk.W)

root. mainloop()

This is the result

To be continued… ?

Tkinter test for students

Tkinter articles