flutter开发页面 使用column或row组件出现overflow问题

由于Row 和 Column 是 Flex 组件,是无法滚动的,如果没有足够的空间,flutter就提示溢出错误。
在这里插入图片描述

return Column(
children:[
	Container(
	  width: 1133,
	  alignment: Alignment.topCenter,
	  child: Row(
	  mainAxisAlignment: MainAxisAlignment.spaceBetween,
	  children: [
	        Container(
	          child: Text('',style: TextStyle(color: Colors.white,fontSize: 20,fontWeight: FontWeight.bold)),
	          width: 560,
	          height: 446,
	          decoration: BoxDecoration(
	            gradient: LinearGradient(
	              begin: Alignment.topLeft,
	              end: Alignment.bottomRight,
	              stops: [0.0,1.0],
	              colors: [Color.fromRGBO(29,110,255,1), Color.fromRGBO(75,177,255,1)]
	            )
	          ),
	        ),
	        Container(
	          child: Text('',style: TextStyle(fontSize: 20,fontWeight: FontWeight.bold)),
	          width: 560,
	          height: 446,
	          decoration: BoxDecoration(
	            color: Colors.white,
	          ),
	        ),
	  ],
	),
	)]
)

这时只要用Expanded组件将外层Container包起来就不会出现黄条了
在这里插入图片描述
但是治标不治本,不能滚动会隐藏一部分,如果需要滚动的话可以使用SingleChildScrollView组件
在SingleChildScrollView外面包一层Container并指定宽高为无限大就可以完美解决这一问题了

return Container(
	height: double.infinity,
    width: double.infinity,
	child:SingleChildScrollView(
		child:Column(...)
	)
);

  • 3
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值