flutter中如何根据DropdownMenu的onSelected更新TextField？

Question

我有以下代码，我试图获取 UI 中 Result 旁边的 TextField 的内容，以根据此 Flutter 应用程序的 DropdownMenu 中更改的项目自动更新。

代码：

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

const List<String> list = <String>[
  "A",
  "B",
  "C",
];

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  late final TextEditingController firstController;
  late final TextEditingController controllerResult;
  late String dropdownValue = list.first;

  @override
  void initState() {
    super.initState();
    firstController = TextEditingController();
    controllerResult = TextEditingController();
  }

  @override
  void dispose() {
    firstController.dispose();
    controllerResult.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    ComputeResult cr;

    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: Container(
        padding: const EdgeInsets.all(10.0),
        child: Column(
          children: [
            Row(
              children: [
                Expanded(
                  flex: 5,
                  child: TextField(
                    controller: firstController,
                    decoration: const InputDecoration(
                      border: OutlineInputBorder(),
                      hintText: 'Value',
                    ),
                    keyboardType: TextInputType.number,
                    onChanged: (value) {
                      if (firstController.text.isNotEmpty) {
                        switch (dropdownValue) {
                          case "A":
                            controllerResult.text = "-1";
                            break;
                          case "B":
                            controllerResult.text = "-2";
                            break;
                          case "C":
                            cr = ComputeResult.named03(
                                double.parse(firstController.text));
                            controllerResult.text = cr.value01.toString();
                            break;
                        }
                      } else {
                        controllerResult.text = "";
                      }
                    },
                  ),
                ),
                Expanded(
                  flex: 5,
                  child: DropdownMenu<String>(
                    initialSelection: list.first,
                    onSelected: (String? value) {
                      setState(() {
                        dropdownValue = value!;
                      });
                    },
                    dropdownMenuEntries:
                        list.map<DropdownMenuEntry<String>>((String value) {
                      return DropdownMenuEntry<String>(
                          value: value, label: value);
                    }).toList(),
                  ),
                ),
              ],
            ),
            SingleChildScrollView(
              child: Column(
                children: [
                  Row(
                    children: [
                      Expanded(
                        flex: 5,
                        child: TextField(
                          readOnly: true,
                          controller: controllerResult,
                        ),
                      ),
                      Expanded(
                        flex: 5,
                        child: Text("Result"),
                      ),
                    ],
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}

class ComputeResult {
  ComputeResult.named01(this.value01) {
    value02 = value01 + 100;
    value03 = value01 + 110;
  }
  ComputeResult.named02(this.value02) {
    value01 = value02 + 200;
    value03 = value02 + 210;
  }
  ComputeResult.named03(this.value03) {
    value01 = value03 + 300;
    value02 = value03 + 310;
  }
  double value01 = 0;
  double value02 = 0;
  double value03 = 0;
}

我该如何实施，有人可以帮忙吗？ （目前，从 DropdownMenu 中选择新项目后，该值不会自动更新，但前提是我们更改 UI 中 DropdownMenu 旁边的 not 只读 TextField 的文本。）

我尝试过的：我尝试将侦听器添加到

firstController

，如这个答案中所述，但这不起作用。

Answer 1

DropdownMenu

本质上相当于

TextField

，因此，它支持使用

TextEditingController

。因此，我们需要做的就是向 DropdownMenu 添加一个控制器。部分代码如下：

late final TextEditingController dropdownMenuController;

@override
void initState() {
  super.initState();
  dropdownMenuController = TextEditingController();
}

DropdownMenu<String>(
  controller: dropdownMenuController,

在你想听的

onChanged

的

TextField

事件中，添加以下代码来更改

DropdownMenu

的内容。部分代码如下：

onChanged: (value) {
  if (value.isNotEmpty && int.tryParse(value) == 1) {
    dropdownMenuController.text = "C";
  }