Flutter贪吃蛇游戏插件 flutter_snake 的使用

flutter_snake 是一个可以在你的Flutter应用中实现贪吃蛇游戏的插件。下面将详细介绍如何使用该插件。

插件效果展示

以下是插件的一些截图和动画演示：

蛇在游戏中的动态	大蛇	小蛇

开始使用

添加依赖

在你的Flutter项目的 pubspec.yaml 文件中添加以下依赖：

dependencies:
  ...
  flutter_snake: any

导入库

在你的Dart文件中导入该库：

import 'package:flutter_snake/flutter_snake.dart';

使用方法

初始化 SnakeGame

首先，定义并初始化 SnakeGame 对象：

SnakeGame? snakeGame;

[@override](/user/override)
void initState() {
  super.initState();

  // 示例配置：
  snakeGame = SnakeGame(
    caseWidth: 25.0, // 每个方块的宽度/高度（正方形）
    numberCaseHorizontally: 11, // 水平方向上的方块数量
    numberCaseVertically: 11, // 垂直方向上的方块数量
    durationBetweenTicks: Duration(milliseconds: 400), // 每次移动的时间间隔
    colorBackground1: Color(0XFF7CFC00), // 背景颜色1
    colorBackground2: Color(0XFF32CD32), // 背景颜色2
  );
}

在页面中加入 snakeGame

然后，在你的页面中加入 snakeGame：

[@override](/user/override)
Widget build(BuildContext context) {
  return SafeArea(
    child: Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: snakeGame ?? Text("Not initialized"),
    ),
  );
}

注意：此时蛇会开始移动，但由于我们还没有处理它的转向逻辑，所以它会撞到墙上。

控制蛇的方向

你可以通过按钮来控制蛇的移动方向：

Row(
  mainAxisAlignment: MainAxisAlignment.center,
  children: [
    IconButton(
      onPressed: () => snakeGame?.nextDirection = SNAKE_MOVE.left, // 设置蛇的下一个方向为左
      icon: Icon(Icons.subdirectory_arrow_left),
    ),
    Text("SNAKE"),
    IconButton(
      onPressed: () => snakeGame?.nextDirection = SNAKE_MOVE.right, // 设置蛇的下一个方向为右
      icon: Icon(Icons.subdirectory_arrow_right),
    ),
  ],
)

监听游戏事件

你还可以为 snakeGame 添加一个控制器来监听游戏事件（如胜利、失败、吃到食物等）：

StreamController<GAME_EVENT>? controller;
SnakeGame? snakeGame;

[@override](/user/override)
void initState() {
  super.initState();
  controller = StreamController<GAME_EVENT>();
  controller?.stream.listen((GAME_EVENT value) {
    print(value.toString());
  });

  snakeGame = SnakeGame(
    caseWidth: 25.0,
    numberCaseHorizontally: 11,
    numberCaseVertically: 11,
    controllerEvent: controller,
    durationBetweenTicks: Duration(milliseconds: 400),
    colorBackground1: Color(0XFF7CFC00),
    colorBackground2: Color(0XFF32CD32),
  );
}

[@override](/user/override)
void dispose() {
  controller?.close();
  super.dispose();
}

自定义设置

你可以根据需要自定义 SnakeGame 的各种参数，例如：

/// 方块的宽度/高度（正方形）
double caseWidth;

/// 每次移动之间的时间间隔
final Duration durationBetweenTicks;

/// 水平方向上的方块数量 (x)
final int numberCaseHorizontally;

/// 垂直方向上的方块数量 (y)
final int numberCaseVertically;

/// 如果定义了，则控制器流会接收游戏事件
final StreamController<GAME_EVENT>? controllerEvent;

/// 背景颜色变化
final Color colorBackground1;
final Color colorBackground2;

/// 蛇的身体部分和水果的图片路径
final String? snakeHeadImgPath;
final String? snakeBodyImgPath;
final String? snakeBodyTurnImgPath;
final String? snakeTailImgPath;
final String? snakeFruitImgPath;

完整示例代码

以下是一个完整的示例代码，展示了如何在Flutter项目中集成 flutter_snake 插件：

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter_snake/flutter_snake.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'FLUTTER_SNAKE',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'FLUTTER_SNAKE'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  final String title;

  MyHomePage({Key? key, required this.title}) : super(key: key);

  [@override](/user/override)
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  StreamController<GAME_EVENT>? controller;
  SnakeGame? snakeGame;

  [@override](/user/override)
  void initState() {
    super.initState();
    controller = StreamController<GAME_EVENT>();
    controller?.stream.listen((GAME_EVENT value) {
      print(value.toString());
    });

    snakeGame = SnakeGame(
      caseWidth: 25.0,
      numberCaseHorizontally: 11,
      numberCaseVertically: 11,
      controllerEvent: controller,
      durationBetweenTicks: Duration(milliseconds: 400),
      colorBackground1: Color(0XFF7CFC00),
      colorBackground2: Color(0XFF32CD32),
    );
  }

  [@override](/user/override)
  void dispose() {
    controller?.close();
    super.dispose();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        appBar: AppBar(
          title: Text(widget.title),
        ),
        body: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                IconButton(
                  onPressed: () => snakeGame?.nextDirection = SNAKE_MOVE.left,
                  icon: Icon(Icons.subdirectory_arrow_left),
                ),
                Text("SNAKE"),
                IconButton(
                  onPressed: () => snakeGame?.nextDirection = SNAKE_MOVE.right,
                  icon: Icon(Icons.subdirectory_arrow_right),
                ),
              ],
            ),
            snakeGame ?? Text("Not initialized"),
          ],
        ),
      ),
    );
  }
}