下拉列表标题不变

时间:2021-06-04 14:47:07

标签: flutter

下拉列表的值在变化,但标题没有变化,只有在我热重载应用时标题才会变化。

   List<String> _states = ['A', 'B', 'C', 'D'];
    String _chosenValue;

    void _showSettingsPanel() {
      showModalBottomSheet(
      context: context,
      builder: (context) {
        return Column(children: [
          DropdownButton(
            hint: Text("Select State"),
            value: _chosenValue,
            onChanged: (newValue) {
              setState(() {
                _chosenValue = newValue;
              });
            },
            items: _states.map((valueItem) {
              return DropdownMenuItem(
                value: valueItem,
                child: Text(valueItem),
              );
            }).toList(),
          ),
        ]);
      },
    );           
  }

2 个答案:

答案 0 :(得分:1)

SetState 不适用于底部表,因此您可以使用 ValueNotifier 来反映底部表中的更改。看看下面的代码。

 class MyHomePage extends StatefulWidget {
  final String title;
  MyHomePage({Key key, this.title}) : super(key: key);

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;
  List<String> _states = ['A', 'B', 'C', 'D'];
  // String _chosenValue;
  ValueNotifier<String> _chosenValue = ValueNotifier<String>("A");
  @override
  void dispose() {
    _chosenValue.dispose();
    super.dispose();
  }

  void _incrementCounter() {
    showModalBottomSheet(
        context: context,
        builder: (context) {
          return Column(
            children: [
              ValueListenableBuilder<String>(
                valueListenable: _chosenValue,
                builder: (BuildContext context, String value, Widget child) {
                  return DropdownButton(
                    hint: Text("Select State"),
                    value: _chosenValue.value,
                    
                    onChanged: (newValue) {
                      setState(() {
                        _chosenValue.value = newValue;
                      });
                    },
                    items: _states.map((valueItem) {
                      return DropdownMenuItem(
                        value: valueItem,
                        child: Text(valueItem),
                      );
                    }).toList(),
                  );
                },
              ),
            ],
          );
        });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.headline4,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ),
    );
  }
}

答案 1 :(得分:1)

使用 StatefulBuilder 在 ModelSheet 中设置状态。请执行以下操作:

 showModalBottomSheet(
                context: context,
                builder: (BuildContext context) {
                  return BottomSheet(
                    onClosing: () {},
                    builder: (BuildContext context) {
                      return StatefulBuilder(
                          builder: (BuildContext context, setState) {
                        return Column(
                          children: [
                            DropdownButton(
                                hint: Text("Select State"),
                                value: _chosenValue,
                                onChanged: (newValue) {
                                  print(newValue);
                                  setState(() {
                                    _chosenValue = newValue.toString();
                                  });
                                },
                                items: _states.map((valueItem) {
                                  return DropdownMenuItem(
                                    
                                    value: valueItem.toString(),
                                    child: Text(valueItem),
                                  );
                                }).toList(),
                              ),
                          ],
                        );
                      });
                    },
                  );
                },
              )
相关问题