Search code examples
pythonuser-interfacetkinterlabeltransparent

How do I make the background of a tkinter label transparent so only the text is seen?


I'm creating a countdown application for an event and I've managed to get everything up and running except for the labels. I can't make their background's transparent so that only the text is shown. Is there a way for me to do this?

import datetime
import tkinter as tk


def round_time(dt, round_to):
    seconds = (dt - dt.min).seconds
    rounding = (seconds + round_to / 2) // round_to * round_to
    return dt + datetime.timedelta(0, rounding - seconds, -dt.microsecond)


def ct(label):
    def count():
        now = round_time(datetime.datetime.now(), round_to=1)
        eh = datetime.datetime(2019, 3, 31, 20, 30)
        tte = eh - now
        label.config(text=str(tte))
        label.after(50, count)

    count()


root = tk.Tk()
root.title("Earth Hour Countdown!")
now = round_time(datetime.datetime.now(), round_to=1)
eh = datetime.datetime(2019, 3, 31, 20, 30)
tte = eh - now
frame = tk.Frame(root, bg="#486068")
frame.place(relwidth=1, relheight=1)

canvas = tk.Canvas(root, height=200, width=500)
canvas.place(relwidth=1, relheight=1)

bg_img = tk.PhotoImage(file="C:/Users/bmg/Desktop/eh1.gif")
bg_label = tk.Label(canvas, image=bg_img)
bg_label.place(relwidth=1, relheight=1)

label_msg = tk.Label(root, text="Earth Hour Countdown:", font="MSGothic 50 bold", bg="black", fg="#652828", bd=1)
label_msg.place(relx=0.035, rely=0.1)

label_cd = tk.Label(root, text=str(tte), font="MSGothic 50 bold", bg="black", fg="#652828", bd=1)
label_cd.place(relx=0.590, rely=0.1)

ehtime_label = tk.Label(root, text=("Earth Hour:" + eh.strftime("%d-%m-%Y %H:%M:%S")), font="MSGothic 50 bold", bg="black", fg="#652828", bd=1)
ehtime_label.place(relx=0.13, rely=0.3)

ct(label_cd)

root.mainloop()

Example of Label Output: https://imgur.com/97DkJBa


Solution

  • I don't think you can make a Label transparent.

    You can create text on a Canvas though, this text by default doesn't have a background:

    import datetime
    import tkinter as tk
    
    
    def round_time(dt, round_to):
        seconds = (dt - dt.min).seconds
        rounding = (seconds + round_to / 2) // round_to * round_to
        return dt + datetime.timedelta(0, rounding - seconds, -dt.microsecond)
    
    
    def ct():
        def count():
            now = round_time(datetime.datetime.now(), round_to=1)
            eh = datetime.datetime(2019, 3, 31, 20, 30)
            tte = eh - now
            canvas.itemconfig(label_cd, text=str(tte))
            root.after(50, count)
    
        count()
    
    
    root = tk.Tk()
    root.title("Earth Hour Countdown!")
    now = round_time(datetime.datetime.now(), round_to=1)
    eh = datetime.datetime(2019, 3, 31, 20, 30)
    tte = eh - now
    
    canvas = tk.Canvas(root, height=360, width=1333)
    canvas.pack()
    
    bg_img = tk.PhotoImage(file="C:/Users/bmg/Desktop/eh1.gif")
    bg_label = canvas.create_image((0,0), image=bg_img, anchor=tk.N+tk.W)
    
    label_msg = canvas.create_text((410, 120), text="Earth Hour Countdown:", font="MSGothic 50 bold", fill="#652828")
    
    label_cd = canvas.create_text((1030,120), text=str(tte), font="MSGothic 50 bold", fill="#652828")
    
    ehtime_label = canvas.create_text((650,240), text=("Earth Hour:" + eh.strftime("%d-%m-%Y %H:%M:%S")), font="MSGothic 50 bold", fill="#652828")
    
    ct()
    
    root.mainloop()
    

    Note that this also requires some changes to the placement of the text and how to update it. I've tried to keep things as close to your example as possible. Do note that not having a background for your text might not give you the readability you'd like:

    enter image description here