028-86922220

建站动态

根据您的个性需求进行定制 先人一步 抢占小程序红利时代

如何用Flutter做桌上弹球-创新互联

这篇文章主要讲解了如何用Flutter做桌上弹球,内容清晰明了,对此有兴趣的小伙伴可以学习一下,相信大家阅读完之后会有帮助。

网站制作、建网站找专业网站制作公司创新互联建站:定制网站、模板网站、仿站、微信小程序开发、软件开发、重庆APP开发公司等。做网站价格咨询创新互联建站:服务完善、10年建站、值得信赖!网站制作电话:028-86922220

首先看一下我们要实现的效果:

如何用Flutter做桌上弹球

结合动图演示,列出最终目标如下:

运用的主要技术点:Canvas和CustomPaint API。

运行平台:Android、iOS

源码地址:
Github Gitee

功能拆解

首先拆解前文中所列出的6个实现目标,显而易见,要实现它们,我们需要:

  1. 随机颜色生成器;
  2. 随机位置生成器;
  3. 随机尺寸生成器;
  4. 小球绘制逻辑;
  5. 小球运动逻辑:

边界判定;
初始运动方向生成器;
定向移动位置更新器。

  1. 用户手势监听器。

功能实现

接下来,我们逐步实现功能拆解中所列举的6个具体功能。

随机颜色生成器

随机颜色生成器在程序启动、单击屏幕和自动变色中使用。在Flutter中,我们可以通过Color类对红、绿、蓝和透明度分别定义,来定义某个唯一的颜色,数值范围是0-255。对于透明度,0表示完全透明,255表示完全不透明。
对于随机数值,我们使用Random类生成0-255之间的随机整数。
随机颜色生成器则主要使用上述两个类来实现,具体代码片段如下:

Color _color = Color.fromARGB(0, 0, 0, 0);

// 改变小球颜色
void changeColor() {
	_color = Color.fromARGB(255, Random().nextInt(255), Random().nextInt(255),Random().nextInt(255));
}

网页标题:如何用Flutter做桌上弹球-创新互联
分享地址:http://www.tsicrk.com/article/dgppod.html

其他资讯

让你的专属顾问为你服务

2.3087s