wp_chessboard 0.0.5

A very customizable Chessboard with awesomeness already onboard.

WP_CHESSBOARD

A very customizable Chessboard with awesomeness already onboard:

👇️ Dragable Pieces

🎬️ Move Animations

🔄 Orientation

💡 Hints

💡 Arrows

⌨️ Keyboard Shortcuts

Features

👇️ Dragable Pieces

🎬️ Piece Animations for Single Moves

🎬️ Piece Animations for position changes/reset

🔄 Change Orientation

💡 Display Hints

💡 Display Arrows

⌨️ Keyboard Shortcuts

Opt in by passing shortcuts: ShortcutArgs(). The user types a file letter (a–h) to highlight a column, then a digit (1–8) to narrow to a single square, and confirms with space — which fires the same handlers a click would. Set commitMode: ShortcutCommitMode.auto to commit the moment the digit is typed (no space needed). A stray click clears any pending selection. The highlight widget is restyleable via highlightBuilder.

ShortcutArgs(
  commitMode: ShortcutCommitMode.space, // or .auto
  highlightBuilder: (size) => ShortcutHighlight(size: size, color: Colors.amber),
)

Usage

First import the WPChessboard widget.

import 'package:wp_chessboard/wp_chessboard.dart';

Then, you are ready to use it

You can use your own piece set, in the example we will use the chess_vectors_flutter package.

WPChessboard(
    size: size,
    orientation: orienatation,
    squareBuilder: squareBuilder,
    controller: controller,
    // Dont pass any onPieceDrop handler to disable drag and drop
    onPieceDrop: onPieceDrop,
    onPieceTap: onPieceTap,
    onPieceStartDrag: onPieceStartDrag,
    onEmptyFieldTap: onEmptyFieldTap,
    turnTopPlayerPieces: false,
    ghostOnDrag: true,
    dropIndicator: DropIndicatorArgs(
        size: size / 2,
        color: Colors.lightBlue.withOpacity(0.24)
    ),
    shortcuts: const ShortcutArgs(),
    pieceMap: PieceMap(
        K: (size) => WhiteKing(size: size),
        Q: (size) => WhiteQueen(size: size),
        B: (size) => WhiteBishop(size: size),
        N: (size) => WhiteKnight(size: size),
        R: (size) => WhiteRook(size: size),
        P: (size) => WhitePawn(size: size),
        k: (size) => BlackKing(size: size),
        q: (size) => BlackQueen(size: size),
        b: (size) => BlackBishop(size: size),
        n: (size) => BlackKnight(size: size),
        r: (size) => BlackRook(size: size),
        p: (size) => BlackPawn(size: size),
    ),
),

I know this is very short, for more information checkout the example :).

Additional information

Every contribution is very welcome.

Cheers 🥂