保持在Listview Flutter中选择一个项目

Question

我有一个包含3个Listitems的Listview，我需要选择一个项目，然后将其保留为选中状态；如果单击另一个项目，则应该取消选择先前选择的项目，还更改了Container的颜色，但是问题是它抛出了错误像这样

错误：

The getter 'isSelected' isn't defined for the class 'String'.
Try correcting the name to the name of an existing getter, or defining a getter or field named 'isSelected'.
        color: physical_status[index].isSelected ? Colors.red[100] : Colors.white,

Listview的代码

 final List<String> physical_status = <String>['0', '1', '2'];
    bool isSelected = false;
      @override
      Widget build(BuildContext context) {
    Size size = MediaQuery.of(context).size;
     SingleChildScrollView(
                      scrollDirection: Axis.horizontal,
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: <Widget>[
                          Container(
                            height: 110,
                            width: size.width,
                            child: ListView.builder(
                              shrinkWrap: true,
                              scrollDirection: Axis.horizontal,
                              itemBuilder: (BuildContext context, int index) {
                                return Padding(
                                  padding: const EdgeInsets.all(10.0),
                                  child: GestureDetector(
                                    onTap: () {
                                      print("clicked");
                                      setState(() {
                                        physical_status[index].isSelected = true;
                                      });
                                    },
                                    child: Container(
                                      width: 100,
                                      height: 100,
                                      color: physical_status[index].isSelected ? Colors.red[100] : Colors.white,
                                      decoration: new BoxDecoration(
                                        shape: BoxShape.circle,
                                        image: new DecorationImage(
                                            fit: BoxFit.cover,
                                            image: AssetImage(
                                                "assets/images/user_avatar.png")),
                                      ),
                                    ),
                                  ),
                                );
                              },
                            ),
                          ),
                        ],
                      ),
                    ),

    }

Answer 1

您正在尝试从isSelectable列表元素访问physical_status属性。但是元素是字符串，String没有这种属性。

您需要单独存储selectedItems，或将physical_status列表转换为对象列表。

Answer 2

您可以使用布尔列表而不是字符串，还可以使用另一个变量来管理当前选择的项目。

以下代码将为您提供更多帮助。

 final List<bool> physical_status = <bool>[false, false, false];
  int currentSelectedIndex = 0;
  @override
  Widget build(BuildContext context) {
    Size size = MediaQuery.of(context).size;
    return Scaffold(
      body: SingleChildScrollView(
        scrollDirection: Axis.horizontal,
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: <Widget>[
            Container(
              height: 110,
              width: size.width,
              child: ListView.builder(
                shrinkWrap: true,
                scrollDirection: Axis.horizontal,
                itemCount: physical_status.length,
                itemBuilder: (BuildContext context, int index) {
                  return Padding(
                    padding: const EdgeInsets.all(10.0),
                    child: GestureDetector(
                      onTap: () {
                        print("clicked");
                        setState(() {
                          physical_status[currentSelectedIndex] = false;
                          currentSelectedIndex = index;
                          physical_status[index] = true;
                        });
                      },
                      child: Container(
                        width: 100,
                        height: 100,
                        decoration: new BoxDecoration(
                          color: physical_status[index]
                              ? Colors.red[100]
                              : Colors.white,
                          shape: BoxShape.circle,
                          image: new DecorationImage(
                              fit: BoxFit.cover,
                              image: AssetImage("assets/images/crown 1.png")),
                        ),
                      ),
                    ),
                  );
                },
              ),
            ),
          ],
        ),
      ),
    );
  }