基于Android|基于Android Flutter编写贪吃蛇游戏
目录
- 前言
- 开发步骤:
- 1.定义蛇和豆子
- 2.让蛇动起来
- 3.使用陀螺仪来控制蛇
- 4.让蛇吃掉豆子
- 5.吃掉豆子随机生成一个豆子
前言 放假期间,小T打算回顾一下经典,想用Flutter做一下小游戏,做什么好呢,从打飞机到坦克大战,最后还是想做一款贪吃蛇,依稀还记得,小时候第一次玩游戏是在父母的小灵通上玩贪吃蛇哈哈,但是光光一个贪吃蛇太单调了,我们就加一个陀螺仪吧~
话不多说,先上效果图,有图有真相!!(陀螺仪好难操控)!
文章图片
开发步骤: 非常简单,就是玩起来有点费手~
github仓库还没有搭建,大家可以先看一下文末通知!
1.定义蛇和豆子
2.让蛇动起来
3.使用陀螺仪来控制蛇
4.让蛇吃掉豆子
5.吃掉豆子随机生成一个豆子
1.定义蛇和豆子
///蛇的每一块的大小const double size = 10; Offset ball = Offset.zero; //豆子ListsnakeList = [Offset(50, 0), Offset(60, 0)]; //蛇的长度
显示豆子和蛇:
使用Stack是因为豆子在被蛇吃的时候会重叠
使用Positioned来进行定位
body: Stack(children: snakeList.map((snake) => Positioned.fromRect(rect: Rect.fromCenter(center: adjust(snake), width: size, height: size),child: Container(margin:const EdgeInsets.all(1),color: Colors.black)))//加个外边距使每一块更清晰.toList()..add(Positioned.fromRect(rect: Rect.fromCenter(center: adjust(ball), width: size, height: size),child: Container(color: Colors.orange))),)
Offset adjust(Offset offset) {return Offset(offset.dx + size / 2, offset.dy + size / 2); //使每一块更好的展示出来}
2.让蛇动起来
在这里我们要先给蛇来一个状态定义:
///控制蛇的状态enum Direction { Up, Down, Left, Right }
因为蛇要一直动,所以给一个周期函数:
1.定义200毫秒动一次
2.处理更新蛇的长度
3.求余的好处在于优化吃豆子,因为随机生成豆子时,可能是个不会被整除的。
Direction direction = Direction.Left; //给蛇设置一个状态,默认向左移动///周期函数void didChangeDependencies() {///两百毫秒的周期函数var period = Duration(milliseconds: 200); ///对蛇的长度进行优化double maxWidth = MediaQuery.of(context).size.width; double widthPad = maxWidth % size; maxWidth -= widthPad; double maxHeight = MediaQuery.of(context).size.height; double heigthPad = maxHeight % size; //这里除于是为了更好的游戏体验maxHeight -= heigthPad; ///周期调用///用于贪吃蛇的自己移动,以及碰撞检测Timer.periodic(period, (timer) {final snakeHead = snakeList[0]; ListnewSnakeList = List.generate(snakeList.length, (index) {if (index > 0) {return snakeList[index - 1]; } else {///移动处理switch (direction) {case Direction.Up:return Offset(snakeHead.dx,(snakeHead.dy - size + maxHeight) % maxHeight); //求余是保证不会超标case Direction.Down:return Offset(snakeHead.dx, (snakeHead.dy + size + maxHeight) % maxHeight); case Direction.Left:return Offset((snakeHead.dx - size + maxWidth) % maxWidth, snakeHead.dy); case Direction.Right:return Offset((snakeHead.dx + size + maxWidth) % maxWidth, snakeHead.dy); }}}); setState(() {snakeList = newSnakeList; //更新蛇的状态}); }); super.didChangeDependencies(); }
3.使用陀螺仪来控制蛇
Flutter使用陀螺仪需要借助一个库:sensors 或者sensors_plus,两者没有太大的区别
这个demo使用:
sensors: any
官方给的例子:
import 'package:sensors/sensors.dart'; ?accelerometerEvents.listen((AccelerometerEvent event) {print(event); }); // [AccelerometerEvent (x: 0.0, y: 9.8, z: 0.0)] 加速度?userAccelerometerEvents.listen((UserAccelerometerEvent event) {print(event); }); // [UserAccelerometerEvent (x: 0.0, y: 0.0, z: 0.0)]?gyroscopeEvents.listen((GyroscopeEvent event) {print(event); }); // [GyroscopeEvent (x: 0.0, y: 0.0, z: 0.0)] 陀螺仪
我们在initState对陀螺仪进行监听:
这里有x,y,z的三个参数,也可以自己优化调试,5.0是当手机倾斜>=45°
@overridevoid initState() {super.initState(); accelerometerEvents.listen((AccelerometerEvent event) {setState(() {_accelerometerValues =[event.x, event.y, event.z]; if(_accelerometerValues[0] >= 5.0){ direction = Direction.Left; }else if(_accelerometerValues[1] >= 5.0){direction = Direction.Down; }else if(_accelerometerValues[0] <= -5.0){direction = Direction.Right; }else if(_accelerometerValues[1] <= -5.0){direction = Direction.Up; }}); }); }
4.让蛇吃掉豆子
还是在刚刚的周期函数里添加:
当蛇头碰到豆子时,给蛇加一格
if(newSnakeList[0] == ball){newSnakeList..add(snakeList[snakeList.length - 1]); setState(() {ball = randoowPositon(maxWidth, maxHeight); //随机生成一个豆子,randoowPositon方法在后面}); }
5.吃掉豆子随机生成一个豆子
对豆子的生成也需要优化一下 (之前生成有点问题,现在优化一下)
Offset randoowPositon(double widthRange, double heightRange) {///随机生成豆子var rng = Random(); int intWidthRange = widthRange.toInt(); int intHeightRange = heightRange.toInt(); int finalWdith = rng.nextInt(intWidthRange); int finalHeight = rng.nextInt(intHeightRange); double widthPad = finalWdith % size; double heightPad = finalHeight % size; double actualWidth = finalWdith - widthPad; double actualHeight = finalHeight - heightPad; return Offset(rng.nextInt(widthRange.toInt()).toDouble(),rng.nextInt(heightRange.toInt()).toDouble()); }
【基于Android|基于Android Flutter编写贪吃蛇游戏】到此这篇关于基于Android Flutter编写贪吃蛇游戏的文章就介绍到这了,更多相关Flutter贪吃蛇内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
推荐阅读
- Android之Spinner用法详解
- 图像识别|火焰识别系统(python实现基于颜色多帧差分)
- 基于Python编写一个语音合成系统
- Android开发|移动端系统生物认证技术详解
- 基于python的数据爬取与分析_基于Python的网站数据爬取与分析的技术实现策略
- ECCV|ECCV 2018最佳论文解读(基于解剖结构的面部表情生成)
- MATLAB|基于matlab车牌识别算法
- Android基础知识梳理-四大组件之Content Provider
- vue中基于sortablejs与el-upload实现文件上传后拖拽排序
- mac 下 pecl 的 扩展配置 ( 基于php@7.4 )