Far*_*ana 3 android dart flutter
在设计中,我使用Expanded将屏幕分为三部分,但在第二部分中,textfield当用户尝试输入某些像素溢出设计时,我一直在尝试使用SingleChildScrollViewExpanded与容器小部件一起使用,以消除渲染问题但我的设计消失了。
return Scaffold(
body: Stack(
children: <Widget>[
Container(
decoration: _buildBackground(),
),
Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
mainAxisSize: MainAxisSize.max,
children: <Widget>[
Expanded(
flex: 13,
//child:_toolBar('VENUE LOGIN')
child:MyWidget(headerText: 'Player Option',)
),
Expanded(
flex: 70,
child: Container(
margin: EdgeInsets.only(top: width*0.03),
decoration: BoxDecoration(color: Colors.transparent),child: PlayerOptionContainer(),),
),
Expanded(
flex: 17,
child: _bottomView1(width),
),
],
)
],
),
);
Run Code Online (Sandbox Code Playgroud)
PlayerOptionWidget方法
Widget PlayerOptionContainer(){
return Column(
children: <Widget>[
Expanded(flex:25,
child: Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Expanded(flex: 30,child: _logoContainer(width),),
Expanded(flex: 70,child: searchContainer(),),
],),),
Expanded(flex:75,child: Container(
decoration: BoxDecoration(color: Colors.transparent),
child: GridView.count(
crossAxisCount: 3,
children: List.generate(20, (index) {
return Container(
margin: EdgeInsets.only(left: width*0.02, bottom: width*0.02, right: width*0.02),
decoration: BoxDecoration(
color: MyColors.yellowBg,
borderRadius: new BorderRadius.circular(12.0),
),
child: Center(child: MyFeedTile(),),
);
}),
),
),)],
);
}
Run Code Online (Sandbox Code Playgroud)
这是试图实现的设计
但是它溢出了一些像素
常见问题。有几种解决方案
Stack)包裹在SingleChildScrollViewresizeToAvoidBottomInset参数Scaffold:Scaffold(
resizeToAvoidBottomInset: false, ... )
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
77 次 |
| 最近记录: |