颤振:下拉菜单中所选值不变

时间:2019-11-17 14:14:29

标签: flutter dart

我是Flutter的新手。我有一个功能,可以向页面动态添加一个下拉菜单。我有一个小问题。所选值似乎未正确更改,但下拉菜单中未显示该值,我可以检索它。

(抱歉,由于此处无法上网,我无法插入屏幕截图,如果您不明白我的意思,我会再试一次)

那么如何更改和显示默认值?

这是我的代码:

import 'package:flutter/material.dart';

import '../../components/my_flat_button.dart';
import 'question2.dart';

class Question1 extends StatefulWidget {
  @override
  Question1State createState() {
    return Question1State();
  }
}

class Question1State extends State<Question1> {
  final _formKey = GlobalKey<FormState>();
  String dropdownValue = "one";
  int index = 0;
  List<Widget> v = [];

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Builder(
            builder: (context) => Scrollbar(
                    child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        crossAxisAlignment: CrossAxisAlignment.center,
                        children: <Widget>[
                      Padding(
                        padding: EdgeInsets.all(25.0),
                        child: Container(
                          height: MediaQuery.of(context).size.height / 1.2,
                          width: MediaQuery.of(context).size.width,
                          padding: EdgeInsets.all(25.0),
                          decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(10.0),
                            color: Colors.teal[100],
                          ),
                          child: Form(
                            key: _formKey,
                            child: Column(
                              mainAxisSize: MainAxisSize.max,
                              mainAxisAlignment: MainAxisAlignment.center,
                              crossAxisAlignment: CrossAxisAlignment.center,
                              children: <Widget>[
                                SizedBox(height: 20),
                                Column(children: v),
                                SizedBox(height: 15),
                                Row(
                                  mainAxisSize: MainAxisSize.max,
                                  children: <Widget>[
                                    Expanded(
                                      child: 
                                      MyFlatButton('Add more', (){
                                        setState(() {
                                          buildDropdown();             
                                        });                                      
                                      }, Colors.grey, borderColor: Colors.grey[400],),
                                    ),
                                  ],
                                ),
                                SizedBox(height: 15),
                                Row(
                                  mainAxisSize: MainAxisSize.max,
                                  children: <Widget>[
                                    Expanded(
                                      child: 
                                      MyFlatButton('Skip', (){
                                        setState(() {
                                            Navigator.push(
                                              context,
                                              MaterialPageRoute(
                                                  builder: (context) =>
                                                      Question2()),
                                            );            
                                        });                                      
                                      }, Colors.grey, borderColor: Colors.grey[400],),
                                    ),
                                  ],
                                ),

                                SizedBox(height: 40),
                              ],
                            ),
                          ),
                        ),
                      )
                    ]))));
  }

  buildDropdown() {
    if(index >= 2) return;
    v.add( Container(
                height: 38,
                padding: EdgeInsets.only(left: 5.0, right: 5.0, top: 0, bottom: 0),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(10.0),
                  color: Colors.grey[100],
                ),                
                child: Row(
                  mainAxisSize: MainAxisSize.max,
                  children: <Widget>[
                  Expanded(
                    child: DropdownButton<String>(
                      isExpanded: true,
                      value: dropdownValue,
                      icon: Icon(Icons.arrow_drop_down),
                      iconSize: 24,
                      elevation: 16,
                      style: TextStyle(
                        color: Colors.grey
                      ),
                      underline: Container(
                        height: 0,
                        color: Colors.grey,
                      ),
                      onChanged: (String newValue) {
                        setState(() {
                          dropdownValue = newValue;
                        });
                      },
                      items: <String>["one", "tow", "three"]
                        .map<DropdownMenuItem<String>>((String value) {
                          return DropdownMenuItem<String>(
                            value: value,
                            child: Text(value),
                          );
                        })
                        .toList(),
                    ),
                  ),  
                ],),
              ),
    );
    v.add(SizedBox(height: 10),);
    index += 1;
  }

}

1 个答案:

答案 0 :(得分:0)

您不应该使用DropdownItem函数构建map,因为在调用DropDownButtonsetState会重新构建为默认状态,而不是构建分隔列表然后附加到{{1} }。

请使用此代码。

DropDownButton

然后像这样使用它

var dropdownItems = []

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

// Changes occures here
final List<String> strings = ["one", "tow", "three"];
strings.forEach((s){
dropdownItems.add(
DropdownMenuItem<String>(
       value: s,
      child: Text(s),));
});
    }