- 75浏览
- 2023-05-20
uniapp开发微信小程序的时候,有时候去调整样式
你需要适配各种手机屏幕,使用,你的样式宽高就不能使用rpx
有的朋友觉得可以使用vw vh % 是的,当然可以
但是要让你的元素,宽高,比如50%再去加上20rpx 怎么做
所以这时候就要去获取不同手机页面屏幕的宽高
如何获取手机屏幕宽高
1.使用uni.getWindowInfo()
// 获取窗口信息
let getWindowInfo = uni.getWindowInfo()
console.log(getWindowInfo.screenHeight);//屏幕高度
console.log(getWindowInfo.screenWidth);//屏幕宽度
console.log(getWindowInfo.windowHeight);//可操作页面高度
console.log(getWindowInfo.windowWidth);//可操作页面宽度
console.log(getWindowInfo);
console.log('获取窗口信息');
2.使用uni.getSystemInfo()
// 系统信息的概念
uni.getSystemInfo({
success: res => {
console.log(res);
console.log(res.screenHeight);//屏幕高度
console.log(res.screenWidth);//屏幕宽度
console.log(res.windowHeight);//可操作页面高度
console.log(res.windowWidth);//可操作页面宽度
}
})
当然除了需要手机屏幕和可操作区域宽高外,有时候,你还需要去获取手机的型号
使用 uni.getDeviceInfo()
let getDeviceInfo = uni.getDeviceInfo()
// 获取设备基础信息
console.log(getDeviceInfo);
console.log('获取设备基础信息');
注意
这些方法可以获取到的属性并不只能获取宽高
还可以去获取很多你需要的属性
我在这里着重的写一下获取宽高的
版权声明:
1、本文系转载,版权归原作者所有,旨在传递信息,不代表看本站的观点和立场。
2、本站仅提供信息发布平台,不承担相关法律责任。
3、若侵犯您的版权或隐私,请联系本站管理员删除。
4、本文由会员转载自互联网,如果您是文章原创作者,请联系本站注明您的版权信息。