颤振中的下拉菜单

Question

我尝试构建一个下拉按钮和一个菜单，其中的值将从下拉菜单中选择。代码如下：

String valueChoose;
 List listItem = ["A", "B", "C", "D", "E"];

DropdownButton(
 hint: Text('Associate'),
 dropdownColor: Colors.white,
 icon: Icon(Icons.arrow_drop_down),
 iconSize: 20.0,
 style: TextStyle(
 fontSize: 22.0,
 color: Colors.black,
 ),
 value: valueChoose,
 onChanged: (newValue) {
 setState(() {
 valueChoose = newValue;
 });
 },
 items: listItem.map((valueItem){
 return DropdownMenuItem(
  value: valueItem,
  child: Text(valueItem),
  );
  }).toList(),
 ),

我遇到的错误是在设置状态下，我已将 newValue 分配给 valueChoose。

A value of type 'Object?' can't be assigned to a variable of type 'String'.
Try changing the type of the variable, or casting the right-hand type to 'String'.

这是在设置状态下分配的新值出现的错误。请对此提供帮助，在此先感谢！

下面是代码，包括 AlertDailog:

  class HomeScreen extends StatefulWidget {
   @override
   _HomeScreenState createState() => _HomeScreenState();
   }
    
   class _HomeScreenState extends State<HomeScreen> {
   String ? valueChoose;
    List listItem = [
        "A", "B", "C", "D", "E"
      ];
     void assignPopup(BuildContext context) {
     var alertDialog = AlertDialog(
      content: 
          Column(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: [
          Row(
          children:[
          Container(
          child: Text(
          'Action',
          ),
          ),
          ]
          ),
          Row(
          children:[
          Container(
          child: Card(
          elevation: 5.0,
          shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(10.0),
          ),
          child: TextField(
          decoration: InputDecoration(
          labelText: 'Please add any comments',
          ),
          ),
          ),
          ),
          ]
          ),
          Row(
          children:[
          Container(
          child: Text(
          'Assign To',
           ),
           ),
           ]
           ),
           Row(
           children: [
           Container(
           child: Card(
           elevation: 5.0,
           shape: RoundedRectangleBorder(
           borderRadius: BorderRadius.circular(10.0),
           ),
           child: DropdownButton<String>(
           hint: Text('Associate'),
           dropdownColor: Colors.white,
           icon: Icon(Icons.arrow_drop_down),
           iconSize: 40.0,
           style: TextStyle(
           fontSize: 18.0,
           color: Colors.black,
           ),
           value: valueChoose,
           onChanged: (newValue) {
           setState(() {
           valueChoose = newValue;
           });
           },
           items: listItem.map<DropdownMenuItem<String>>((valueItem){
           return DropdownMenuItem(
           value: valueItem,
           child: Text(valueItem),
            );
            }).toList(),
            ),
            ),
            ),
            ],
            ),
           ],
          ),
          );
          showDialog(
          context: context,
          builder: (BuildContext context) {
          return alertDialog;
           }
          );
        }
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
              ...
              ...
         Container(
         child: TextButton(
         onPressed: (){
         assignPopup(context);
         },
         child: Text(
         'Assign',
          ),
          ),
          ),
         );
       }
      }

Answer 1

指定 DropdownButton 和 map

的类型

String? valueChoose;
  List listItem = ["A", "B", "C", "D", "E"];

DropdownButton<String>(
            hint: Text('Associate'),
            dropdownColor: Colors.white,
            icon: Icon(Icons.arrow_drop_down),
            iconSize: 20.0,
            style: TextStyle(
              fontSize: 22.0,
              color: Colors.black,
            ),
            value: valueChoose,
            onChanged: (newValue) {
              setState(() {
                valueChoose = newValue;
              });
            },
            items: listItem.map<DropdownMenuItem<String>>((valueItem) {
              return DropdownMenuItem(
                value: valueItem,
                child: Text(valueItem),
              );
            }).toList(),
          )

Answer 2

在 build 方法之外声明变量。

 String? valueChoose;
  List listItem = ["A", "B", "C", "D", "E"];

在构建方法中添加 Dropdown 小部件，因此完整状态 class 代码如下所示，

class _DropdownViewState extends State<DropdownView> {
  String? valueChoose;
  List listItem = ["A", "B", "C", "D", "E"];

  @override
  Widget build(BuildContext context) {
    return DropdownButton<String>(
      hint: Text('Associate'),
      dropdownColor: Colors.white,
      icon: Icon(Icons.arrow_drop_down),
      iconSize: 20.0,
      style: TextStyle(
        fontSize: 22.0,
        color: Colors.black,
      ),
      value: valueChoose,
      onChanged: (String? newValue) {
        setState(() {
          valueChoose = newValue;
        });
      },
      items: listItem.map<DropdownMenuItem<String>>((valueItem){
        return DropdownMenuItem(
          value: valueItem,
          child: Text(valueItem),
        );
      }).toList(),
    );
  }

Answer 3

根据您提供的数据，我创建了一个示例，其中我使用了警报对话框，其中有一个下拉菜单

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: HomeScreen(),
    );
  }
}

class HomeScreen extends StatefulWidget {
  @override
  _HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  String valueChoose;
  List listItem = ["A", "B", "C", "D", "E"];

  void assignPopup(BuildContext context) {
    showDialog(
        context: context,
        builder: (BuildContext context) {
          return StatefulBuilder(builder: (context, setState) {
            return AlertDialog(
              content: Column(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: [
                  Row(children: [
                    Container(
                      child: Text(
                        'Action',
                      ),
                    ),
                  ]),
                  Row(children: [
                    Expanded(
                      child: Container(
                        child: Card(
                          elevation: 5.0,
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(10.0),
                          ),
                          child: TextField(
                            decoration: InputDecoration(
                              labelText: 'Please add any comments',
                            ),
                          ),
                        ),
                      ),
                    ),
                  ]),
                  Row(children: [
                    Container(
                      child: Text(
                        'Assign To',
                      ),
                    ),
                  ]),
                  Row(
                    children: [
                      Container(
                        child: Card(
                          elevation: 5.0,
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(10.0),
                          ),
                          child: DropdownButton<String>(
                            hint: Text('Associate'),
                            dropdownColor: Colors.white,
                            icon: Icon(Icons.arrow_drop_down),
                            iconSize: 40.0,
                            style: TextStyle(
                              fontSize: 18.0,
                              color: Colors.black,
                            ),
                            value: valueChoose,
                            onChanged: (newValue) {
                              setState(() {
                                valueChoose = newValue;
                              });
                            },
                            items: listItem
                                .map<DropdownMenuItem<String>>((valueItem) {
                              return DropdownMenuItem(
                                value: valueItem,
                                child: Text(valueItem),
                              );
                            }).toList(),
                          ),
                        ),
                      ),
                    ],
                  ),
                ],
              ),
            );
          });
        });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Container(
          child: TextButton(
            onPressed: () {
              assignPopup(context);
            },
            child: Text(
              'Assign',
            ),
          ),
        ),
      ),
    );
  }
}

所以在这里为了改变下拉值，你必须使用 StatefulBuilder 来改变你的下拉值。您可以查看上面的示例并根据需要进行更改。

请运行检查所需输出的代码。

如果有效请告诉我。

颤振中的下拉菜单

Dropdown menu in flutter

dart

dropdown

flutter