[英]How to Position Widgets Independently of Other Widgets in flutter?
I was Trying to Have 3 Widgets in Single page using Column, but for some reason the alignment is not working...我试图使用 Column 在单页中拥有 3 个小部件,但由于某种原因 alignment 无法正常工作......
@override
Widget build(BuildContext context) {
return Container(
height: double.infinity,
child: SwipeDetector(
onSwipeUp: () {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => CreditScreen()));
},
onSwipeDown: () {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => ManualScreen()));
},
child: Scaffold(
backgroundColor: DarkBlue,
resizeToAvoidBottomInset: false,
body: new Container(
height: double.infinity,
alignment: Alignment.center,
child: Column(
//mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Align(
alignment: Alignment.topCenter,
child: Image.asset('assets/swipe_down.gif',
scale: 5,
),
),
new Align(
alignment: Alignment.center,
child: Text("Menu Screen",
style: TextStyle(
color: Colors.white,
fontSize: 30.0,
fontWeight: FontWeight.bold,
),
//textAlign: TextAlign.center,
),
),
new Align(
alignment: Alignment.bottomCenter,
child: Image.asset('assets/swipe_up.gif',
scale: 5,
),
),
],
),
),
),
),
);
}
}
According to the above image, I want the swipe up widget at bottom and swipe down at the top while the text in center, I Tried Many wrapping of Widgets, but nothing seems to work... Any Help...根据上图,我希望在底部向上滑动小部件并在顶部向下滑动,而文本在中心,我尝试了许多小部件的包装,但似乎没有任何效果......任何帮助......
try this:尝试这个:
Column(
//mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Image.asset('assets/swipe_down.gif',
scale: 5,
),
Expanded(
child: Text("Menu Screen",
style: TextStyle(
color: Colors.white,
fontSize: 30.0,
fontWeight: FontWeight.bold,
),
//textAlign: TextAlign.center,
),
),
Image.asset('assets/swipe_up.gif',
scale: 5,
),
],
),
You can use Center widget for aligning widgets in center along with padding widget for giving spaces between the widgets.您可以使用 Center 小部件将小部件居中对齐,并使用填充小部件在小部件之间留出空间。
Scaffold(
backgroundColor: Colors.black,
resizeToAvoidBottomInset: false,
body: new Container(
height: double.infinity,
alignment: Alignment.center,
child:
Center(
child: Column(
children: <Widget>[
Padding(
padding: EdgeInsets.only(top:30),
child: Image.asset('assets/swipe_down.gif'),
),
Padding(
padding: EdgeInsets.only(top:80),
child:
Text("Menu Screen",
style: TextStyle(
color: Colors.white,
fontSize: 30.0,
fontWeight: FontWeight.bold
),
),
),
Padding(
padding: EdgeInsets.only(top:80),
child: Image.asset('assets/swipe_up.gif'),
),
],
),
),
),
),
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.