flutter - Flutter：在 list.generate 中制作列表项

Question

我可能无法正确解释..我已经创建了一个列表，List.generate(9,(index) =>Container() 在这个列表中使用了 9 个列表项我想特别为列表中的 3 个随机项目/容器提供随机颜色，当我单击容器时

GridView(
                shrinkWrap: true,
                gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                  crossAxisSpacing: 2,
                  mainAxisSpacing: 2,
                  crossAxisCount: 3,
                ),
                children: ListView(listLength, (index) {
                  final _isSelected = _clicked.contains(index);
                  return Center(

                    child: GestureDetector(
                      onTap: () {
                          setState(() {
                            if (_isSelected) {
                              _clicked.remove(index);
                            } else {
                              _clicked.add(in);
                            }
                          });
                      },
                      child: AnimatedContainer(
                        duration: const Duration(milliseconds: 400),
                        curve: Curves.easeInQuad,
                        decoration: BoxDecoration(
                          border: Border.all(
                              style: BorderStyle.solid, color: Colors.black),
                          color: _isSelected ? _color : Colors.white,

                        ),
                      ),
                    ),
                  );
                }),
              ),

现在，我想使用 Random() 为每个容器着色不同的颜色，我该怎么做？

Answer 1

完整的小部件

class Applicants extends StatefulWidget {
  const Applicants({
    Key? key,
  }) : super(key: key);
  @override
  State<Applicants> createState() => _ApplicantsState();
}

class _ApplicantsState extends State<Applicants> {
  Color _baseColor = Colors.blue;

  int listLength = 9;
  List<int> _luckyItems = [];

  //* import import 'dart:math';
  final Random random = Random();
  get randomColor =>
      Color((random.nextDouble() * 0xFFFFFF).toInt()).withOpacity(1.0);

  randomColorContainerIndex() {
    List<int> selected = [];

    while (selected.length < 3) {
      final i = random.nextInt(listLength);
      if (!selected.contains(i)) selected.add(i);
    }

    return selected;
  }

  @override
  Widget build(BuildContext context) {
    return GridView(
        shrinkWrap: true,
        gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisSpacing: 2,
          mainAxisSpacing: 2,
          crossAxisCount: 3,
        ),
        children: [
          ...List.generate(listLength, (index) {
            return Center(
              child: InkWell(
                onTap: () async {
                  print("item $index");
                  setState(() {
                    _luckyItems = randomColorContainerIndex();
                  });
                },
                child: AnimatedContainer(
                  duration: const Duration(milliseconds: 400),
                  curve: Curves.easeInQuad,
                  decoration: BoxDecoration(
                    border: Border.all(
                        style: BorderStyle.solid, color: Colors.black),
                    color:
                        _luckyItems.contains(index) ? randomColor : _baseColor,
                  ),
                ),
              ),
            );
          }),
        ]);
  }
}