Creating animated widgets in Tkinter can add an engaging and dynamic element to your GUI applications. In this tutorial, we will go through the process of creating animated widgets using the Tkinter library in Python.
Step 1: Import the necessary modules
First, you’ll need to import the Tkinter module and any other modules that you’ll be using in your application. To create animated widgets, we will also need the after
method from the Tkinter module, which allows us to schedule the execution of a function after a certain amount of time has passed.
import tkinter as tk
Step 2: Create the main application window
Next, you’ll need to create the main application window using the Tk
class.
root = tk.Tk()
root.title("Animated Widget Tutorial")
Step 3: Create the animated widget
Now, we can create the animated widget. For this tutorial, let’s create a simple animated label that moves horizontally across the window.
label = tk.Label(root, text="Hello, World!", font=("Arial", 12))
label.pack()
def animate_label():
x, y = label.winfo_x(), label.winfo_y()
if x < root.winfo_width():
label.place(x=x+1, y=y)
root.after(10, animate_label)
animate_label()
In the animate_label
function, we get the current x and y coordinates of the label using the winfo_x
and winfo_y
methods. We then check if the label is still within the bounds of the window’s width. If it is, we increment the x coordinate by 1 and move the label using the place
method. We then schedule the animate_label
function to be called again after 10 milliseconds using the after
method.
Step 4: Start the main event loop
Finally, we need to start the main event loop to display the animated widget.
root.mainloop()
That’s it! You have successfully created an animated widget in Tkinter. You can customize the animation by changing the movement direction, speed, and other properties of the widget. Experiment with different widgets and animations to enhance the visual appeal of your GUI applications.
appreciate your work so much. Thanks
Having real dramas not getting the slide panel to stick to the frame during resizing etc. If i resize or click on the main window – the panel drops to the back. If i drag the window right – It drops behind the root window. Bloody annoying
oh man you are awsome
Nice
Good information
If you're constrained to use the place method, your widget's position is absolute, meaning the window might not be resizable. Additionally, if you resize the window, the widget may not adapt to the new size. Is this correct? Is there a solution for this?
Great video! Really helpfull and very clearly explained. I however have been dealing with some issues with animation and functions in general that I don't notice happening to you. Basically, running any function complitely freezes the app until the code in that function is over. Animation just won't render, in this case the button will move to the last position after some time. To solve this I've started using threading to separate the mainloop function and any other function triggered by the widgets, but I'm really curious as to why you don't seem to have this same issue. Anyway, thank you so much for the lesson!
🎉Thanks for the informative videos, they are well presented and very easy to understand. The best I've come across so far. Thanks for the effort you have gone to. 😊
You R The Best I Have Ever Seen!
19:22 When my full attention was on this and sir you pressed the button and this button itself started moving to the right, I could not stop laughing.
.
Sir you are really awesome and humble.❤
Thank you so much. It is very useful and easy to understand.
That's pretty dang cool, thank you!
this animated sidebar is in the back of window elements like frame and label, so you can't use it on another window with content.
anyone has any solution for that?
please tell me how i can change the background colour of frame?
Your videos are an absolutely fantastic resource for someone like me. Greatly appreciate the effort and time you put in here!!👏🏼👏🏼
As the documentation recommends , that to never use Place method for geography management , for reasons such " If you want to insert a widget at the top, you have to correct the positions of every other widgets below." … now consider that we want to Animate them and that worsen the problem hundred times more.
But I really Appriciate this tutorial , it is really great that now we have the simplicity of tkinter , with the modern look of other GUIs . I recently wanting to learn Kivy , and I hope find something in your channel about it . I learn PiSimpleGUI from Clear code . and lots of other things thanks to you
I build a mine sweeper game with CTk , and instead of mine cells I choosed the picture of the dictator of Iran (the most hated children killer) pops out in the Button , But I Thinking if I Find a way that widget expand to all the frame . after all the game is ending when you capture one Ayatollah. and this give me an Idea to how pop-out an animated picture of him filling the whole screen
Question , I have a Frame , and in this frame color is black , but when I put Button in it ( I Don't know if the size of it is related or not ) but the frame color will change to grey ( Default color of the CTk.Frame . an Any one help me with that ?? ( only with Grid) The CODE IS LIKE THIS
class Cell creates Buttons and I use this class to create N*N grid Button , but my frame color will affected if I use Grid
for x in range(s.GRID_SIZE):
for y in range(s.GRID_SIZE):
c = Cell(x,y)
c.create_btn_object(center_frame)
c.cell_btn_object.grid(
row=y, column=x
)
what happened To CLEAR CODE ?? I really love your style of teaching ,are you have more channels ??