将文本字段值存储在地图值中

Question

所以我有这张问题图和一个文本字段小部件，我正在使用 for 循环来浏览问题并显示它们。我喜欢将文本字段数据存储在地图中的正确位置（类似于：问题 1 => 答案 1 等等）
代码如下：

import 'package:flutter/material.dart';

class CustomQuestionField extends StatefulWidget {
  @override
  State<CustomQuestionField> createState() => _CustomQuestionFieldState();
}

class _CustomQuestionFieldState extends State<CustomQuestionField> {
  final Map<String, String> qna = {
    "Everyone should read...": "",
    "Two truths and a lie...": "",
    "I can quote every line from...": "",
    "If I didn't have to work I would...": "",
    "People think I am...": "",
    "Never have I ever...": "",
    "Believe it or not, I...": "",
    "I am amazing at...": "",
    "My life as a movie...": "",
    "My ultimate dinner party guest list...": "",
    "The dorkiest thing about me is...": "",
    "On the weekend you'll find me...": "",
  };

  @override
  Widget build(
    BuildContext context,
  ) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        for (var q in qna.keys) question(q),
        RaisedButton(
            shape:
                RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)),
            color: Colors.purple,
            child: Padding(
              padding: const EdgeInsets.all(10.0),
              child: Text(
                "Submit",
                style: TextStyle(color: Colors.white, fontSize: 20),
              ),
            ),
            onPressed: () {
              print(qna.values);
            }),
      ],
    );
  }

  Widget question(String question) {
    final myController = TextEditingController();
    return Padding(
      padding: const EdgeInsets.only(top: 15),
      child: Stack(
        children: [
          Card(
            elevation: 0,
            shape: RoundedRectangleBorder(
                side: BorderSide(width: 0.5, color: Colors.black),
                borderRadius: BorderRadius.circular(
                  32,
                )),
            child: Padding(
              padding: const EdgeInsets.all(20.0),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Padding(
                    padding: const EdgeInsets.only(bottom: 15, left: 10),
                    child: Text(
                      question,
                      style: TextStyle(
                          color: Colors.black,
                          fontSize: 18.0,
                          fontWeight: FontWeight.bold),
                    ),
                  ),
                  TextField(
                    onChanged: ((value) {
                      print(value);
                    }),
                    onSubmitted: (String ansr) {
                      setState(() {
                        
                      });
                    },
                    controller: myController,
                    decoration: InputDecoration(
                      // filled: true,
                      enabledBorder: OutlineInputBorder(
                        borderRadius: BorderRadius.circular(20),
                        borderSide: BorderSide(
                          color: Color.fromARGB(255, 128, 124, 124),
                        ),
                      ),
                      focusedBorder: OutlineInputBorder(
                        borderRadius: BorderRadius.circular(20),
                        borderSide: BorderSide(
                          color: Color.fromARGB(255, 128, 124, 124),
                        ),
                      ),
                      border: OutlineInputBorder(
                        borderRadius: BorderRadius.circular(20),
                        borderSide: BorderSide(
                          color: Color.fromARGB(255, 128, 124, 124),
                        ),
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
          Positioned(
            top: -10,
            right: -25,
            child: RawMaterialButton(
              onPressed: () {},
              elevation: 2.0,
              fillColor: Colors.white,
              child: Text(
                "X",
                style:
                    TextStyle(color: Colors.black, fontWeight: FontWeight.bold),
              ),
              shape: CircleBorder(),
            ),
          ),
        ],
      ),
    );
  }
}

截图如下：

有什么想法吗？

Answer 1

只需创建一个包含答案的地图：

final Map<String, String> answers = {};

然后在您的 onSubmitted 中添加这一行：

answers[question] = ansr;

Answer 2

你没有在map中定义key，把你的map改成这样

final Map<String, String> qna = [
    {"question" : "Everyone should read...", "answer":""},
    {"question" :"Two truths and a lie...", "answer":""},
    {"question" :"I can quote every line from...", "answer":""},
    .
    .
    .
    {"question" :"On the weekend you'll find me...", "answer":""},
    ];

  **In Text Field setState**

 TextField(
                    onChanged: ((value) {
                      print(value);
                    }),
                    onSubmitted: (String ansr) {
                      setState(() {
                        q[answer]=ansr;
                      });
                    },
--------------------------------------
RaisedButton(
            shape:
                RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)),
            color: Colors.purple,
            child: Padding(
              padding: const EdgeInsets.all(10.0),
              child: Text(
                "Submit",
                style: TextStyle(color: Colors.white, fontSize: 20),
              ),
            ),
            onPressed: () {
              print(qna["answer"]);
            }),

将文本字段值存储在地图值中

Store textfield value in Map value

dictionary

data-structures

dart

flutter

flutter-layout