Flutter国际象棋棋盘插件advanced_chess_board的使用

advanced_chess_board 是一个使用纯 Flutter 组件开发的国际象棋棋盘，不依赖于棋盘图像。因此，您可以根据需要自定义棋盘颜色。它使用 ChessBoardController 来控制棋盘状态。

特性

• 可以通过自定义 FEN 加载棋盘。
• 可以控制棋盘的方向。
• 可以启用或禁用棋盘上的移动。
• 可以通过点击/触摸或拖动来移动棋子。
• 点击/触摸或拖动时会高亮显示有效移动。
• 可以在棋盘上绘制箭头。
• 可以通过控制器编程方式执行移动。
• 可以获取移动历史、当前玩家、是否将死、撤销移动等信息。
• 可以使用控制器添加监听器。
• 控制器还暴露了游戏对象以便进一步控制棋盘。

开始使用

1. 在您的 pubspec.yaml 文件中添加此包（advanced_chess_board）的依赖项。
2. 添加一个 AdvancedChessBoard 小部件，并为其提供一个 ChessBoardController 对象。
3. （可选）如果您想提供自定义颜色，可以提供相应的 darkSquareColor 和 lightSquareColor 参数。
4. （可选）默认情况下，棋盘方向为白色。您可以选择提供 boardOrientation 参数，使其为黑色或白色。

使用示例

以下是一个基本示例，仅包含最少的参数。更多详细信息请参阅 example/main.dart。

[@override](/user/override)
Widget build(BuildContext context) {
  return MaterialApp(
    title: 'Chess Board Example',
    debugShowCheckedModeBanner: false,
    theme: ThemeData(
      primarySwatch: Colors.blue,
    ),
    darkTheme: ThemeData(brightness: Brightness.dark, useMaterial3: true),
    themeMode: ThemeMode.dark,
    home: Scaffold(
      appBar: AppBar(title: const Text('Chess Board Example')),
      body: Center(
        child: AdvancedChessBoard(
          controller: controller,
        ),
      ),
    ),
  );
}

示例代码

import 'package:advanced_chess_board/advanced_chess_board.dart';
import 'package:advanced_chess_board/chess_board_controller.dart';
import 'package:advanced_chess_board/models/chess_arrow.dart';
import 'package:advanced_chess_board/models/enums.dart';
import 'package:flutter/material.dart';

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

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  [@override](/user/override)
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final controller = ChessBoardController();
  var boardOrientation = PlayerColor.white;

  [@override](/user/override)
  void initState() {
    super.initState();
    controller.addListener(() {
      setState(() {});
      debugPrint("Player to move: ${controller.playerColor}");
    });
  }

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Chess Board Example',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      darkTheme: ThemeData(brightness: Brightness.dark, useMaterial3: true),
      themeMode: ThemeMode.dark,
      home: Scaffold(
        appBar: AppBar(title: const Text('Chess Board Example')),
        body: Column(
          children: [
            Expanded(
              child: Center(
                child: Padding(
                  padding: const EdgeInsets.all(18.0),
                  child: AdvancedChessBoard(
                    controller: controller,
                    boardOrientation: boardOrientation,
                    arrows: [
                      ChessArrow(
                        startSquare: "e2",
                        endSquare: "e4",
                      ),
                      ChessArrow(
                        startSquare: "e7",
                        endSquare: "e5",
                      ),
                      ChessArrow(
                        startSquare: "g1",
                        endSquare: "f3",
                        color: Colors.red.withAlpha(128),
                      ),
                    ],
                  ),
                ),
              ),
            ),
            Padding(
              padding: const EdgeInsets.all(15.0),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceAround,
                children: [
                  ElevatedButton(
                    onPressed: () => setState(() {
                      boardOrientation = boardOrientation == PlayerColor.white
                          ? PlayerColor.black
                          : PlayerColor.white;
                    }),
                    child: const Text("翻转"),
                  ),
                  ElevatedButton(
                    onPressed: () => controller.undo(),
                    child: const Text("撤销"),
                  ),
                  ElevatedButton(
                    onPressed: () => controller.loadGameFromFEN(
                        "4k3/p2pNpp1/p2P4/4P2R/5P2/2P3P1/r1PKN1q1/4R3 w - - 0 1"),
                    child: const Text("加载FEN"),
                  ),
                ],
              ),
            )
          ],
        ),
      ),
    );
  }
}