博客地址:flutterall.com
先看代码:
class FlutterAlign extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Align(
alignment: Alignment(-1, -1),
child: Container(
child: Text(
"Hello",
),
),
);
}
}
可以看到,在刘海屏幕中,显示位置不是我们期待的。大部分刘海区域不是我们所触发按钮的区域。这是我们可以使用SafeArea Widget来很好的解决这个问题。
class FlutterAlign extends StatelessWidget {
@override
Widget build(BuildContext context) {
return SafeArea(
child: Align(
alignment: Alignment(-1, -1),
child: Container(
child: Text(
"Hello",
),
),
),
);
}
}
当然,使用这个Widget也能很好的处理iPhone X类似的底部bottom的区域。
class FlutterAlign extends StatelessWidget {
@override
Widget build(BuildContext context) {
return SafeArea(
child: Align(
alignment: Alignment(-1, 1),
child: Container(
child: Text(
"Hello",
),
),
),
);
}
}
所以大部分情况下,使用SafeArea能很好的解决刘海,不规则屏幕的显示问题。
本地代码地址
Flutter Container
Flutter SafeArea
Flutter Row Column MainAxisAlignment Expanded
Flutter Image全解析
Flutter 常用按钮总结
Flutter ListView豆瓣电影排行榜
Flutter Card
Flutter Navigator&Router(导航与路由)
OverscrollNotification不起效果引起的Flutter感悟分享
Flutter 上拉抽屉实现
Flutter 豆瓣客户端,诚心开源
Flutter 更改状态栏颜色