flutter - 所有卡片的 TextField 值更改

Question

我正在建立健身日记，并且每个 Action 都有“卡片”，其中包括“组数代表公斤数”。因此代码会在 View 中生成尽可能多的卡片“Squat”和“Front-squat”。这里的问题是我在两张卡中都使用了 Controller 集。如果我将“深蹲”组数更改为“2”，那么“前蹲”组数也会更改为“2”，因为它使用相同的 Controller 集 TextEditingController。这是我的问题，请考虑甚至可以有 10 个 Action ，我不认为我想为每个 Action 创建 10 x 3 Controller 。我的问题是我应该如何构建这个功能？完整的代码可以在这里找到:

return Column(
  children: <Widget>[
    Text(
      _programMovesGen(program)[index],
      textAlign: TextAlign.center,
      style: TextStyle().copyWith(color: Colors.black, fontSize: 18.0),
    ), // Move name
    Row(
      mainAxisSize: MainAxisSize.max,
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      children: <Widget>[
        new Flexible(
          child: Padding(
            padding: const EdgeInsets.all(18.0),
            child: new TextFormField(
                controller: controllerSets,
                keyboardType: TextInputType.number,
                inputFormatters: [
                  LengthLimitingTextInputFormatter(2),
                ]),
          ),
        ),
        Text(
          "sets ",
          textAlign: TextAlign.center,
          style: TextStyle().copyWith(color: Colors.black, fontSize: 18.0),
        ),
        new Flexible(
          child: Padding(
            padding: const EdgeInsets.all(8.0),
            child: new TextFormField(
                controller: controllerReps,
                keyboardType: TextInputType.number,
                inputFormatters: [
                  LengthLimitingTextInputFormatter(2),
                ]),
          ),
        ),
        Text(
          "reps",
          textAlign: TextAlign.center,
          style: TextStyle().copyWith(color: Colors.black, fontSize: 18.0),
        ),
        new Flexible(
          child: Padding(
            padding: const EdgeInsets.all(8.0),
            child: new TextFormField(
                controller: controllerKgs,
                keyboardType: TextInputType.number,
                inputFormatters: [
                  LengthLimitingTextInputFormatter(2),
                ]),
          ),
        ),
        Text(
          "kg",
          textAlign: TextAlign.center,
          style: TextStyle().copyWith(color: Colors.black, fontSize: 18.0),
        ),
        Container(
            height: 60,
            width: 60,
            margin: const EdgeInsets.all(16.0),
            decoration: BoxDecoration(
              shape: BoxShape.circle,
              border: Border.all(
                color: Colors.pink,
                width: 3.5,
              ),
            ),
            child: IconButton(
                icon: Icon(
                  IconData(57669, fontFamily: 'MaterialIcons'),
                  size: 38,
                  color: Colors.red,
                ),
                onPressed: () => {
                      _saveMove(_programMovesGen(program)[index]),
                    })),

        ///TODO add to db and previous added move
      ],
    ),
  ],
);

}

https://pastebin.com/m6zVLUAD

Answer 1

像这样制作 TextEditingControllers 的 arrays:

List<TextEditingController> controllerSets = new List<TextEditingController>();
List<TextEditingController> controllerReps = new List<TextEditingController>();
List<TextEditingController> controllerKgs = new List<TextEditingController>();

TextEditingController sets = new TextEditingController(text: '3');
TextEditingController reps = new TextEditingController(text: '6');
TextEditingController kgs = new TextEditingController(text: '60');

在您的 initState 方法中，执行以下操作:

@override
void initState() {
  super.initState();
}

现在在 _saveMove 函数中传递 list index，所以它看起来像这样:

_saveMove(String moveName, int index) async {
    SharedPreferences prefs = await SharedPreferences.getInstance();
    setState(() {
      debugPrint("BEFORE SAVEDMOVES " + savedMoves);

      savedMoves += (moveName != "")
          ? moveName +
              ": " +
              controllerSets[index].text +
              " sets " +
              controllerReps[index].text +
              " reps " +
              controllerKgs[index].text +
              " kg\n"
          : "";
      prefs.setString('history', savedMoves);
    });
  }

您的 _buildCardContent() 函数将被更改，因为您还必须在 controllers list 中传递 index:

Widget _buildCardContent(int index) {
    controllerSets.add(sets);
    controllerReps.add(reps);
    controllerKgs.add(kgs);

    return Column(
      children: <Widget>[
        Text(
          _programMovesGen(program)[index],
          textAlign: TextAlign.center,
          style: TextStyle().copyWith(color: Colors.black, fontSize: 18.0),
        ), // Move name
        Row(
          mainAxisSize: MainAxisSize.max,
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: <Widget>[
            new Flexible(
              child: Padding(
                padding: const EdgeInsets.all(18.0),
                child: new TextFormField(
                    controller: controllerSets[index],
                    keyboardType: TextInputType.number,
                    inputFormatters: [
                      LengthLimitingTextInputFormatter(2),
                    ]),
              ),
            ),
            Text(
              "sets ",
              textAlign: TextAlign.center,
              style: TextStyle().copyWith(color: Colors.black, fontSize: 18.0),
            ),
            new Flexible(
              child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: new TextFormField(
                    controller: controllerReps[index],
                    keyboardType: TextInputType.number,
                    inputFormatters: [
                      LengthLimitingTextInputFormatter(2),
                    ]),
              ),
            ),
            Text(
              "reps",
              textAlign: TextAlign.center,
              style: TextStyle().copyWith(color: Colors.black, fontSize: 18.0),
            ),
            new Flexible(
              child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: new TextFormField(
                    controller: controllerKgs[index],
                    keyboardType: TextInputType.number,
                    inputFormatters: [
                      LengthLimitingTextInputFormatter(2),
                    ]),
              ),
            ),
            Text(
              "kg",
              textAlign: TextAlign.center,
              style: TextStyle().copyWith(color: Colors.black, fontSize: 18.0),
            ),
            Container(
                height: 60,
                width: 60,
                margin: const EdgeInsets.all(16.0),
                decoration: BoxDecoration(
                  shape: BoxShape.circle,
                  border: Border.all(
                    color: Colors.pink,
                    width: 3.5,
                  ),
                  /*gradient: RadialGradient(
                  radius: 0.50,
                  colors: [
                    Colors.blue,
                    Colors.yellowAccent,
                  ],
                ),*/
                ),
                child: IconButton(
                    icon: Icon(
                      IconData(57669, fontFamily: 'MaterialIcons'),
                      size: 38,
                      color: Colors.red,
                    ),
                    onPressed: () => {
                          _saveMove(_programMovesGen(program)[index], index),
                        })),

            ///TODO add to db and previous added move
          ],
        ),
      ],
    );
  }