I have asked this question previously but I am not receiving much help. I've created a GridView using GridView.count; however, I cannot get an indiviual container to change colors. The entire row changes if I click on any container within the row. I want to be able to change an individual container's color when it is tapped on, as well as have check mark appear on the top right corner of the container when selected.

(1)

import 'package:flutter/material.dart';

const Color darkBlue = Color.fromARGB(255, 18, 32, 47);

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(
        scaffoldBackgroundColor: darkBlue,
      ),
      debugShowtappedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: CustomCheckboxGrid(),
        ),
      ),
    );
  }
}

class CustomCheckboxGrid extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _CustomCheckboxGridState();
  }
}

class _CustomCheckboxGridState extends State<CustomCheckboxGrid> {
 
  
 int tapped_index = 0;

List card_names = [
  'Maintaining healthy relationships',
  'Being happier and more content in life',
  'Work life balance',
  'Personal Growth',
  'Stress',
  'Mental health',
];

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: GridView.builder(
      padding: const EdgeInsets.all(16),
      itemCount: card_names.length,
      itemBuilder: (BuildContext context, int index) {
        return buildCard(index);
      },
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
        crossAxisCount: 2,
      ),
    ),
  );
}

Widget buildCard(int index) {
  bool tapped = index == tapped_index;
  String current_name = card_names[index];
  return GestureDetector(
    onTap: () {
      setState(() {
        print("Tapped index: ${index}");
        tapped_index = index;
      });
    },
    child: Stack(
      children: <Widget>[
        Padding(
          padding: const EdgeInsets.all(14),
          child: 
            //put your widget here!!!!!
            //-----------------------------------
            Card(
            color: tapped ? Colors.orange : Colors.white,
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(16),
            ),
            child: Container(
              child: Center(child: Text(current_name)),
            ),
          ),
            //-----------------------------------
        ),
        Positioned(
          top: 14,
          right: 14,
          child: Offstage(
            offstage: !tapped,
            child: Container(
              decoration: BoxDecoration(
                  color: Colors.white,
                  border: Border.all(width: 2),
                  shape: BoxShape.circle),
              child: Icon(
                Icons.check,
                color: Colors.green,
              ),
            ),
          ),
        ),
      ],
    ),
  );
}
}