Flutter: How to change dynamically the color in initialized widget list

How to change dynamically the color in initialized widget list?<br/>
<br/>
I have a pre initialized Widgetlist, and I want to change its background color while the user is pressing it<br/>
To use the _counter % 2 == 1 ? Colors.green : Colors.red dosn't function.<br/>
To change the color over a function is resulting in the same problem.<br/>
<br/>
My complete code: see _initMyList()<br/>
<br/>
<br/>

import 'package:flutter/material.dart';

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

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

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

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

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

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;
  List<Widget> _aMyList = [];

  _initMyList() {
    for (int i = 0; i < 5; i++) {
      Text text = new Text("Item " + i.toString());
      GestureDetector gestureDetector = new GestureDetector(onTap: () => {_callback()}, child: text);
      // ======== How to change the color ?
      Container container = new Container(alignment: Alignment.center, child: gestureDetector, color: _counter % 2 == 1 ? Colors.green : Colors.red);
      SizedBox sizedBox = new SizedBox(width: 60, height: 40, child: container);
      _aMyList.add(sizedBox);
    }
  }

  void _callback() {
    setState(() {
      _counter++;
    });
  }

  void initState() {
    super.initState();
    _initMyList();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: _aMyList
        ),
      ),
    );
  }
}

Why are you creating such complex logic for it?

Need to simply add List.generate for generating the dynamic length of the list.

Column(
          mainAxisAlignment: MainAxisAlignment.center,
          mainAxisSize: MainAxisSize.min,
          children: List.generate(
            5,
            (index) => SizedBox(
              width: 60,
              height: 40,
              child: GestureDetector(
                onTap: () {
                  setState(() {
                    _counter++;
                  });
                },
                child: Container(
                  alignment: Alignment.center,
                  color: _counter % 2 == 1 ? Colors.green : Colors.red,
                ),
              ),
            ),
          ),
        )

Replace the Above snippet with your Column widget.