如何从父级的子级小部件显示CircularProgressIndicator（）？

问题描述

我收到来自有状态儿童小部件的网络通话。为此，我需要在包含脚手架的父窗口小部件中显示CircularProgressIndicator。有什么方法可以显示它？

I have a network call from child stateful widget. For that, I need to show CircularProgressIndicator in parent widget containing the Scaffold. Is there any way to show it?

父控件：

class OrderDetailPage extends StatefulWidget {
   @override
  _OrderDetailPageState createState() => _OrderDetailPageState();

}

class _OrderDetailPageState extends State<OrderDetailPage> {
    bool isloading = false;

    Widget build(BuildContext context){
       return Scaffold(body: isLoading ? Center(child: CircularProgressIndicator() : Container(
          child: ChildWidget()
      ));
    }
}

孩子：

class ChildWidget extends StatefulWidget {
  @override
  ChildWidgetState createState() => ChildWidgetState();
}

class ChildWidgetState extends State<OrderDetailPage> {
  return Center(child: RaisedButton(onPressed: () { // need to make isloading in parent widget to true and false})
}

推荐答案

有两种方式传递 State

There are two ways of passing State up into the Widget Tree.

将回调函数从父级传递到子级：

Passing a callback function from parent to child:

class OrderDetailPage extends StatefulWidget {
   @override
  _OrderDetailPageState createState() => _OrderDetailPageState();

}

class _OrderDetailPageState extends State<OrderDetailPage> {
    bool isloading = false;
    Widget build(BuildContext context){
       return Scaffold(body: isLoading ? Center(child: CircularProgressIndicator() : Container(
          child: ChildWidget(callback: () => setState(() => isLoading = !isLoading))
      ));
    }
}

Child：

class ChildWidget extends StatefulWidget {
  ChildWidget({this.callback});
  @override
  ChildWidgetState createState() => ChildWidgetState();
}

class ChildWidgetState extends State<OrderDetailPage> {
  return Center(child: RaisedButton(onPressed: () {
   widget.callback();
}

最新的选择是使用状态管理解决方案例如 InheritedWidget ， Provider 软件包或其他众多软件包之一。

The late alternative is to use a State Management Solution like InheritedWidget , the Provider Package or one of many others out there.

这篇关于如何从父级的子级小部件显示CircularProgressIndicator（）？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！