Search code examples
pythontkintercustomtkinter

Changing the label progresivelly (Custom tkinter)


I've been trying to program some kind of countdown in python with UI. It's my first time working with Custom tkinter. I've encountered a small problem where if I input the time, the label won't change as it should. If you know how to change the text of the label into 00:00 format and make it change progresivelly, please let me know.

I've tried many things I can't name, if anyone's interested in the whole code, here:

from customtkinter import *
from PIL import Image
import time

app = CTk()
app.title('Countdown, hopefully')
app.geometry("500x400")
set_appearance_mode('light') #or 'light'


minutes, seconds = 0, 0
switch_var_1 = StringVar(value="off")


def countdown(t):

    def therest():
        setted_text.configure('{minutes:02d}:{seconds:02d}')

    while t:
        mins, secs = divmod(t, 60)
        timer = '{:02d}:{:02d}'.format(mins, secs)
        therest()
        print(timer, end = "\r")
        time.sleep(1)
        t -= 1

    print("ring")

def switch_event():
    if switch_var_1.get() == 'on':
        set_appearance_mode('dark')
    elif switch_var_1.get() == 'off':
        set_appearance_mode('light')

def start():
    t = time_entry.get()
    countdown(int(t))


entry_frame = CTkFrame(
    master=app,
    width=234,
    height=55,
    corner_radius=7,
    bg_color='transparent',
    fg_color='transparent'
)

time_entry = CTkEntry(
    master=entry_frame,
    placeholder_text='Enter the time (in seconds):',
    placeholder_text_color=('gray', '#e3d296'),
    text_color=('black', '#ffe894'),
    border_color=('gray', '#e3d296'),
    border_width=3,
    width=200,
    height=25,
    corner_radius=7
)

setted_text = CTkLabel(
    master=entry_frame,
    text='00:00',
    font=('Brass Mono', 20),
    text_color=('black', '#ffe894')
)

def set_text():
    setted_text.configure(text=f"{time_entry.get()}")

button_entry = CTkButton(
    master=entry_frame,
    text='Set',
    bg_color='transparent',
    fg_color='transparent',
    text_color=('black','#ffe894'),
    border_color=('gray', '#e3d296'),
    hover_color=('#d9d9d9', 'black'),
    corner_radius=1,
    height=25,
    width=40,
    border_width=3,
    command=set_text
)

switch_1 = CTkSwitch(
    master=app,
    text='Mode',
    text_color=('black', '#ffe894'),
    command=switch_event,
    variable=switch_var_1, onvalue="on", offvalue="off",
    progress_color='#ddc774',
    button_color=('black', '#ffe894'),
    button_hover_color=('#3c3c3c', '#ffeeac')
)

button_start = CTkButton(
    master=entry_frame,
    text='Start Countdown',
    bg_color='transparent',
    fg_color='transparent',
    text_color=('black','#ffe894'),
    border_color=('gray', '#e3d296'),
    hover_color=('#d9d9d9', 'black'),
    corner_radius=7,
    height=25,
    width=40,
    border_width=3,
    command=start
)


switch_1.place(relx=1, rely=0.9, anchor='se')
time_entry.place(relx=0, rely=0, anchor='nw')
button_entry.place(relx=1, rely=0, anchor='ne')
entry_frame.place(relx=0.1, rely=0.1, anchor='nw')
setted_text.place(relx=0, rely=1, anchor='sw')
button_start.place(relx=1, rely=1, anchor='se')

app.mainloop()

Solution

  • Edit: Adding screenshot.

    I've encountered a small problem where if I input the time, the label won't change as it should.

    Add app.update() and setted_text.configure in countdown(t) function.

    Snippet:

    def countdown(t):
    
        def therest():
            setted_text.configure('{seconds:02d}')
    
        while t:
            mins, secs = divmod(t, 60)
            timer = '{:01d}'.format(secs)
            
            therest()
            print(timer)
            setted_text.configure(text=timer)  
            time.sleep(1)
             
            t -= 1
            app.update() 
            
        print("ring")
        setted_text.configure(text='ring')
    

    Screenshot:

    enter image description here