我怎样才能让列表中的每个元素都有一个孤立的行为？

Question

我只想让我点击的项目改变颜色，但所有项目都继承了新颜色，
我怎样才能让列表中的每个元素都有一个独立的行为？

import 'package:flutter/material.dart';


class myClass extends StatefulWidget {
  @override
  State<myClass> createState() => _myClassState();
}

class _myClassState extends State<myClass> {

  Color color =Colors.green  ;
  List ListOfProfils = ["a","b","c"] ;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: ListView.builder(
        itemBuilder: (context, index) => Container(
          key: Key(ListOfProfils[index]),
          height: 100,
          width: 100,
          color : color,
          margin: EdgeInsets.all(10),
          child: TextButton(
              onPressed: () => setState(() {
                print(color);
                color =Colors.red  ;
                print(color);
              }), child: Text("CLICK")),
        ),
        itemCount: 3,
      ),
    );


     ;
  }
}

Answer 1

将您的代码更改为此。

class _myClassState extends State<myClass> {
  Color color = Colors.green;
  List ListOfProfils = ["a", "b", "c"];
  int selectedIndex = -1;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: ListView.builder(
        itemBuilder: (context, index) => Container(
          key: Key(ListOfProfils[index]),
          height: 100,
          width: 100,
          color: selectedIndex == index ? Colors.red : color,
          margin: EdgeInsets.all(10),
          child: TextButton(
              onPressed: () => setState(() {
                    selectedIndex = index;
                  }),
              child: Text("CLICK")),
        ),
        itemCount: 3,
      ),
    );
  }
}

我怎样才能让列表中的每个元素都有一个孤立的行为？

how can I have an isolated behavior per element in a list?

flutter

listview

statefulwidget