如何为CustomTkinter中的promptReply标签添加淡入动画

要给聊天应用中的promptReply标签实现淡入效果，我们可以利用Tkinter的after()方法逐步调整标签的颜色透明度（RGBA格式）来实现，具体修改如下：

修改后的完整代码 #

import customtkinter
from customtkinter import *
import tkinter
from PIL import Image

customtkinter.set_appearance_mode("dark")
customtkinter.set_default_color_theme("blue.json")

root = tkinter.Tk()

root.title("🍕 PizzBot")
root.geometry("455x771")
root.resizable(False, False)
root.configure(background="#2C2C2C")
send = Image.open("send.png")
head = Image.open("ChatBot CanvaDesign.png")
pizzaIco = Image.open("pizza.png")
usr = Image.open("user.png")

framePrompt = customtkinter.CTkFrame(root)
framePrompt.pack(side=BOTTOM)
frameChat = customtkinter.CTkScrollableFrame(root, width=430,height=650)
frameChat.pack()

prompt_input = customtkinter.CTkEntry(framePrompt,height=55,width=375,border_width=0,placeholder_text="Type your prompt here",placeholder_text_color=("gray95", "grey"),font=("Poppins", 18),)
prompt_input.grid(column=0, row=0, padx=6, pady=8)

def fade_in(label, current_alpha=0.0):
    # 设置目标颜色的RGBA值，逐步提升透明度
    bg_color = f"rgba(255,255,255,{current_alpha})"
    text_color = f"rgba(63,82,255,{current_alpha})"
    label.configure(fg_color=bg_color, text_color=text_color)
    
    if current_alpha < 1.0:
        # 每次增加0.05的透明度，间隔30毫秒执行一次
        root.after(30, fade_in, label, current_alpha + 0.05)

def executeSend():
    customtkinter.CTkLabel(frameChat,text="\n").pack()

    label = customtkinter.CTkLabel(frameChat,text=prompt_input.get(),font=("Poppins", 20,"bold"),anchor="w",width=20,height=35,wraplength="300",justify="left",padx=20,pady=20,text_color="white",fg_color="#3f52ff",corner_radius=20)
    frameChat.configure(width=430,height=700)
    label.pack(anchor="e",padx=10)

    customtkinter.CTkLabel(frameChat,text="\n").pack()

    # 初始化标签时设置全透明的颜色
    promptReply = customtkinter.CTkLabel(frameChat,text="Bot Response Goes Here . Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi urna magna, ultrices sit amet auctor sit amet, facilisis in enim. Etiam leo nunc, vulputate vitae sem eu, vehicula laoreet purus. Nam vulputate et lacus vel iaculis. Pellentesque vel eros dui. Quisque consectetur sed felis sed lacinia.",
                                         fg_color="rgba(255,255,255,0)",
                                         text_color="rgba(63,82,255,0)",
                                         padx=20,pady=20,wraplength="300",justify="left",anchor="w",font=("Quicksand",18),corner_radius=10,)
    promptReply.pack(anchor="w",padx=10)
    
    # 启动淡入动画
    fade_in(promptReply)

    frameChat.configure(height=600)

    root.after(100,frameChat._parent_canvas.yview_moveto,1)

    customtkinter.CTkFrame(frameChat,fg_color="#2C2C2C",width=410,height=15).pack()
    customtkinter.CTkFrame(frameChat,fg_color="#3F52FF",width=10,height=5).pack()
    customtkinter.CTkLabel(frameChat,text="\n").pack()

btnSend = customtkinter.CTkButton(framePrompt,text="",corner_radius=10,image=CTkImage(light_image=send, dark_image=send),width=55,height=55,command=executeSend)
btnSend.grid(column=1, row=0)

prompt_input.bind("<Return>", lambda event: executeSend())

root.mainloop()

实现说明 #

• 定义fade_in函数：通过after()循环调用自身，每次提升标签背景色和文字色的透明度（alpha值），从0逐步增加到1。
• 初始化promptReply时，将fg_color和text_color设置为全透明的RGBA值，确保初始状态不可见。
• 在标签pack后调用fade_in(promptReply)启动动画，调整current_alpha + 0.05和after(30)的数值可以控制动画的速度和平滑度。

内容的提问来源于stack exchange，提问作者Astro_29