Flutter 下拉按钮<;字符串>;更改后不更改值

Flutter 下拉按钮<;字符串>;更改后不更改值,flutter,flutter-layout,Flutter,Flutter Layout,我正在使用一个下拉按钮,我创建了一个showModalBottomSheet,每当我按下Add按钮时都会调用它。在这些表单中,我插入了一些文本字段和一个下拉按钮。此表中的数据将发送到firestore我可以成功创建下拉按钮。但按下时,它不会更改为我选择的值。 职能: void _CreateButtons(context){ TextEditingController _buttonName = TextEditingController(); TextEditingContr

我正在使用一个下拉按钮,我创建了一个showModalBottomSheet,每当我按下Add按钮时都会调用它。在这些表单中,我插入了一些文本字段和一个下拉按钮。此表中的数据将发送到firestore
我可以成功创建下拉按钮。但按下时,它不会更改为我选择的值。
职能:

void _CreateButtons(context){

    TextEditingController _buttonName = TextEditingController();
    TextEditingController _comodoName = TextEditingController();
    String _iconName;
    var _icons = ['None', 'Lock', 'LightBulb', 'Check', 'Cold', 'Alarm', 'Television', 'Bed'];
    var _formKey = GlobalKey<FormState>();

    showModalBottomSheet(context: context, builder: (BuildContext bc){
      return Center(
        child: Container(
          color: Colors.black.withOpacity(0.3),
          height: MediaQuery.of(context).size.height * 0.6,
          child: Padding(
            padding: const EdgeInsets.fromLTRB(12, 20, 12, 20),
            child: Column(
              children: [
                Form(
                  key: _formKey,
                    child: Column(
                      children: [
                        TextFormField(
                        maxLines: 1,
                        maxLength: 10,
                        controller: _buttonName,
                        textAlign: TextAlign.center,
                        decoration: InputDecoration(
                          hintText: "Button name",
                          enabledBorder: OutlineInputBorder(
                            borderRadius: new BorderRadius.circular(25.0),
                            borderSide: new BorderSide(),
                          ),
                          focusedBorder: OutlineInputBorder(
                            borderRadius: new BorderRadius.circular(25.0),
                            borderSide: new BorderSide(color: Colors.blue),
                          ),
                        ),
                        validator: (val){
                        if (val.length == 0){
                          return "Button name cannot be empty";
                        }else{
                          return null;
                        }
                        },
                      ),
                      SizedBox(height: 20),
                      TextFormField( 
                        maxLines: 1,
                        maxLength: 20,                       
                        textAlign: TextAlign.center,
                        controller: _comodoName,
                        decoration: new InputDecoration(
                          hintText: "Room name",
                          enabledBorder: OutlineInputBorder(
                            borderRadius: new BorderRadius.circular(25.0),
                            borderSide: new BorderSide(),
                          ),
                          focusedBorder: OutlineInputBorder(
                            borderRadius: new BorderRadius.circular(25.0),
                            borderSide: new BorderSide(color: Colors.blue),
                          ),
                        ),
                        validator: (val){

                        },
                      ),
                    ],
                  ),
                ),
                DropdownButton<String>(
                  items: _icons.map((String dropDownStringItem) {
                    return DropdownMenuItem<String>(
                      value: dropDownStringItem,
                      child: Row(
                        children: [
                          Icon(getIconData(dropDownStringItem)),
                          Text(dropDownStringItem),
                        ],
                      ),
                    );
                  }).toList(),

                  onChanged: (String name){
                    setState(() {
                      _iconName = name;
                    });
                  },
                  value: _iconName,
                ),

_CreateButtons在stagefule小部件中。

问题是您使用了函数来呈现UI和存储状态。但当您调用
setstate
时,它会重新构建StatefulWidget的所有UI。这就是为什么您的函数-
\u CreateButtons
再次使用相同的值调用。这就是为什么,您应该将所有底页代码添加到不同的
StatefulWidget
,以正确处理状态

  • 将代码移动到任何StatefulWidget:
  • 类MyCustomBottomSheet扩展StatefulWidget{
    createState()=>_MyCustomBottomSheetState();
    }
    类_MyCustomBottomSheetState扩展状态{
    TextEditingController_buttonName=TextEditingController();
    TextEditingController_comodoName=TextEditingController();
    字符串_i图标名;
    变量图标=[“无”、“锁”、“灯泡”、“检查”、“冷”、“报警”、“电视”、“床”];
    var_formKey=GlobalKey();
    小部件构建(构建上下文){
    返回中心(///生成按钮的UI代码);
    }
    }
    
  • 并在按下
    FloatingActionButton
    时调用此小部件,如下所示:
  • floatingAction按钮(
    背景颜色:颜色(0xFF0F52BA),
    onPressed:()=>showModalBottomSheet(上下文:上下文,生成器:(ctx)=>MyCustomBottomSheet()),
    子:图标(Icons.add),
    )
    
    问题在于您使用了函数来呈现UI和存储状态。但当您调用
    setstate
    时,它会重新构建StatefulWidget的所有UI。这就是为什么您的函数-
    \u CreateButtons
    再次使用相同的值调用。这就是为什么,您应该将所有底页代码添加到不同的
    StatefulWidget
    ,以正确处理状态

  • 将代码移动到任何StatefulWidget:
  • 类MyCustomBottomSheet扩展StatefulWidget{
    createState()=>_MyCustomBottomSheetState();
    }
    类_MyCustomBottomSheetState扩展状态{
    TextEditingController_buttonName=TextEditingController();
    TextEditingController_comodoName=TextEditingController();
    字符串_i图标名;
    变量图标=[“无”、“锁”、“灯泡”、“检查”、“冷”、“报警”、“电视”、“床”];
    var_formKey=GlobalKey();
    小部件构建(构建上下文){
    返回中心(///生成按钮的UI代码);
    }
    }
    
  • 并在按下
    FloatingActionButton
    时调用此小部件,如下所示:
  • floatingAction按钮(
    背景颜色:颜色(0xFF0F52BA),
    onPressed:()=>showModalBottomSheet(上下文:上下文,生成器:(ctx)=>MyCustomBottomSheet()),
    子:图标(Icons.add),
    )
    
    我该如何执行该操作,请您删除
    CreateButtons
    函数并将其中的所有代码移动到新的
    StatefulWidget
    ,例如名为
    MyCustomBottomSheet
    。在这种情况下,您的状态将正常工作。但我的返回将是一个
    showModalBottomSheet(context,bc)
    ?我已经在上面的答案中添加了示例。我如何执行该操作,请您删除
    CreateButtons
    函数,并将其中的所有代码移动到新的
    StatefulWidget
    ,例如名为
    MyCustomBottomSheet
    。在这种情况下,您的状态将正常工作。但我的返回将是一个
    showModalBottomSheet(context,bc)
    ?我在上面的回答中添加了示例。
    Padding(
                      padding: EdgeInsets.only(left: screenSize/1.2, top: screenSize*1.7),
                      child: FloatingActionButton(
                        backgroundColor: Color(0xFF0F52BA),
                        onPressed: (){
                          _CreateButtons(context);
                        },
                        child: Icon(Icons.add),
                      )
                    ),