教程:从零开始,逐步实现动态心形动画
环境准备
在开始之前,请确保你已经安装了最新版本的Python。如果未安装,可以前往Python官网下载并安装适合你操作系统的版本。Tkinter随Python自带,无需额外安装。
第一步:导入必要的模块
import random
from math import sin, cos, pi, log
from tkinter import *
我们将使用random模块生成随机数,math模块中的sin、cos、pi和log函数用于计算心形曲线,tkinter则用于图形界面的创建和动画展示。
第二步:定义画布参数
CANVAS_WIDTH = 640 # 画布宽度
CANVAS_HEIGHT = 480 # 画布高度
CANVAS_CENTER_X = CANVAS_WIDTH / 2
CANVAS_CENTER_Y = CANVAS_HEIGHT / 2
IMAGE_ENLARGE = 11 # 图像放大比例
HEART_COLOR = "#ff2121" # 心形颜色
这里,我们设置了画布的基本参数,包括宽高、中心坐标、心形的放大比例以及颜色。
第三步:定义心形生成函数
def heart_function(t, shrink_ratio=IMAGE_ENLARGE):
x = 16 * (sin(t) ** 3)
y = -(13 * cos(t) - 5 * cos(2 * t) - 2 * cos(3 * t) - cos(4 * t))
x *= shrink_ratio
y *= shrink_ratio
x += CANVAS_CENTER_X
y += CANVAS_CENTER_Y
return int(x), int(y)
该函数基于心形的参数方程生成心形曲线的坐标点,通过缩放和平移,使其适应画布的大小。
主流AI大模型 + 上百种AI助手落地场景 + 兑换码ZXCODE = CodeMoss国内版
第四步:实现点的散布与收缩
def scatter_inside(x, y, beta=0.15):
ratio_x = - beta * log(random.random())
ratio_y = - beta * log(random.random())
dx = ratio_x * (x - CANVAS_CENTER_X)
dy = ratio_y * (y - CANVAS_CENTER_Y)
return x - dx, y - dy
def shrink(x, y, ratio):
force = -1 / (((x - CANVAS_CENTER_X) ** 2 + (y - CANVAS_CENTER_Y) ** 2) ** 0.6)
dx = ratio * force * (x - CANVAS_CENTER_X)
dy = ratio * force * (y - CANVAS_CENTER_Y)
return x - dx, y - dy
这两个函数分别用于在心形内部散布点和将点收缩到中心,增加动画的层次感和动感。
第五步:定义曲线函数
def curve(p):
return 2 * (2 * sin(4 * p)) / (2 * pi)
curve函数计算当前帧的缩放比例,为动画提供动态变化。
第六步:创建Heart类
class Heart:
def __init__(self, generate_frame=60):
self._points = set()
self._edge_diffusion_points = set()
self._center_diffusion_points = set()
self.all_points = {}
self.build(2000)
self.random_halo = 1000
self.generate_frame = generate_frame
for frame in range(generate_frame):
self.calc(frame)
def build(self, number):
for _ in range(number):
t = random.uniform(0, 2 * pi)
x, y = heart_function(t)
self._points.add((x, y))
for _x, _y in list(self._points):
for _ in range(3):
x, y = scatter_inside(_x, _y, 0.05)
self._edge_diffusion_points.add((x, y))
point_list = list(self._points)
for _ in range(4000):
x, y = random.choice(point_list)
x, y = scatter_inside(x, y, 0.17)
self._center_diffusion_points.add((x, y))
@staticmethod
def calc_position(x, y, ratio):
force = 1 / (((x - CANVAS_CENTER_X) ** 2 + (y - CANVAS_CENTER_Y) ** 2) ** 0.520)
dx = ratio * force * (x - CANVAS_CENTER_X) + random.randint(-1, 1)
dy = ratio * force * (y - CANVAS_CENTER_Y) + random.randint(-1, 1)
return x - dx, y - dy
def calc(self, generate_frame):
ratio = 10 * curve(generate_frame / 10 * pi)
halo_radius = int(4 + 6 * (1 + curve(generate_frame / 10 * pi)))
halo_number = int(3000 + 4000 * abs(curve(generate_frame / 10 * pi) ** 2))
all_points = []
heart_halo_point = set()
for _ in range(halo_number):
t = random.uniform(0, 2 * pi)
x, y = heart_function(t, shrink_ratio=11.6)
x, y = shrink(x, y, halo_radius)
if (x, y) not in heart_halo_point:
heart_halo_point.add((x, y))
x += random.randint(-14, 14)
y += random.randint(-14, 14)
size = random.choice((1, 2, 2))
all_points.append((x, y, size))
for x, y in self._points:
x, y = self.calc_position(x, y, ratio)
size = random.randint(1, 3)
all_points.append((x, y, size))
for x, y in self._edge_diffusion_points:
x, y = self.calc_position(x, y, ratio)
size = random.randint(1, 2)
all_points.append((x, y, size))
for x, y in self._center_diffusion_points:
x, y = self.calc_position(x, y, ratio)
size = random.randint(1, 2)
all_points.append((x, y, size))
self.all_points[generate_frame] = all_points
def render(self, render_canvas, render_frame):
points = self.all_points.get(render_frame % self.generate_frame, [])
for x, y, size in points:
render_canvas.create_rectangle(
x, y, x + size, y + size,
width=0,
fill=HEART_COLOR
)
Heart类负责生成和管理心形动画的各个帧。通过预计算每一帧的点数据,确保动画的流畅性和连贯性。
第七步:实现动画绘制
def draw(main: Tk, render_canvas: Canvas, render_heart: Heart, render_frame=0):
render_canvas.delete('all')
render_heart.render(render_canvas, render_frame)
main.after(30, draw, main, render_canvas, render_heart, render_frame + 1)
draw函数不断刷新画布,渲染当前帧的心形点,并通过递归调用实现动画的连续播放。
第八步:启动主程序
if __name__ == '__main__':
root = Tk()
root.title("丝滑心形动画")
canvas = Canvas(root, bg='white', height=CANVAS_HEIGHT, width=CANVAS_WIDTH)
canvas.pack()
heart = Heart(generate_frame=60)
draw(root, canvas, heart)
root.mainloop()
主程序部分创建Tkinter主窗口,初始化画布和Heart类实例,启动动画绘制循环。
运行效果展示
运行上述代码后,你将看到一个充满爱的动态心形在画布上缓缓跳动,颜色鲜艳,动画流畅。以下是预期的运行效果截图:
(请自行运行代码查看实际效果)
完整心形代码
import random # 导入随机数模块,用于生成随机数
from math import sin, cos, pi, log # 从math模块导入sin, cos, pi, log函数
from tkinter import * # 从tkinter模块导入所有内容,用于GUI绘制
# 定义画布的宽度和高度
CANVAS_WIDTH = 640 # 画布的宽度为640像素
CANVAS_HEIGHT = 480 # 画布的高度为480像素
# 计算画布中心的X和Y坐标
CANVAS_CENTER_X = CANVAS_WIDTH / 2 # 画布中心的X坐标
CANVAS_CENTER_Y = CANVAS_HEIGHT / 2 # 画布中心的Y坐标
IMAGE_ENLARGE = 11 # 图像放大比例设为11倍
HEART_COLOR = "#ff2121" # 心形的颜色设置为红色
def heart_function(t, shrink_ratio: float = IMAGE_ENLARGE):
"""
生成爱心形状的坐标点
:param t: 参数,范围通常为0到2π
:param shrink_ratio: 放大比例,默认为IMAGE_ENLARGE
:return: 坐标 (x, y) 的整数值
"""
# 爱心的参数方程计算X坐标
x = 16 * (sin(t) ** 3)
# 爱心的参数方程计算Y坐标
y = -(13 * cos(t) - 5 * cos(2 * t) - 2 * cos(3 * t) - cos(4 * t))
# 将计算得到的X和Y坐标放大
x *= shrink_ratio # 放大X坐标
y *= shrink_ratio # 放大Y坐标
# 将心形移动到画布的中心位置
x += CANVAS_CENTER_X # 平移X坐标到画布中心
y += CANVAS_CENTER_Y # 平移Y坐标到画布中心
return int(x), int(y) # 返回整数型的坐标
def scatter_inside(x, y, beta=0.15):
"""
在爱心内部散布点
:param x: 原点的X坐标
:param y: 原点的Y坐标
:param beta: 散布强度,默认为0.15
:return: 新的坐标 (x, y)
"""
# 计算随机散布比例X
ratio_x = - beta * log(random.random()) # 使用对数函数和随机数生成比例
# 计算随机散布比例Y
ratio_y = - beta * log(random.random())
# 计算X方向的偏移量
dx = ratio_x * (x - CANVAS_CENTER_X) # 根据中心点计算偏移
# 计算Y方向的偏移量
dy = ratio_y * (y - CANVAS_CENTER_Y)
return x - dx, y - dy # 返回新的坐标
def shrink(x, y, ratio):
"""
收缩点到中心
:param x: 原点的X坐标
:param y: 原点的Y坐标
:param ratio: 收缩比例
:return: 新的坐标 (x, y)
"""
# 计算收缩力,避免除以零的情况
force = -1 / (((x - CANVAS_CENTER_X) ** 2 + (y - CANVAS_CENTER_Y) ** 2) ** 0.6)
# 计算X方向的偏移量,加上收缩比例和力的影响
dx = ratio * force * (x - CANVAS_CENTER_X)
# 计算Y方向的偏移量,加上收缩比例和力的影响
dy = ratio * force * (y - CANVAS_CENTER_Y)
return x - dx, y - dy # 返回新的坐标
def curve(p):
"""
生成曲线函数值
:param p: 参数,用于计算曲线
:return: 曲线的当前值
"""
return 2 * (2 * sin(4 * p)) / (2 * pi) # 计算并返回曲线值
class Heart:
"""
心形动画类,负责生成和渲染心形动画的各个帧
"""
def __init__(self, generate_frame=60):
"""
初始化心形动画
:param generate_frame: 生成的帧数,默认为60帧
"""
self._points = set() # 存储心形轮廓的点集合
self._edge_diffusion_points = set() # 存储边缘扩散点的集合
self._center_diffusion_points = set() # 存储中心扩散点的集合
self.all_points = {} # 存储所有帧的点数据,键为帧数,值为点列表
self.build(2000) # 构建初始的2000个心形点和扩散点
self.random_halo = 1000 # 光晕随机点的数量设为1000
self.generate_frame = generate_frame # 设置总帧数
for frame in range(generate_frame): # 遍历每一帧
self.calc(frame) # 预计算每一帧的点数据
def build(self, number):
"""
构建心形及其扩散点
:param number: 初始点的数量
"""
# 生成心形轮廓点
for _ in range(number): # 循环生成指定数量的点
t = random.uniform(0, 2 * pi) # 随机生成参数t,在0到2π之间
x, y = heart_function(t) # 计算心形的坐标
self._points.add((x, y)) # 将计算得到的点添加到轮廓点集合
# 生成心形边缘的扩散点
for _x, _y in list(self._points): # 遍历所有轮廓点
for _ in range(3): # 每个轮廓点生成3个扩散点
x, y = scatter_inside(_x, _y, 0.05) # 计算扩散后的新坐标
self._edge_diffusion_points.add((x, y)) # 添加到边缘扩散点集合
# 生成心形中心的扩散点
point_list = list(self._points) # 将轮廓点转换为列表
for _ in range(4000): # 生成4000个中心扩散点
x, y = random.choice(point_list) # 随机选择一个轮廓点
x, y = scatter_inside(x, y, 0.17) # 计算扩散后的新坐标
self._center_diffusion_points.add((x, y)) # 添加到中心扩散点集合
@staticmethod
def calc_position(x, y, ratio):
"""
计算点的位置,用于动画效果
:param x: 原点的X坐标
:param y: 原点的Y坐标
:param ratio: 缩放比例
:return: 新的坐标 (x, y)
"""
# 计算缩放的力,避免除以零
force = 1 / (((x - CANVAS_CENTER_X) ** 2 + (y - CANVAS_CENTER_Y) ** 2) ** 0.520)
# 计算X方向的偏移量,加入微小的随机抖动
dx = ratio * force * (x - CANVAS_CENTER_X) + random.randint(-1, 1)
# 计算Y方向的偏移量,加入微小的随机抖动
dy = ratio * force * (y - CANVAS_CENTER_Y) + random.randint(-1, 1)
return x - dx, y - dy # 返回新的坐标
def calc(self, generate_frame):
"""
计算每一帧的所有点
:param generate_frame: 当前帧数
"""
# 根据曲线函数计算当前帧的缩放比例
ratio = 10 * curve(generate_frame / 10 * pi) # 计算缩放比例
# 计算光环的半径和点数
halo_radius = int(4 + 6 * (1 + curve(generate_frame / 10 * pi))) # 计算光环半径
halo_number = int(3000 + 4000 * abs(curve(generate_frame / 10 * pi) ** 2)) # 计算光环点的数量
all_points = [] # 初始化当前帧的所有点列表
# 生成光环点
heart_halo_point = set() # 存储光环点的集合,避免重复
for _ in range(halo_number): # 循环生成光环点
t = random.uniform(0, 2 * pi) # 随机生成参数t
x, y = heart_function(t, shrink_ratio=11.6) # 计算心形的坐标,放大比例为11.6
x, y = shrink(x, y, halo_radius) # 收缩坐标到光环半径
if (x, y) not in heart_halo_point: # 检查点是否已经存在
heart_halo_point.add((x, y)) # 添加新的光环点
x += random.randint(-14, 14) # 随机偏移X坐标
y += random.randint(-14, 14) # 随机偏移Y坐标
size = random.choice((1, 2, 2)) # 随机选择点的大小
all_points.append((x, y, size)) # 将点添加到当前帧的点列表
# 生成轮廓点
for x, y in self._points: # 遍历所有轮廓点
x, y = self.calc_position(x, y, ratio) # 计算动画后的新坐标
size = random.randint(1, 3) # 随机选择点的大小
all_points.append((x, y, size)) # 将点添加到当前帧的点列表
# 生成边缘扩散点
for x, y in self._edge_diffusion_points: # 遍历所有边缘扩散点
x, y = self.calc_position(x, y, ratio) # 计算动画后的新坐标
size = random.randint(1, 2) # 随机选择点的大小
all_points.append((x, y, size)) # 将点添加到当前帧的点列表
# 生成中心扩散点
for x, y in self._center_diffusion_points: # 遍历所有中心扩散点
x, y = self.calc_position(x, y, ratio) # 计算动画后的新坐标
size = random.randint(1, 2) # 随机选择点的大小
all_points.append((x, y, size)) # 将点添加到当前帧的点列表
# 将当前帧的所有点存储到all_points字典中
self.all_points[generate_frame] = all_points # 存储当前帧的点数据
def render(self, render_canvas, render_frame):
"""
渲染当前帧的所有点到画布
:param render_canvas: Tkinter的Canvas对象
:param render_frame: 当前渲染的帧数
"""
# 获取当前帧的点数据,使用模运算来循环帧数
points = self.all_points.get(render_frame % self.generate_frame, []) # 获取点列表
# 遍历所有点并绘制到画布
for x, y, size in points: # 遍历每个点
render_canvas.create_rectangle(
x, y, x + size, y + size, # 定义矩形的四个角坐标
width=0, # 矩形边框宽度设为0
fill=HEART_COLOR # 填充颜色为心形颜色
) # 在画布上绘制一个矩形代表一个点
def draw(main: Tk, render_canvas: Canvas, render_heart: Heart, render_frame=0):
"""
动画绘制函数
:param main: Tkinter的主窗口
:param render_canvas: Tkinter的Canvas对象
:param render_heart: Heart类的实例
:param render_frame: 当前帧数,默认为0
"""
render_canvas.delete('all') # 清除画布上的所有内容
render_heart.render(render_canvas, render_frame) # 渲染当前帧的心形点
# 设置延迟后再次调用draw函数,实现动画循环,这里设置为30毫秒,约33帧/秒
main.after(30, draw, main, render_canvas, render_heart, render_frame + 1) # 递归调用draw函数
if __name__ == '__main__':
root = Tk() # 创建Tkinter主窗口
root.title("丝滑心形动画") # 设置窗口标题为“丝滑心形动画”
# 创建Canvas画布,设置背景颜色为黑色,指定高度和宽度
canvas = Canvas(root, bg='white', height=CANVAS_HEIGHT, width=CANVAS_WIDTH) # 创建画布对象, bg='white'画布颜色
canvas.pack() # 将画布添加到主窗口中进行显示
heart = Heart(generate_frame=60) # 创建Heart类的实例,预生成60帧的动画数据
draw(root, canvas, heart) # 启动动画绘制函数
root.mainloop() # 进入Tkinter的主事件循环,开始运行GUI
更多文献
【ChatGPT】CodeMoss & ChatGPT中文版-国内专属的大模型聚合AI工具
【VScode】揭秘编程利器:教你如何用“万能@符”提升你的编程效率! 全面解析ChatMoss & ChatGPT中文版
【VScode】VSCode中的智能编程利器,全面揭秘ChatMoss & ChatGPT中文版
结语
通过本教程,你已经掌握了使用Python Tkinter制作动态心形动画的全流程。从数学函数的应用到GUI绘制,再到动画效果的实现,每一步都充满了技术的魅力。希望你能在此基础上,发挥创意,制作出更多令人惊艳的动画作品。不妨将这份爱与创意,分享给身边的朋友,让更多人感受到编程的乐趣与温暖❤️。
如果你在学习过程中遇到任何问题,欢迎在评论区留言讨论。让我们一起交流、成长,共同探索编程的无限可能!
💬 立即动手,开启你的编程创意之旅吧!