dart 从模态底部表单弹出后更新我的状态

ewm0tg9j  于 2023-01-28  发布在  其他
关注(0)|答案(2)|浏览(132)

我使用一个模态底部表作为我的下拉列表,但我不知道如何在通过Navigator.pop从底部工作表返回后更新状态()。显然Modal类不支持setState。我很乐意接受任何人可以为这个问题给予的任何帮助。除了selectedlang更新的文本之外的所有内容都可以工作。应用程序设置的实际语言确实发生了变化,只是文本没有更新以向用户显示。

import 'package:flutter/material.dart';
import 'splash.dart' show lang;
import 'package:shared_preferences/shared_preferences.dart';

String selectedlang;

class LangSelect extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _LangSelectState();
}

class _LangSelectState extends State<LangSelect> {
  void setLangDefault() {
    selectedlang = "English";
    lang = 'en';
  }

  void initState() {
    super.initState();
    setLangDefault();
  }

  Modal modal = Modal();

  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: Colors.white,
        body: WillPopScope(
          onWillPop: () async {
            Future.value(false);
          },
          child: Column(
            children: <Widget>[
              Image.asset('assets/splash_logo.jpg'),
              Center(
                  child: Column(
                mainAxisSize: MainAxisSize.max,
                children: <Widget>[
                  Text('Welcome',
                      style:
                          TextStyle(fontSize: 40, fontWeight: FontWeight.bold)),
                  Text(''),
                  Text(''),
                  Text(
                    "Select a language.",
                    style: TextStyle(fontStyle: FontStyle.italic),
                  ),
                  Text(''),
                  Container(
                      width: 120,
                      height: 30,
                      decoration: BoxDecoration(
                          color: Colors.grey[300],
                          border: Border.all(
                              color: Colors.black,
                              width: 1,
                              style: BorderStyle.solid),
                          borderRadius: BorderRadius.all(Radius.circular(20))),
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        mainAxisSize: MainAxisSize.min,
                        children: <Widget>[
                          Text(selectedlang),
                          IconButton(
                            padding: EdgeInsets.fromLTRB(25, 2, 2, 2),
                            icon: Icon(Icons.arrow_drop_down),
                            onPressed: () => modal.mainBottomSheet(context),
                          )
                        ],
                      ))
                ],
              )),
            ],
          ),
        ));
  }
}

class Modal {
  mainBottomSheet(BuildContext context) {
    showModalBottomSheet(
        context: context,
        builder: (BuildContext context) {
          return Column(
            mainAxisSize: MainAxisSize.min,
            children: <Widget>[
              _createTile(context, 'English', _action1),
              _createTile(context, 'Español', _action2),
            ],
          );
        });
  }

  ListTile _createTile(BuildContext context, String name, Function action) {
    return ListTile(
      title: Text(
        name,
        textAlign: TextAlign.center,
      ),
      onTap: () {
        Navigator.pop(context);
        action();
      },
    );
  }

  _action1() {
    lang = 'en';
    selectedlang = "English";
    print(lang);
  }

  _action2() {
    lang = 'sp';
    selectedlang = "Español";
    print(lang);
  }
}
2sbarzqh

2sbarzqh1#

我解决这个问题的方法是从Modal类中删除mainBottomSheet,就像一个onPressed()=〉void一样调用它,然后我就可以把setState放到我的动作中。

guykilcj

guykilcj2#

偶然发现了相同的问题,并通过调用一个通过.then设置状态的方法修复了该问题
示例:

showModalBottomSheet(
              context: context,
              builder: (context) => _Your_Bottom_Sheet_Widget(),
            ).then((value) => rebuild());

调用方法rebuild(),看起来如下所示:

void rebuild() {
setState(() {});
}

相关问题