文章目录
- 教程:从零开始,逐步实现动态心形动画
- 环境准备
- 第一步:导入必要的模块
- 第二步:定义画布参数
- 第三步:定义心形生成函数
- 第四步:实现点的散布与收缩
- 第五步:定义曲线函数
- 第六步:创建Heart类
- 第七步:实现动画绘制
- 第八步:启动主程序
- 运行效果展示
- 完整心形代码
- 更多文献
- 结语
教程:从零开始,逐步实现动态心形动画
环境准备
在开始之前,请确保你已经安装了最新版本的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_ratioy *= shrink_ratiox += CANVAS_CENTER_Xy += CANVAS_CENTER_Yreturn 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 - dydef 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 = 1000self.generate_frame = generate_framefor 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))@staticmethoddef 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 - dydef 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_pointsdef 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)"""# 计算随机散布比例Xratio_x = - beta * log(random.random()) # 使用对数函数和随机数生成比例# 计算随机散布比例Yratio_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 # 光晕随机点的数量设为1000self.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)) # 添加到中心扩散点集合@staticmethoddef 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) # 随机生成参数tx, y = heart_function(t, shrink_ratio=11.6) # 计算心形的坐标,放大比例为11.6x, 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, # 矩形边框宽度设为0fill=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绘制,再到动画效果的实现,每一步都充满了技术的魅力。希望你能在此基础上,发挥创意,制作出更多令人惊艳的动画作品。不妨将这份爱与创意,分享给身边的朋友,让更多人感受到编程的乐趣与温暖❤️。
如果你在学习过程中遇到任何问题,欢迎在评论区留言讨论。让我们一起交流、成长,共同探索编程的无限可能!
💬 立即动手,开启你的编程创意之旅吧!