是否可以为 tkinter 中的网格管理器布局的帧设置动画？

Question

I made this desktop application with tkinter and finished the main functionalities. But now I want to make it look better and even animate the menus is possible. The thing is the buttons and widgets that I used are contained in frames and all of them were put by using the grid layout manageR. So I was wondering if i could maybe animate elements ( mainly buttons and frames ) w

For an example if I hover my mouse over a button it'll increase its size a bit, but I want of course to see the increase of that size in time. O r maybe when I click one button and I need to change to a new frame, then the old one will slide to the right for example

Answer 1

The following code combines some ideas for interactive buttons within a grid cell:

• callbacks <Enter> and <Leave> for mouse hovering
• a button size specified in pixels as suggested by Bryan Oakley (here: https://stackoverflow.com/a/46286221/13257648 )
• using padx/pady and width/height to control space reserved for button
• root.after(milliseconds, function) as suggested in furas comment

import tkinter as tk

buttonsize = [120, 50]
extrasize = [10, 10]
framepad = [6, 6]
anim_time = 40
anim_steps = 10

root = tk.Tk()
pixel = tk.PhotoImage(width=1, height=1)

def SizeChange(event, fraction):
    event.widget.grid_configure(padx=(1.0-fraction)*extrasize[0], pady=(1.0-fraction)*extrasize[1])
    event.widget.configure(width=buttonsize[0]+2*fraction*extrasize[0],
        height=buttonsize[1]+2*fraction*extrasize[1])
    root.update_idletasks()


def Highlight(event):
    for idx in range(anim_steps):
        fraction = float(idx+1)/anim_steps
        root.after(int(fraction*anim_time), SizeChange(event, fraction))


def Unhighlight(event):
    for idx in range(anim_steps):
        fraction = 1.0 - float(idx+1)/anim_steps
        root.after(int(fraction*anim_time), SizeChange(event, fraction))


def AddButton(row, col, name):
    tkframe = tk.Frame(root, width=buttonsize[0]+extrasize[0],
        height=buttonsize[1]+extrasize[1])
    tkframe.grid(row=row, column=col, padx=framepad[0], pady=framepad[1], sticky='nsew')
    tkbutton = tk.Button(tkframe, text=name, compound='c', image=pixel,
        width=buttonsize[0], height=buttonsize[1])
    tkbutton.grid(row=0, column=0, padx=extrasize[0], pady=extrasize[1])
    tkbutton.bind('<Enter>', Highlight)
    tkbutton.bind('<Leave>', Unhighlight)


for idx in range(4):
    AddButton(row=idx//2, col=idx%2, name='Button ' + str(idx))


root.mainloop()

Although it seems the smoothness of the animation is highly dependent on the extra size added to the button size and the time steps.

Answer 2

This is example which use after to move Frame with Label and Button . I used place() to use relative position so Frame leave window even if you change window size.

import tkinter as tk

# --- functions ---

def move(steps=10, distance=0.1):
    if steps > 0:
        # get current position
        relx = float(frame.place_info()['relx'])

        # set new position
        frame.place_configure(relx=relx+distance)

        # repeate it after 10ms
        root.after(10, move, steps-1, distance)

def on_click():
    print('on_click')
    # start move
    move(50, 0.02) # 50*0.02 = 1

# --- main --

root = tk.Tk()

frame = tk.Frame(root, background='red')
frame.place(relx=0, rely=0, relwidth=1, relheight=1)

# to center label and button
#frame.grid_columnconfigure(0, weight=1)
#frame.grid_rowconfigure(0, weight=1)
#frame.grid_rowconfigure(3, weight=1)

label = tk.Label(frame, text='Frame with Label and Button')
label.grid(row=1, column=0)

button = tk.Button(frame, text='MOVE', command=on_click)
button.grid(row=2, column=0)

root.mainloop()