如何刷新小部件?

时间:2019-07-12 10:10:13

标签: flutter

我想在上载文件后“刷新”我的窗口小部件。

new Container(
      child: _profileAvatar(),
      width: 150.0,
       height: 150.0,
),

Widget _profileAvatar(){
  if(!hasProfilImage){
    return CircleAvatar(
      radius: 30.0,
      backgroundImage:
      new ExactAssetImage('assets/images/default_profile.png'),
      backgroundColor: Colors.transparent,
    );
  }else {
    return CircleAvatar(
      radius: 30.0,
      backgroundImage:
      NetworkImage( "${Configuration.url}assets/profileImage/${userProfilImage}"),
      backgroundColor: Colors.transparent,
    );
  }
}

这是我上传文件的方式

Future getImage() async {
    var image = await ImagePicker.pickImage(source: ImageSource.gallery);
    setState(() {
      if(image != null) {
        _image = image;
        hasProfilImage = true;
        _upload();
      }
    });
  }

目前,在上传过程完成后,我需要重新打开此“页面”以查看新图像。

上传过程完成后如何立即显示新图像? 预先感谢

这是我到目前为止尝试的方法,但仍然没有帮助

  Future getImage() async {
    var image = await ImagePicker.pickImage(source: ImageSource.gallery);
    setState(() {
      if(image != null) {
        _image = image;
        _upload().then((isSuccess){
          setState(() {
            hasProfilImage = true;
          });
        });
      }
    });
  }

这是我的完整脚本https://pastebin.com/59UfYa2P

3 个答案:

答案 0 :(得分:0)

无论图像是否成功上传,您的Upload函数都可能返回带有某些值的Future。

Future getImage() async {
var image = await ImagePicker.pickImage(source: ImageSource.gallery);
  if(image != null) {
    _image = image;
    _upload().then((isSuccess){
      // once upload is completed then, call setState and it will rebuild the widget tree and update the view.
      setState(() {
        hasProfilImage = true;
      });
    });
  }
}

答案 1 :(得分:0)

在处理抖动时,可以使用具有StatefulWidget方法的setState。每当您要更新数据时,都要在处理后放置该数据。它将自动在其位置更新。

  

setState((){});

如果另一个小部件具有API调用或函数,则可以使用callback更新小部件。

如果要在处理下一个窗口小部件之后更新前一个窗口小部件,这是回调

_navigateAndDisplayDriverSelection(
  BuildContext context, String userId, String driveId) async {


final driverModal = await Navigator.push(
  context,
  MaterialPageRoute(
      builder: (context) => Drivers(userId: userId, driveId: driveId)),
);

setState(() {});
}

答案 2 :(得分:0)

如果您不想通过小部件树传递setState方法,也可以使用ScopedModels。

此页面提供了有关如何实现作用域模型的简短示例: https://pub.dev/packages/scoped_model

只需知道,每次调用notifylisteners()时,ScopedModelDescendant下的所有内容都会重建。

您面临的问题是国家管理之一,并且还有其他解决方案:https://flutter.dev/docs/development/data-and-backend/state-mgmt