Chessboard with diagonal selection

main.dart

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  final String title;

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

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  bool diagonalSelected = false;
  int selectedRow = 0;
  int selectedCol = 0;

  // generates color of the square tile based on coordinates
  Color getSquareColor({required int row, required int col}) {
    // 2 poinst lie on the same line if |x1-x2| = |y1-y2|
    if (((selectedRow - row).abs() == (selectedCol - col).abs()) &&
        diagonalSelected) {
      return Colors.redAccent;
    } else {
      // white is only required in tiles where both rows and cols are
      // either even or odd
      if (row % 2 == col % 2) {
        return Colors.white;
      }

      return Colors.black;
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: GridView.count(
          crossAxisCount: 8,
          children: List.generate(
            64,
            (index) {
              int row = 0;
              int col = 0;
              row = index ~/ 8;
              col = index % 8;

              return ChessSquare(
                color: getSquareColor(row: row, col: col),
                height: 40,
                width: 40,
                voidCallback: () {
                  setState(() {
                    diagonalSelected = !diagonalSelected;
                    selectedRow = row;
                    selectedCol = col;
                  });
                },
              );
            },
          )),
    );
  }
}

class ChessSquare extends StatelessWidget {
  const ChessSquare(
      {Key? key,
      required this.color,
      required this.height,
      required this.width,
      required this.voidCallback})
      : super(key: key);

  final Color color;
  final double height, width;
  final VoidCallback voidCallback;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () => voidCallback(),
      child: Container(
        height: height,
        width: width,
        decoration: BoxDecoration(
            color: color, border: Border.all(color: Colors.black)),
      ),
    );
  }
}