最新要闻

广告

手机

iphone11大小尺寸是多少？苹果iPhone11和iPhone13的区别是什么？

iphone11大小尺寸是多少？苹果iPhone11和iPhone13的区别是什么？

 警方通报辅警执法直播中被撞飞：犯罪嫌疑人已投案

警方通报辅警执法直播中被撞飞：犯罪嫌疑人已投案

家电

  1. 首页
  2. 移动通信
  3. 内容

flutter 效果实现 —— 全面屏效果

来源：博客园


(资料图)

改变状态栏的主题颜色

1、在有 AppBar 的情况下，可以借助 AppBar 去设置，比如

return Scaffold(  appBar: AppBar(    systemOverlayStyle: SystemUiOverlayStyle.dark,  ),  body: ...

或者在主题中全局设置

theme: ThemeData(  // 白底黑字的 appBar  appBarTheme: const AppBarTheme(    systemOverlayStyle: SystemUiOverlayStyle.dark,    elevation: 2,    backgroundColor: Colors.white,    foregroundColor: Colors.black,  ),

2、在无 AppBar 的情况下：

默认是由系统决定（当你切换浅色主题/深色主题时自动改变），若要自定义我们可以采取两种方式解决：

手动设置

Widget build(BuildContext context) {  SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle.dark);  return MaterialApp.router(  // ...

使用 AnnotatedRegion组件

Widget build(BuildContext context) {  return AnnotatedRegion(    value: SystemUiOverlayStyle.dark,    child: MaterialApp.router(  // ...

底部导航指示器

// 隐藏状态栏与底部导航SystemChrome.setEnabledSystemUIMode(// 配合 SystemUiOverlayStyle 的 systemNavigationBarColor: Colors.transparent，可达到底部系统导航透明效果；// 如果系统导航是3按钮导航，那么可以设置 systemNavigationBarContrastEnforced： false，取消默认的半透明效果。// 全屏展示  SystemUiMode.edgeToEdge,//默认隐藏，若从边缘滑动会显示，过会儿会自动隐藏（安卓，iOS）//  SystemUiMode.immersiveSticky,//默认隐藏，若从边缘滑动会显示，不自动隐藏（安卓）//  SystemUiMode.immersive,//默认隐藏，点击屏幕任一地方都后会显示，不自动隐藏（安卓，不过在 pixel4 上测试无效）//SystemUiMode.leanBack,);

全面屏效果（状态栏+底部导航指示器）

SystemChrome.setEnabledSystemUIMode(  SystemUiMode.edgeToEdge,);SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle.dark.copyWith(// 沉浸式状态栏  statusBarColor: Colors.transparent,// 沉浸式导航指示器  systemNavigationBarColor: Colors.transparent,));return MaterialApp(...

关键词： 的情况下 两种方式 全局设置