将下拉按钮选择放入 to-do 列表

Question

我对Flutter/Dart很陌生，所以请原谅我的无知，请像我一个五岁的孩子一样向我解释一切。

我的应用程序上有一个屏幕，我希望用户有两个选项：使用文本字段输入文本或 select 从下拉菜单中选择一个选项。他们选择的任何一个都将被放置在 to-do 列表中。

但是，我似乎无法弄清楚如何从 DropdownButton 小部件获取 selection 以将其保存到 to-do 列表中，就像文本字段条目一样。

下面是我输入新项目的屏幕代码。

import 'package:provider/provider.dart';
import 'task_data.dart';

class AddTaskScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    String newTaskTitle = '';
    String _dropdownValue = '';


    return Container(
      color: const Color(0xFF757575),
      child: Container(
        decoration: const BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.only(
              topLeft: Radius.circular(20.0), topRight: Radius.circular(20.0)),
        ),
        padding: const EdgeInsets.symmetric(horizontal: 60.0, vertical: 30.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: <Widget>[
            const Text(
              'Add a Task',
              textAlign: TextAlign.center,
              style: TextStyle(
                color: Colors.blue,
                fontSize: 30.0,
                fontWeight: FontWeight.w500,
              ),
            ),
            TextField(
              autofocus: true,
              textAlign: TextAlign.center,
              style: const TextStyle(
                fontSize: 25.0,
              ),
              onChanged: (newText) {
                newTaskTitle = newText;
              },
            ),
            TaskSelect(),
            const SizedBox(
              height: 20.0,
            ),
            MaterialButton(
              onPressed: () {
                Provider.of<TaskData>(context, listen: false)
                    .addTask(newTaskTitle);
                Navigator.pop(context);
              },
              color: Colors.blue,
              child: const Text(
                'Add',
                style: TextStyle(
                  fontSize: 20.0,
                ),
              ),
              textColor: Colors.white,
              height: 50.0,
            )
          ],
        ),
      ),
    );
  }
}

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

  @override
  State<TaskSelect> createState() => _TaskSelectState();
}

class _TaskSelectState extends State<TaskSelect> {
  String dropdownValue = 'Select a task';
  String newTaskTitle = '';

  @override
  Widget build(BuildContext context) {
    return DropdownButton<String>(
      value: dropdownValue,
      icon: const Icon(Icons.arrow_downward),
      elevation: 16,
      style: const TextStyle(color: Colors.blueAccent),
      underline: Container(
        height: 2,
        color: Colors.blueAccent,
      ),
      onChanged: (String? newValue) {
        setState(() {dropdownValue = newValue!;});
        newTaskTitle = dropdownValue;

      },
      items: <String>[
        'Task 1',
        'Task 2',
        'Task 3',
      ]
          .map<DropdownMenuItem<String>>((String value) {
        return DropdownMenuItem<String>(
          value: value,
          child: Text(value),
        );
      }).toList(),
    );
  }
}

Answer 1

您的问题是如何访问从另一个选择的值class

您可以通过多种方式实现这一目标一种是让小部件接受一个变量（这是您的 titleText），当它在 class（小部件）（TaskSelcted）中发生更改时，它将更改另一个 class（小部件）中的变量值（添加任务屏幕)

class TaskSelect extends StatefulWidget {

//Telling the class you will get a value of  string when ever someone used ue
      String? taskTitle;
      TaskSelect({Key? key, required this.taskTitle}) : super(key: key);
    
      @override
      State<TaskSelect> createState() => _TaskSelectState();
    }

.

//Telling the class here you are being used, this is the value you are promised to get. you can change its value as i tell you
TaskSelect(newTaskTitle),
            const SizedBox(
              height: 20.0,
            ),

.

onChanged: (String? newValue) {
        setState(() {dropdownValue = newValue!;});

//Change the variable you took to this value
        widget.textTitle = dropdownValue;
}

将下拉按钮选择放入 to-do 列表

Placing dropdownbutton selections into a to-do list

flutter

dart

flutter-dropdownbutton