uniapp去掉手机状态栏 全屏展示

app.vue

onShow: function() {

console.log('App Show')

this.$nextTick(() => {

if (typeof plus !== 'undefined') {

// 隐藏状态栏(沉浸式)

plus.navigator.setFullscreen(true)

// 尝试隐藏底部系统导航栏(部分机型有效)

plus.navigator.hideSystemNavigation()

}

})

复制代码
<style lang="scss">
	/* 注意要写在第一行,同时给style标签加入lang="scss"属性 */
	@import "uview-plus/index.scss";
</style>
<script>
import {  stopHeartbeat,startHeartbeat } from "./request/heartbeat";

	export default {
		onLaunch: function() {
    console.log('App Launch')
    if (typeof plus !== 'undefined') {
      plus.screen.lockOrientation('landscape-primary')
    } else {
      document.addEventListener('plusready', () => {
        plus.screen.lockOrientation('landscape-primary')
      })
    }
  },
		onShow: function() {
			console.log('App Show')
			this.$nextTick(() => {
      if (typeof plus !== 'undefined') {
        // 隐藏状态栏(沉浸式)
        plus.navigator.setFullscreen(true)

        // 尝试隐藏底部系统导航栏(部分机型有效)
        plus.navigator.hideSystemNavigation()
      }
    })
		},
		onHide: function() {
			console.log('App Hide')
		},
		// App 关闭或页面退出时停止心跳
		onUnload() {
  		  stopHeartbeat()
  }
	}
</script>

<style lang="scss">
	@import "/static/iconfont/iconfont.css";
	/*每个页面公共css */
	@import '@/uni_modules/uni-scss/index.scss';
	/* #ifndef APP-NVUE */
	@import '@/static/customicons.css';
	// 设置整个项目的背景色
	page {
		background-color: #f5f5f5;
	}

	/* #endif */
	.example-info {
		font-size: 14px;
		color: #333;
		padding: 10px;
	}
</style>

manifest.json里面配置

复制代码
{
  "app-plus": {
    "statusbar": {
      "immersed": true,
      "style": "dark",
      "background": "#000000"
    }
  }
}

最后就可以全屏了#

相关推荐
Filotimo_1 天前
在java开发中,cron表达式概念
java·开发语言·数据库
码农水水1 天前
京东Java面试被问:HTTP/2的多路复用和头部压缩实现
java·开发语言·分布式·http·面试·php·wpf
摘星编程1 天前
React Native for OpenHarmony 实战:Picker 选择器组件详解
javascript·react native·react.js
你怎么知道我是队长1 天前
C语言---未定义行为
java·c语言·开发语言
摘星编程1 天前
React Native for OpenHarmony 实战:VirtualizedList 虚拟化列表
javascript·react native·react.js
没有bug.的程序员1 天前
Java 序列化:Serializable vs. Protobuf 的性能与兼容性深度对比
java·开发语言·后端·反射·序列化·serializable·protobuf
摘星编程1 天前
React Native for OpenHarmony 实战:RefreshControl 下拉刷新组件
javascript·react native·react.js
Clarence Liu1 天前
AI Agent开发(2) - 深入解析 A2A 协议与 Go 实战指南
开发语言·人工智能·golang
业精于勤_荒于稀1 天前
异常梳理aaaa
开发语言·qt