每年都有新亮点， 自从iPhoneX 出了刘海屏之后，各家安卓厂商也纷纷跟进，对于开发来说，就需要进行各种刘海屏的适配。 对于Flutter来说，刘海屏主要适配的是上下的边距， 需要把不可点击的区域留出来，同时要把背景颜色和图片放上去。 对于上面的边距， 如果使用 Scaffold ， appBar已经自动为我们做好了适配，直接使用就行了。 如果使用的是自定义布局的话， Flutter 提供了媒体查询的接口， 可与获取到上边距和下边距的值。 final double topPadding = MediaQuery.of(context).padding.top; final double bottomPadding = MediaQuery.of(context).padding.bottom;
我们只需要在布局Widget的时候， 把这个值计算进去就ok了。 需要注意的是： 上边距在 iPhoneX 上的值是 44， 在其他设备上的值是 20， 是包含了电池条的高度的。 下边距在iPhoneX 上的值是34，在其他设备上的值是 0。 现在Flutter出了一个新的Widget，叫做 SafeArea ， 直接在外面包一层这个Widget， 就可以让子Widget 不会被刘海覆盖了。
class _home extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return _homeState();
}
}
class _homeState extends State<_home> {
@override
Widget build(BuildContext context) {
// TODO: implement build
return new Scaffold(
appBar: new AppBar(
title: Text("title"),
centerTitle: true,
),
body: new Center(
child: new Container(
height: 200.0,
decoration: new BoxDecoration(
gradient: const LinearGradient(
colors: [Colors.amberAccent, Colors.lightBlue, Colors.red]),
border: Border.all(width: 5.0,color: Colors.green)
),
),
)
);
}
Flutter Decoration背景设定（边框、圆角、阴影、形状、渐变、背景图像等）
Flutter学习之旅（四）Flutter动画（1）动画基础介绍
Flutter：Slivers大家族，让滑动视图的组合变得很简单！
Flutter入门学习--(16)布局定位控件Positioned
旋转木马滑块小部件，支持无限滚动和自定义子小部件，具有自动播放功能。
RFlutter Alert是Flutter的超级可定制且易于使用的警报/弹出对话框。您可以轻松创建可重复使用的警报样式或添加按钮。