flutter中去除导航栏与状态栏
方法一
SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual, overlays: [SystemUiOverlay.bottom]); //隐藏状态栏 上方黑边 SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual, overlays: [SystemUiOverlay.top]); //隐藏导航栏 SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual, overlays: []); // 隐藏状态栏和导航栏 上方黑板
方法二(状态栏设置透明)
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter App',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: Scaffold(
appBar: AppBar(
backgroundColor: Colors.transparent, // 设置AppBar为透明
elevation: 0, // 去除AppBar的阴影
),
body: Container(
// 这里是页面内容
),
),
);
}
}
展示如何通过点击屏幕来进入/退出全屏模式,并且在全屏模式下通过滑动屏幕来退出全屏
import 'dart:async'; // 导入使用Timer需要的库
import 'package:flutter/material.dart';
import 'package:flutter/services.dart'; // 导入使用SystemChrome需要的库 void main() {
runApp(MyApp()); // 运行应用程序
} class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo', // 设置应用程序的标题
home: Scaffold(
body: MyHomePage(), // 设置主页面为 MyHomePage 组件
),
);
}
} class MyHomePage extends StatefulWidget {
MyHomePage({Key? key}) : super(key: key); @override
_MyHomePageState createState() => _MyHomePageState();
} class _MyHomePageState extends State<MyHomePage> {
bool _isFullScreen = false; // 判断是否全屏 Timer? _timer; // 定时器 @override
void initState() {
super.initState(); // 初始化定时器,在每3秒钟检查一次是否需要退出全屏模式
_timer = Timer.periodic(Duration(seconds: 3), (timer) {
if (_isFullScreen) {
setState(() {
SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual, overlays: [SystemUiOverlay.top]);
_isFullScreen = false;
});
}
});
} @override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () {
if (_isFullScreen) {
// 如果已经全屏就退出全屏
setState(() {
SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual, overlays: [SystemUiOverlay.top]);
_isFullScreen = false;
});
} else {
// 如果不是全屏就进入全屏
setState(() {
SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersive, overlays: []);
_isFullScreen = true;
});
}
},
onVerticalDragUpdate: (DragUpdateDetails details) {
if (_isFullScreen) {
// 如果是全屏就退出全屏
setState(() {
SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual, overlays: [SystemUiOverlay.top]);
_isFullScreen = false;
});
}
},
child: Container(
color: Colors.white, // 设置容器背景颜色为白色
child: Center(
child: Text('点击屏幕进入全屏,滑动屏幕退出全屏'), // 在屏幕中央显示文本
),
),
);
} @override
void dispose() {
_timer?.cancel(); // 取消定时器
super.dispose();
}
}
---
flutter中去除导航栏与状态栏的更多相关文章
- Flutter布局--appbar导航栏和状态栏
MaterialApp 先看下上图的具体用法:1. title:标题2. actions:表示右侧的按钮的动作3. leading:表示左侧的按钮的动作4. flexibleSpace:5. back ...
- zhuang 定制iOS 7中的导航栏和状态栏
近期,跟大多数开发者一样,我也正忙于对程序进行升级以适配iOS 7.最新的iOS 7外观上有大量的改动.从开发者的角度来看,导航栏和状态栏就发生了明显的变化.状态栏现在是半透明的了,这也就意味着导航栏 ...
- iOS 7 教程:定制iOS 7中的导航栏和状态栏
目录(?)[-] iOS 7中默认的导航栏 设置导航栏的背景颜色 在导航栏中使用背景图片 定制返回按钮的颜 修改导航栏标题的字体 修改导航栏标题为图片 添加多个按钮 修改状态栏的风格 隐藏状态栏 总结 ...
- (转)定制iOS 7中的导航栏和状态栏
近期,跟大多数开发者一样,我也正忙于对程序进行升级以适配iOS 7.最新的iOS 7外观上有大量的改动.从开发者的角度来看,导航栏和状态栏就发生了明显的变化.状态栏现在是半透明的了,这也就意味着导航栏 ...
- 定制iOS 7中的导航栏和状态栏
本文转载至 http://www.cocoachina.com/industry/20131104/7287.html 跟大多数开发者一样,我也正忙于对程序进行升级以适配iOS 7.最新的iOS 7外 ...
- iOS去除导航栏和tabbar的1px横线
1.在自己定义的导航栏中或者设计稿中经常需要去除导航栏的1px横线,主要是颜色太不协调了 去除之前的图片 要去除这1px的横线,首先应该知道它是什么,在Xcode的界面调试中可以看到,它其实是UIIm ...
- 【转】iOS中设置导航栏标题的字体颜色和大小
原文网址:http://www.360doc.com/content/15/0417/11/20919452_463847404.shtml iOS中设置导航栏标题的字体颜色和大小,有需要的朋友可以参 ...
- Android 4.4 上实现透明导航栏和状态栏 Translucent system bar
Translucent system UI styling To get the most impact out of your content, you can now use new window ...
- iOS中设置导航栏标题的字体颜色和大小
iOS中设置导航栏标题的字体颜色和大小,有需要的朋友可以参考下. 在平时开发项目的时候,难免会遇到修改导航栏字体大小和颜色的需求,一般使用自定义视图的方法,其实还存在一种方法. 方法一:(自定义视图的 ...
- Android 动态隐藏显示导航栏,状态栏
Talk is cheap, show me the code. --Linus Torvalds Okay, here: 一.导航栏: [java] view plain copy private ...
随机推荐
- 如何用ppt打印9张一面,并且去除边距?
如何用ppt打印9张一面,并且去除边距? 方法其实很简单,答主不要在ppt软件的打印选项里设置[每页打印9张幻灯片],而是使用默认的[每页打印1张幻灯片]. 然后去[打印机属性]里设置,我是 ...
- RocketMQ为什么要保证订阅关系一致
这篇文章,笔者想聊聊 RocketMQ 最佳实践之一:保证订阅关系一致. 订阅关系一致指的是同一个消费者 Group ID 下所有 Consumer 实例所订阅的 Topic .Tag 必须完全一致. ...
- Python--乱码转化为中文
1. \u和\x的含义 \u:代表的是unicode码 \x:代表的是16进制码 2. 代码实现 :\x类型 # \xe4\xb8\xad\xe6\x96\x87 代表的意思是'中文' s = u'\ ...
- 01--OpenStack 手动安装手册(Icehouse)
#OpenStack 手动安装手册(Icehouse) 声明:本博客欢迎转发,但请保留原作者信息!作者:[罗勇] 云计算工程师.敏捷开发实践者博客:http://yongluo2013.github. ...
- 使用 Ant Design Vue 你可能会遇到的14个问题
公司有一个新需求,在原来项目基础上开发,项目中使用 Ant Design Vue,版本是 1.X ,在此记录下遇到的问题:对于没有使用过或者使用程度不深的同学来说,希望可以帮助你在开发中遇到问题时有个 ...
- 带着问题去分析:Spring Bean 生命周期
1: Bean在Spring容器中是如何存储和定义的 Bean在Spring中的定义是_org.springframework.beans.factory.config.BeanDefinition_ ...
- P9073 [WC/CTS2023] 楼梯 题解
题目链接 简要题意 有一块楼梯,这里指的楼梯是倒着的,正过来看上一层宽度一定小于等于这一层宽度,并且由格子组成,你需要对其进行增删和恢复某一历史版本的操作,并回答这块楼梯是否有固定格数的子楼梯. 题目 ...
- 查找数组中第K大的元素
要查找一个数组中的第 K 大元素,有多种方法可以实现,其中常用的方法是使用分治算法或快速选择算法,这两种方法的时间复杂度到时候O(n). 快速选择算法示例: package main import & ...
- Windows系统下,GoLand的Terminal选定Git Bash作为终端,使用其上传代码时,出现中文乱码的问题
问题描述 按照这位博主博客写的没有完全解决乱码问题博主博客 这个博主博客是我后来发现,暂时还没去验证是否可行博主博客 解决方案 notepad++直接Free Download,然后就一直下一步就无脑 ...
- 彻底搞懂CAP理论(电商系统)
1.理解CAP CAP是 Consistency.Availability.Partition tolerance三个词语的缩写,分别表示一致性.可用性.分区容忍性. 下边我们分别来解释: 为了方便对 ...