将索引附加到列表项（字符串）[Flutter]

Question

我不想将 isSelected 设为 bool 变量，而是将其设为选定项的索引。然后检查 reportReasons 列表中 selected 的索引。

这是为了知道被选中的原因。另外，如果 isSelected 不是布尔值，我该如何让选定的容器改变颜色？

谢谢。

final List<String> reportReasons = [
  'blah',
'blah blah',
'blah blah blah'
];

List<String> chosenReasonsToReport = [];
bool isSelected = false;

  Container(
                child: Wrap(
                    children: reportReasons
                        .map((reportReason) => GestureDetector(
                              onTap: () {
                               
                                setState(() { if (isSelected = false) {
                                  isSelected = true;
                                } else {
                                  isSelected = false;
                                }});
if (reportReason.isSelected && chosenReasonsToReport.length < 3) {
      chosenReasonsToReport.add('${reportReason}');

      print(chosenReasonsToReport);
    } else {
      chosenReasonsToReport.remove('${reportReason}');
     
      print(chosenReasonsToReport);
    }
                              },
                              child: Container(
                                margin: EdgeInsets.only(
                                  right:
                                      MediaQuery.of(context).size.width * 0.021,
                                  bottom: MediaQuery.of(context).size.height *
                                      0.009,
                                ),
                                decoration: BoxDecoration(
                                    color: isSelected
                                        ? Color(0xff4aa3f8)
                                        : Color(0xff3a327f),
                                    borderRadius: BorderRadius.circular(12),
                                    border: Border.all(
                                        color:
                                            Colors.grey[50].withOpacity(0.60))),
                                padding: EdgeInsets.symmetric(
                                    horizontal:
                                        MediaQuery.of(context).size.width *
                                            0.027,
                                    vertical:
                                        MediaQuery.of(context).size.height *
                                            0.0045),
                                child: Text(
                                  reportReason,
                                  style: TextStyle(
                                      fontSize: 13.5,
                                      color: isSelected
                                          ? Color(0xff231b6a)
                                          : null),
                                ),
                              ),
                            ))
                        .toList()),

Answer 1

您可以使用几种方法：

一组索引：

class _MyScreenState extends State<MyScreen> {
  static const List<String> _reportReasons = [
    'blah',
    'blah blah',
    'blah blah blah'
  ];

  Set<int> _chosenIndexes = {};
  
  @override
  Widget build(BuildContext context) {
    return ListView(
      children: List.generate(_reportReasons.length, (i) {
        return Container(
          // Change property based on report selection
          color: _chosenIndexes.contains(i) 
            ? Colors.green 
            : Colors.red,
          child: CheckboxListTile(
            // Accessing report name
            title: Text(_reportReasons[i]),
            // Accessing if report is selected
            value: _chosenIndexes.contains(i),
            // Selecting and unselecting report
            onChanged: (v) {
              setState(() {
                if (v) {
                  _chosenIndexes.add(i);
                } else {
                 _chosenIndexes.remove(i);
                }
              });
            }
          ),
        );
      }),
    );
  }
}

字符串和布尔值的映射：

class _MyScreenState extends State<MyScreen> {
  final Map<String, bool> _reports = {
    'blah': false,
    'blah blah': false,
    'blah blah blah': false,
  };
  
  @override
  Widget build(BuildContext context) {
    return ListView(
      children: _reports.keys.map((report) {
        return Container(
          // Change property based on report selection
          color: _reports[report] 
            ? Colors.green 
            : Colors.red,
          child: CheckboxListTile(
            // Accessing report name
            title: Text(report),
            // Accessing if report is selected
            value: _reports[report],
             // Selecting and unselecting report
            onChanged: (v) {
              setState(() => _reports[report] = v);
            }
          ),
        );
      }).toList(),
    );
  }
}

将索引附加到列表项（字符串）[Flutter]

Attaching Index To List Item (string) [Flutter]

indexing

containers

list

colors

flutter