Flutter futureBuilder 正在渲染未知的褪色卡片

Posted

技术标签:

【中文标题】Flutter futureBuilder 正在渲染未知的褪色卡片【英文标题】:Flutter futureBuilder is rendering unknown faded card 【发布时间】:2021-07-25 09:08:25 【问题描述】:

在我的应用程序中,我使用了一个从网络搜索的部分,我使用了 future 和 futureBuilder 来显示结果,但碰巧在真实设备上结果不是预期的(未知结果),而是在模拟器上的代码块正在按预期工作。

下面是代码

      Expanded(
        child: Container(
          width: double.infinity,
          height: double.infinity,
          child: FutureBuilder<dynamic>(
            future: myHelper.fetchFromServer (params), //JSON from network
            builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) 
              List<Widget> children;
              if (snapshot.hasData) 
                var result = snapshot.data;
                if(result['type']=='success') 
                  List <Widget> list = new List();
                  List<dynamic> feedback = result['feedback'];
                  for(var i=0; i<feedback.length; i++)
                    var bus = feedback[i];
                    list.add(SharedBusCard (
                        name:bus['bus_name'],
                        rate:bus['bus_rate'],
                        seats:bus['bus_seats'],
                        onTap: () 
                          //When taped
                        
                    ));
                    list.add(SizedBox(height: 15));
                  
                  children = list;
                  return ListView(children: children);
                
                else
                  children = <Widget>[
                    Icon(
                      Icons.info_outline,
                      color: Colors.green,
                      size: 60,
                    ),
                    Padding(
                      padding: const EdgeInsets.only(top: 16),
                      child: Text('No result found'),
                    )
                  ];
                
               else if (snapshot.hasError) 
                children = <Widget>[
                  Icon(
                    Icons.error_outline,
                    color: Colors.red,
                    size: 60,
                  ),
                  Padding(
                    padding: const EdgeInsets.only(top: 16),
                    child: Text('There was an error, try again'),
                  )
                ];
               else 
                children = <Widget>[
                  SizedBox(
                    child: CircularProgressIndicator(),
                    width: 60,
                    height: 60,
                  ),
                  const Padding(
                    padding: EdgeInsets.only(top: 16),
                    child: Text('Searching.....'),
                  )
                ];
              

              return Center(
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: children,
                ),
              );


            ,
          ),
        ),
      ),

手机输出

以及模拟器上的输出

请帮我解决这个问题,我不知道哪里出错了,我还很陌生。感谢您的帮助。

【问题讨论】:

这能回答你的问题吗? Why can't a Flutter application connect to the Internet when installing "app-release.apk"? But it works normally in debug mode 否 @ChristopherMoore 我在 androidManifest.xml 中拥有互联网许可,我能够根据需要从互联网上检索手机上的所有其他数据,期待我在这里显示的结果。当我搜索服务器上不存在的文件时,它可以回复,但是当结果存在时,那是我得到那张褪色的空白卡片的时候。我认为渲染有问题。 不,这不是渲染问题。发布模式下的灰色小部件意味着该小部件存在异常。如果您绝对确定它与网络无关,请创建一个最小的、可重现的示例来说明您的问题。 @ChristopherMoore 好的,“发布模式下的灰色小部件意味着该小部件存在异常。”谢谢你,我不知道。我对问题进行了分类,这是一个铸造错误 【参考方案1】:

您是否设置了互联网权限?在调试模式下,您在模拟器上具有 Internet 权限,但对于手机,您必须为 Android 和 ios 设备设置 Internet 权限。

https://flutter.dev/docs/development/data-and-backend/networking

【讨论】:

以上是关于Flutter futureBuilder 正在渲染未知的褪色卡片的主要内容,如果未能解决你的问题,请参考以下文章

Flutter:FutureBuilder 中的异步调用

Flutter + SharedPreferences:如何使用 FutureBuilder

Flutter Futurebuilder 被修改

Flutter:不清楚 ValueChanged 和 FutureBuilder

使用 Mockito 的 FutureBuilder 快照数据为空 - Flutter

Flutter 使用 FutureBuilder 检索列表中的数据