uni-app应用设置 可以根据手机屏幕旋转进行 (横/竖) 屏切换

首先 我们打开项目的 manifest.json 在左侧导航栏中找到 源码视图
在这里插入图片描述
然后找到 app-plus 配置 在下面加上

"orientation": [
	//竖屏正方向
	"portrait-primary",
	//竖屏反方向
	"portrait-secondary",
	//横屏正方向
	"landscape-primary",
	//横屏反方向
	"landscape-secondary",
	//自然方向
	"default"
],

在这里插入图片描述
然后 在需要实现旋转屏幕的页面中加上代码

onLoad() {
   
// #ifdef APP-PLUS
	plus.screen.lockOrientation('default');
	// #endif
},
   // 页面关闭时清除横屏正方向
   onUnload() {
   
	// #ifdef APP-PLUS
	plus.screen.lockOrientation('portrait-primary');
	// #endif
},

在这里插入图片描述
然后 我们真机调试 默认状态下还是竖屏的
在这里插入图片描述
但是 我们旋转屏幕 将手机横过来 神奇的一幕就出现了
在这里插入图片描述
然后 我们可以通过

uni.getSystemInfo({
   
	success: function(res) {
   
		if (res.windowWidth > res.windowHeight) {
   
			// 横屏
		} else {
   
			// 竖屏
		}
	}
})

来判断当前在什么情况下
简单说 高度多就是竖屏 宽度多 就是横屏

相关推荐

  1. Android 横竖切换 窗口全

    2023-12-10 14:10:02       38 阅读
  2. uni-app解决video组件全时页面横竖错乱问题

    2023-12-10 14:10:02       58 阅读
  3. HarmonyOS ArkTS 横竖设置

    2023-12-10 14:10:02       20 阅读
  4. iOS 让APP支持横竖

    2023-12-10 14:10:02       7 阅读

最近更新

  1. TCP协议是安全的吗?

    2023-12-10 14:10:02       16 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2023-12-10 14:10:02       16 阅读
  3. 【Python教程】压缩PDF文件大小

    2023-12-10 14:10:02       15 阅读
  4. 通过文章id递归查询所有评论(xml)

    2023-12-10 14:10:02       18 阅读

热门阅读

  1. pytorch 笔记:dist 和 cdist

    2023-12-10 14:10:02       36 阅读
  2. C语言中getchar函数

    2023-12-10 14:10:02       37 阅读
  3. Codeforces Round 912 (Div. 2)补题

    2023-12-10 14:10:02       36 阅读
  4. paddle detection 怎么解析配置文件

    2023-12-10 14:10:02       29 阅读
  5. postgresql设置免密登录

    2023-12-10 14:10:02       33 阅读
  6. nodejs流

    nodejs流

    2023-12-10 14:10:02      30 阅读
  7. Linux环境FFTW源码编译 | WSL编译报错解决

    2023-12-10 14:10:02       32 阅读
  8. Electron:白话Electron开发桌面端应用

    2023-12-10 14:10:02       31 阅读
  9. K8S学习指南(4)-minikube的使用

    2023-12-10 14:10:02       37 阅读
  10. 【数据结构和算法】交替合并字符串

    2023-12-10 14:10:02       39 阅读
  11. 配置vue3+vite+eslint+prettierrc项目

    2023-12-10 14:10:02       29 阅读
  12. Android 样式与主题背景学习

    2023-12-10 14:10:02       35 阅读