android-Flutter-ListView溢出

android-Flutter-ListView溢出,第1张

概述FlutterOverflowwidgetpicture我想设计一个小部件的ListView,每个小部件都有一个存储信息的容器.我尝试使用ListView,但是容器没有出现在屏幕上,所以我切换到Row,它们出现了,但是它们不能超过容器的最大宽度.您能建议如何管理图片中的ListView吗?这是我的代码:classNewsPage

Flutter Overflow widget picture

我想设计一个小部件的ListVIEw,每个小部件都有一个存储信息的容器.我尝试使用ListVIEw,但是容器没有出现在屏幕上,所以我切换到Row,它们出现了,但是它们不能超过容器的最大宽度.您能建议如何管理图片中的ListVIEw吗?
这是我的代码:

class NewsPage extends StatelessWidget {@overrIDeWidget build(BuildContext context) {Widget buildbuttonscore= Container(  height: 100.0,  wIDth: 100.0,  decoration: Boxdecoration(borderRadius: borderRadius.circular(20.0),color: colors.white),  child: Flatbutton(    padding: EdgeInsets.only(top: 20.0),    child: Column( // Replace with a Row for horizontal icon + text      children: <Widget>[        Iconbutton(            icon: Icon(Icons.add_circle_outline,size: 30.0,color: colors.blue),            onpressed: () {              Navigator.push(                  context,                  MaterialPageRoute(                      builder: (context) => PointPage()                  )              );            }        ),        Text("Đặt hàng",style: TextStyle(color: colors.black),)      ],    ),  ),);Widget buildbuttonOrder= Container(  height: 100.0,  wIDth: 100.0,  decoration: Boxdecoration(borderRadius: borderRadius.circular(20.0),color: colors.white),  child: Flatbutton(    padding: EdgeInsets.only(top: 20.0),    child: Column( // Replace with a Row for horizontal icon + text      children: <Widget>[        Iconbutton(            icon: Icon(Icons.shopPing_cart,size: 30.0,color: colors.blue),            onpressed: () {              Navigator.push(                  context,                  MaterialPageRoute(                      builder: (context) => PointPage()                  )              );            }        ),        Text("Đặt hàng",style: TextStyle(color: colors.black),)      ],    ),  ),);Widget buildbuttonPurse = Container(  height: 100.0,  wIDth: 100.0,  decoration: Boxdecoration(borderRadius: borderRadius.circular(20.0),color: colors.white),  child: Flatbutton(    padding: EdgeInsets.only(top: 20.0),    child: Column( // Replace with a Row for horizontal icon + text      children: <Widget>[        Iconbutton(            icon: Icon(Icons.monetization_on,size: 30.0,color: colors.blue),            onpressed: () {              Navigator.push(                  context,                  MaterialPageRoute(                      builder: (context) => PointPage()                  )              );            }        ),        Text("Ví tiền",style: TextStyle(color: colors.black),)      ],    ),  ),);//button ColumnWidget buttonRow = Container(  padding: const EdgeInsets.only(bottom: 10.0),  margin: EdgeInsets.symmetric(vertical: 10.0),  child: Row(    mainAxisAlignment: MainAxisAlignment.spaceEvenly,    children: [      buildbuttonscore,      buildbuttonOrder,      buildbuttonPurse,    ],  ),);//OFFERROWWidget offer1 = Container(  height: 150.0,  wIDth: 180.0,  decoration: Boxdecoration(borderRadius: borderRadius.circular(20.0),color: colors.white30),  child: Flatbutton(    padding: EdgeInsets.only(top: 0.0),    child: Column(       children: <Widget>[        new Image.asset('images/Q.png',height: 90.0,fit: BoxFit.fitWIDth,wIDth: 180.0,),        Text("Các cô gái đẹp đang chờ bạn đó!!!",style: TextStyle(color: colors.black),)      ],    ),  ),);Widget offer2 = Container(  height: 150.0,  wIDth: 180.0,  decoration: Boxdecoration(borderRadius: borderRadius.circular(20.0),color: colors.white30),  child: Flatbutton(    padding: EdgeInsets.only(top: 0.0),    child: Column( // Replace with a Row for horizontal icon + text      children: <Widget>[        new Image.asset('images/Nina.gif',height: 90.0,fit:BoxFit.fitWIDth,wIDth: 180.0,),        Text("Hãy nhanh tay sở hữu vé xem phim Goddess Kiss!",style: TextStyle(color: colors.black),)      ],    ),  ),);Widget offerRow = Row(  //shrinkWrap: true,  //scrollDirection: Axis.horizontal,  mainAxisAlignment: MainAxisAlignment.spaceEvenly,  children: <Widget>[    Row(      children: [        offer1,        VerticaldivIDer(),        offer2,      ],    ),  ],);Widget newsRow = Container(  padding: EdgeInsets.only(top: 10.0),  child: Container(    color: colors.transparent,    margin: EdgeInsets.symmetric(vertical: 20.0),    height: 125.0,    child: ListVIEw(      scrollDirection: Axis.vertical,      children: <Widget>[        new NewsBody(),      ],    ),  ),);// Todo: implement buildreturn Container(  child: ListVIEw(    scrollDirection: Axis.vertical,    children: <Widget>[      buttonRow,      new Text('Dành cho bạn',style: TextStyle( FontSize: 20.0, FontWeight: FontWeight.w400),),      offerRow,      new Text('Tin tức',style: TextStyle( FontSize: 20.0, FontWeight: FontWeight.w400),),      newsRow,    ],  ),);

}

}

我收到错误:

Pic1

Pic2

Pic3

Pic4

Pic5

解决方法:

使用scrollDirection:Axis.horizo​​ntal将代码添加到SingleChildScrollVIEw中,或替换为以下代码

Widget offerRow = new SingleChildScrollVIEw(scrollDirection: Axis.horizontal,child: Row(  //shrinkWrap: true,  //scrollDirection: Axis.horizontal,  mainAxisAlignment: MainAxisAlignment.spaceEvenly,  children: <Widget>[    Row(      children: [        offer1,        VerticaldivIDer(),        offer2,      ],    ),  ],),);
总结

以上是内存溢出为你收集整理的android-Flutter-ListView溢出全部内容,希望文章能够帮你解决android-Flutter-ListView溢出所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1092183.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-27
下一篇 2022-05-27

发表评论

登录后才能评论

评论列表(0条)

保存