0

我的应用程序中有卡片，每张卡片有 4 个灰色项目，如果选择了该项目，则其颜色变为蓝色，其他卡片中的相同项目应该禁用，我无法使用地图收集来做到这一点。所以我有 IT、DEV、TEST、HR 等项目，如果在任何一张卡中选择了 IT，那么其余卡中的其余 IT 项目应该禁用。我将在下面附上应用程序的屏幕截图和代码。任何人都可以帮助我，请。提前致谢。初始画面 添加最多4张卡后

    import 'package:flutter/material.dart';

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

class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: CardWithTextformfield(),
    );
  }
}

class CardWithTextformfield extends StatefulWidget {
  const CardWithTextformfield({Key? key}) : super(key: key);

  @override
  _CardWithTextformfieldState createState() => _CardWithTextformfieldState();
}

class _CardWithTextformfieldState extends State<CardWithTextformfield> with AutomaticKeepAliveClientMixin {
  @override
  // TODO: implement wantKeepAlive
  bool get wantKeepAlive => true;

  var name =<TextEditingController>[];
  var id =<TextEditingController>[];

  var addCard =1;

  void incrementcard(){
    setState(() {
      if(addCard >=4){
        return;
      }
      addCard++;
    });
  }

  @override
  Widget build(BuildContext context) {
    super.build(context);
    return Scaffold(
      appBar: AppBar(
        title: Text('Card with TextformField'),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: incrementcard,
        child: Icon(Icons.add),
      ),
      body: Container(
        child:ListView.builder(
          itemCount: addCard,
            itemBuilder: (context,index){
            return cardslist(index);
            }
        ),
      ),
    );
  }
  Widget cardslist(int index){
    if(name.length <= index){
      name.add(TextEditingController());
      id.add(TextEditingController());
    }
    return Card(
      margin: EdgeInsets.all(10),
      child: Container(
        child: Column(
          children: [
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Container(
                    margin: EdgeInsets.all(10),
                    child: Text('Team Name: ')),
                Expanded(child: TextFormField(
                  controller: name[index],
                    decoration: InputDecoration(hintText: 'Team Name'),
                ),),
                Container(
                  margin: EdgeInsets.all(10),
                  child: Text('Team Id: '),),
                Expanded(child: TextFormField(
                  controller: id[index],
                    decoration: InputDecoration(hintText: 'Team Id'),
                ),),
              ],
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                GestureDetector(
                  child: Container(
                    width: 50,height: 50,
                    margin: EdgeInsets.all(10),
                    decoration: BoxDecoration(
                      shape: BoxShape.rectangle,
                      color: Colors.grey,
                    ),
                    child: Center(child: Text('IT'),),
                  ),
                ),
                GestureDetector(
                  child: Container(
                    width: 50,height: 50,
                    margin: EdgeInsets.all(10),
                    decoration: BoxDecoration(
                      shape: BoxShape.rectangle,
                      color: Colors.grey,
                    ),
                    child: Center(child: Text('DEV'),),
                  ),
                ),
                GestureDetector(
                  child: Container(
                    width: 50,height: 50,
                    margin: EdgeInsets.all(10),
                    decoration: BoxDecoration(
                      shape: BoxShape.rectangle,
                      color: Colors.grey,
                    ),
                    child: Center(child: Text('TEST'),),
                  ),
                ),
                GestureDetector(
                  child: Container(
                    width: 50,height: 50,
                    margin: EdgeInsets.all(10),
                    decoration: BoxDecoration(
                      shape: BoxShape.rectangle,
                      color: Colors.grey,
                    ),
                    child: Center(child: Text('HR'),),
                  ),
                ),
              ],
            )
          ],
        ),
      ),
    );
  }

}
4

1 回答 1

0

据我了解，您想比较内部值的值map

声明一个全局 -> bool 变量(final bool isSelected = false)

  • 将值存储在variable要比较的 a 中

  • 使用 forLoop 迭代 map 中的值

  • 检查值是否存在，设置isSelected = true

  • 用于isSelected设置颜色

             GestureDetector(
           child: Container(
             width: 50,height: 50,
             margin: EdgeInsets.all(10),
             decoration: BoxDecoration(
               shape: BoxShape.rectangle,
               color: isSelected == true ? Colors.blue : Colors.grey,
             ),
             child: Center(child: Text('HR'),),
           ),
         ),

请检查一次地图迭代的帖子 -添加/更新 K，V 对的列表到空声明的地图 = List<Map<dynamic, dynamic>>

希望它能解决问题

于 2021-08-30T13:37:09.677 回答