别再复制粘贴了!用MaixPy在MaixCAM上画个会动的‘Hello World’(附完整代码)

张开发
2026/4/13 23:58:28 15 分钟阅读

分享文章

别再复制粘贴了!用MaixPy在MaixCAM上画个会动的‘Hello World’(附完整代码)
用MaixPy在MaixCAM上创造动态艺术从会跳舞的文字到交互式动画刚拿到MaixCAM开发板时很多人会陷入先学理论还是先动手的困境。其实最好的学习方式就是直接创造有趣的东西——比如让Hello World在屏幕上跳起机械舞。这不仅能立即获得视觉反馈还能在玩耍中掌握图像处理的核心概念。1. 准备工作搭建你的数字画布在开始动画创作前我们需要初始化基础环境。MaixPy作为专为嵌入式AI设计的Python实现其图像模块已经高度优化即使是动态渲染也能保持流畅性能。from maix import image, display, app, time # 初始化320x240的RGB画布 canvas image.Image(320, 240, image.Format.FMT_RGB888) screen display.Display()关键参数解析320, 240适配大多数嵌入式屏幕的标准分辨率FMT_RGB888每个像素用3字节表示(红绿蓝各8位)display负责将图像缓冲区内容输出到物理屏幕实际开发中建议先测试display.Display().width()获取屏幕真实分辨率确保全屏显示效果2. 文字动画基础让Hello World动起来静态文字显示只是开始我们要实现文字的水平移动效果。这需要理解三个核心概念帧缓冲、双缓冲技术和动态擦除。# 定义动画参数 text Hello MaixPy x_pos 0 direction 1 # 1表示向右-1表示向左 speed 2 text_color image.Color.from_rgb(255, 255, 0) # 黄色文字 bg_color image.Color.from_rgb(0, 0, 0) # 黑色背景 while not app.need_exit(): # 清屏 canvas.draw_rect(0, 0, 320, 240, bg_color, thickness-1) # 绘制文字 canvas.draw_string(x_pos, 100, text, text_color, scale2) # 更新位置 x_pos speed * direction if x_pos 250 or x_pos 0: direction * -1 # 碰到边界就反向 # 刷新显示 screen.show(canvas) time.sleep_ms(16) # 约60FPS动画原理拆解每帧先绘制黑色背景覆盖前一帧内容在新位置重绘文本通过sleep_ms(16)控制帧率边界检测实现往复运动3. 进阶效果彩虹渐变与旋转文字单一运动太枯燥让我们给文字加上颜色渐变和旋转效果。这里需要引入HSV色彩空间和仿射变换的知识。3.1 彩虹色渐变实现def hsv_to_rgb(h, s1.0, v1.0): 将HSV颜色转换为RGB h h % 360 c v * s x c * (1 - abs((h / 60) % 2 - 1)) m v - c if 0 h 60: r, g, b c, x, 0 elif 60 h 120: r, g, b x, c, 0 # ... 其他区间类似处理 return (int((rm)*255), int((gm)*255), int((bm)*255))3.2 文字旋转动画结合仿射变换实现旋转效果angle 0 while not app.need_exit(): canvas.clear() # 创建文字临时图像 text_img image.Image(150, 40) text_img.draw_string(0, 0, text, hsv_to_rgb(angle), scale2) # 计算旋转中心 center_x 160 - text_img.width()//2 center_y 120 - text_img.height()//2 # 应用旋转变换 rotated text_img.rotate(angle, center(75, 20)) canvas.draw_image(center_x, center_y, rotated) # 更新角度 angle (angle 2) % 360 screen.show(canvas) time.sleep_ms(16)性能优化技巧预先生成文字图像再旋转比直接旋转画布更高效控制旋转中心点确保文字围绕自身中心旋转角度增量控制在2-5度之间保证动画流畅性4. 交互式动画用传感器控制你的创作MaixCAM的强大之处在于可以结合各种传感器创造交互体验。下面示例展示如何用加速度计控制文字运动。from maix import mpu6050 accel mpu6050.MPU6050() text_x, text_y 160, 120 while not app.need_exit(): x_accel, y_accel, _ accel.get_acceleration() # 根据加速度更新位置 text_x max(20, min(300, text_x int(x_accel * 5))) text_y max(20, min(220, text_y int(y_accel * 5))) canvas.clear() canvas.draw_string(text_x, text_y, text, image.Color.from_rgb(0, 255, 255), scale2) # 添加运动轨迹效果 for i in range(1, 10): alpha 255 - i*25 canvas.draw_string(text_x-i*2, text_y-i, text, image.Color.from_rgba(0, 255, 255, alpha), scale2) screen.show(canvas) time.sleep_ms(50)交互设计要点get_acceleration()返回xyz三轴加速度值通过系数控制灵敏度示例中的*5添加残影效果增强视觉反馈边界检查防止文字移出屏幕5. 综合案例粒子系统文字动画将文字分解为粒子每个粒子独立运动最终组合成完整文字。这种效果需要更复杂的数学运算但视觉效果非常惊艳。import random import math # 粒子类定义 class Particle: def __init__(self, x, y, char): self.origin_x x self.origin_y y self.char char self.reset() def reset(self): self.x random.randint(-100, 420) self.y random.randint(-100, 340) self.vx (self.origin_x - self.x) / 30 self.vy (self.origin_y - self.y) / 30 def update(self): self.x self.vx self.y self.vy # 添加随机扰动 self.x random.uniform(-0.5, 0.5) self.y random.uniform(-0.5, 0.5) # 初始化粒子系统 text MAIXPY particles [] x_offset 80 for i, char in enumerate(text): for _ in range(10): # 每个字符10个粒子 particles.append(Particle( x_offset i*40 random.randint(-5,5), 120 random.randint(-5,5), char )) # 动画主循环 while not app.need_exit(): canvas.clear() all_home True for p in particles: p.update() dist math.sqrt((p.x-p.origin_x)**2 (p.y-p.origin_y)**2) if dist 2: all_home False # 根据距离调整颜色 hue min(120, dist * 3) color image.Color.from_hsv(hue, 1, 1) canvas.draw_string(int(p.x), int(p.y), p.char, color, scale1) # 所有粒子归位后重新分散 if all_home: for p in particles: if random.random() 0.02: # 2%概率触发 p.reset() screen.show(canvas) time.sleep_ms(30)粒子系统设计要点每个粒子记录原始位置和当前位置速度向量指向原始位置实现归位效果添加随机扰动增强自然感距离影响颜色产生热力图效果概率触发机制保持动画持续变化从简单的文字移动到复杂的粒子系统MaixPy让嵌入式图形编程变得生动有趣。这些技术不仅可以用于文字动画稍加修改就能创造游戏角色、UI元素或者数据可视化效果。关键在于保持实验精神——调整参数、组合效果你的下一个创意可能就会成为惊艳的交互艺术作品。

更多文章