[英]Flutter: How can i put the text widget center in screen
我需要將標題放在中心,甚至適合任何屏幕,我知道我可以調整框的大小以將標題移動到中心,但是當使用不同的設備時,尺寸肯定會改變並成為不同位置的標題。 這是代碼:
class NotificationDoctor extends StatelessWidget {
TextStyles textStyles = TextStyles.HEADING;
Texts texts;
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Container(
decoration: BoxDecoration(
color: Theme.of(context).primaryColorDark,
borderRadius: BorderRadius.only(bottomLeft: Radius.circular(15.0))),
height: 130.h,
child: Padding(
padding: EdgeInsets.only(top: 40.h),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Padding(
padding: EdgeInsets.only(
right: 15.w,
top: 15.h,
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.start,
children: [
FlatButton(
child: ArrowIcon(
arrowColor: Color(0xFFEEF4F9),
backgroundColor:
Theme.of(context).primaryColor.withOpacity(.9),
),
onPressed: () {
Navigator.pop(context);
},
),
// SizedBox(
// width: 55,
// ),
Center(
child: Texts(
'Notifications',
style: TextStyles.HEADING,
color: Color(0xFFEEF4F9),
),
),
],
),
),
],
),
),
),
));
}
}
您只需像這樣更改中心的mainAxisAlignment
mainAxisAlignment: MainAxisAlignment.center,
完整代碼
Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
// SizedBox(
// width: 55,
// ),
Center(
child: Text(
'Notifications',
),
),
],
),
如果您只希望標題居中,則使用Stack
小部件並將標題小部件包裝在Align
小部件中,如下所示
Stack(
children: [
Padding(
padding: const EdgeInsets.only(left: 8.0),
child: Icon(Icons.arrow_back),
), // icon,
Align(
alignment: Alignment.center,
child: Text(
'Notifications',
),
),
],
)
像這樣使用填充
Padding(
padding: EdgeInsets.symmetric(vertical: 5.h, horizontal: 3.h),
child: Container(),
);
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.