FutureBuilder加载数据时无法显示循环进度指示器

时间:2019-06-04 07:28:43

标签: flutter

当我在Future Builder中加载数据时,我试图显示“循环进度指示器”,我尝试了两种添加方法,但是两种方法均无效。如何获得理想的结果?

我的代码



class _MyHomePageState extends State<MyHomePage>{

  @override MyHomePage get widget => super.widget;

 @override
  Widget build(BuildContext context){

//To show the ListView inside the Future Builder
     Widget createTasksListView(BuildContext context, AsyncSnapshot snapshot) {
     var values = snapshot.data;
     return  ListView.builder(
       itemCount: values == null ? 0 : values.length,
       itemBuilder: (BuildContext context, int index) {

         return values.isNotEmpty ? Ink(
          .....
         )  :  new CircularProgressIndicator();   //TRIED TO ADD CIRCULAR INDICATOR HERE 
       },
     );
   }


//Future Builder widget 
   Column cardsView = Column(
      children: <Widget>[...
        Expanded(
          child: FutureBuilder(
              future: //API CALL,
              initialData: [],
              builder: (context, snapshot) {
                if (!snapshot.hasData) return Center(child: CircularProgressIndicator());  //CIRCULAR INDICATOR
                return createTasksListView(context, snapshot);
              }),
        ),
      ],
   );
   return Scaffold(
      ...);
 }
}

1 个答案:

答案 0 :(得分:2)

尝试:

        FutureBuilder(
              future: //API CALL,
              initialData: [],
              builder: (context, snapshot) {
                if (!snapshot.hasData || snapshot.data.isEmpty) 
                    return Center(child: CircularProgressIndicator());  //CIRCULAR INDICATOR
                else
                    return createTasksListView(context, snapshot);
              }),
        ),

当future的值是一个空列表(即您的initialData)时,您正在渲染具有0个项目的ListView,因此无法在其itemBuilder中渲染CircularProgressIndicator。