小程序windowHeight和screenHeight的区别

最新推荐文章于 2023-03-02 16:34:20 发布
最新推荐文章于 2023-03-02 16:34:20 发布
阅读量1.4w 收藏 5
点赞数 1
分类专栏： 小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/bianyaoyao/article/details/84532272
版权

微信小程序在使用wx.getSystemInfo(Object object)这个接口的时候，返回的参数有很多，windowHeight和screenHeight经常被搞混

screenWidthnumber屏幕宽度1.1.0
screenHeightnumber屏幕高度1.1.0

和screen相关的属性，是指整个屏幕的宽高，如果因为要计算控件的高度，调用这个接口，一般不会取这个参数

windowWidthnumber可使用窗口宽度 
windowHeightnumber可使用窗口高度

和window相关的是指可使用的宽高

wx.getSystemInfoSync()和wx.getSystemInfo(Object object)相比较   前者是一个同步接口，后者是异步

示例代码可以参考微信官方文档

具体参考官方文档

https://developers.weixin.qq.com/miniprogram/dev/api/system/system-info/wx.getSystemInfo.html

留言相互交流

 

 

四月天-coder
关注
  • 1
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
screenHeight和windowHeight区别
tangyuan97的博客
12-20 6743
1.作用域不同：screenHeight是整合手机屏幕的高度，windowHeight是webview（不包括手机通知栏、小程序标题栏和tabBar）的高度； 2.单位不同：screenHeight的单位是rpx，windowHeight的单位是px； ...
screenheight和windowHeight的区别
画画的贝贝的博客
02-15 1052
screenheight和windowHeight的区别
uniapp screenHeight和windowHeight
09-27 1744
uniapp screenHeight和windowHeight
微信小程序-屏幕高度分析详解
qq_46199553的博客
07-28 7872
微信小程序高度
微信小程序API中 windowWidth 和 screeWidth 的区别....(坑)
akulakk's memory stack
06-29 2865
大部分情况下是相等的 这里我说一个情况, 大家可以自行区分, 一目了然 用PC端小程序打开你的小程序你会发现 screenWidth 是你的电脑显示器宽度... 1920 而windowWidth则是你打开的小程序得正确窗口宽度750 这就是区别 所以强烈建议用windowWidth 欢迎评论补充其他情况 ...
随手笔记
psd_html的博客
06-16 469
随手记笔记最初的念想xie_bokeyuan45隐藏滚动条 .content { -ms-overflow-style:none; overflow:-moz-scrollbars-none; } .content::-webkit-scrollbar{ width:0px } /* 设置滚动条的宽度问0 火狐浏览器-moz-测试之后不兼容
小程序-卡卡汽车 获取用户 设备信息.zip
05-15
5. `windowWidth` 和 `windowHeight`：小程序页面的视口宽度和高度。 6. `language`：用户的语言设置，如"zh-Hans"表示简体中文。 7. `version`：微信小程序的版本号。 8. `platform`：运行环境，通常是"ios"或...
微信小程序开发图片拖拽实例详解
08-30
screenHeight: res.windowHeight, screenWidth: res.windowWidth, }); } }); }, ballMoveEvent: function(e) { var touchs = e.touches[0]; var pageX = touchs.pageX; var x = this.data.screenWidth / ...
微信小程序实现image组件图片自适应宽度比例显示的方法
08-28
screenHeight: res.windowHeight, screenWidth: res.windowWidth, }); } }); }, imageLoad: function(e) { var _this = this; var $width = e.detail.width, // 获取图片真实宽度 $height = e.detail....
你还在发愁小程序自定义导航栏吗？
03-29
先说一下我的需求吧，因为我们的小程序是嵌套了webview。...然后pm又找了一个自定义的导航的小程序，发现别人可以，然后我就开始研究。 小程序自定义导航栏开发...开一个项目采集设备的screenHeight,windowHeight,pixelR
动态设置窗口位置和大小
06-30
window.moveTo((screen.width - 640) / 2, (screen.height - 480) / 2); // 设置窗口位置 ``` 在Qt框架下，我们可以使用`move`和`resize`函数： ```c++ #include #include int main(int argc, char *argv[]) { ...
小程序中获取屏幕高度
weixin_40762926的博客
03-02 4371
小程序获取屏幕高度
小程序windowHeight在不同页面高度不一致问题及解决方案
qq_41619741的博客
10-18 7552
小程序可以通过wx.getSystemInfo获取系统信息    1. windowHeight 概念 可使用窗口高度，即：屏幕高度（screenHeight） - 导航（tabbar）高度 - 导航栏高度 - 状态栏高度。 在不含导航（tabbar）的页面， windowHeight =屏幕高度（screenHeight） - 导航栏高度 - 状态栏高度   了解规则 iPho...
小程序自定义导航栏，实现与胶囊对齐功能
qq_43342124的博客
12-25 3230
注意screenHeight屏高：屏幕高度 = 原生NavigationBar高度（含状态栏高度）+ 可使用窗口高度 + 原生TabBar高度 但是自定义导航栏screenHeight=windowHeight 由于是自定义导航栏无法获取原生NavigationBar高度，需要手动计算。 首先先获取状态栏高度和右上角胶囊的布局位置信息： 分别是uni.getSystemInfo()获取系统信息以及uni.getMenuButtonBoundingClientRect（这个函数h5环境下不能用要使用条件编.
微信小程序：用 rpx 和 wx.getSystemInfoSync() 来适配屏幕高度
热门推荐
weixin_43837555的博客
02-04 1万+
目前网络上关于 px / rpx / rem 相互转换的博文有很多， 作为初学者在实际操作过程中会发现可以用 750rpx 来表示屏幕宽度，但屏幕高度咋表示捏？~ 于是本文主要用来说明如何用 rpx 和 wx.getSystemInfoSync() 来适配屏幕高度 具体步骤 首先我们需要用 wx.getSystemInfoSync() 来获取设备信息 /*把这两个变量作为全局变量，看起来会好看...
微信小程序safaArea/screenHeight/windowHeight/menuButton梳理
qq_43000621的博客
04-07 785
statusBarHeight = safeArea.top windowHeight当前页面高度 相当于page screenHeight屏高 statusBarHeight + titleBarHeight + windowHeight = screenHeight 底部小黑条高度HomeIndicatorHeight = screenHeight - safeArea.bottom 当页面设置为沉浸式的时候 windowHeight = screenHeight app.js里面的windowHe
uiapp 获取屏幕的高度
weixin_48145150的博客
04-27 349
screenWidth 屏幕宽度 screenHeight 屏幕高度 windowWidth 可使用窗口宽度 windowHeight 可使用窗口高度 windowTop 可使用窗口的顶部位置 App、H5 windowBottom 可使用窗口的底部位置 App、H5 statusBarHeight 状态栏的高 windowHeight举例子 <view :style="[uniHeight]"></view> data() { return {
iPhoneX安全区域(Safe Area)底部小黑条在微信小程序和H5的屏幕适配
heyzqt
03-29 5661
最近写小程序时，遇到了 iPhoneX 底部小黑线与内容重叠的问题，实际上是iPhoneX安全区域的适配问题，了解清楚这个问题花了挺多时间的，也实操出了结果，忍不住来总结总结。 本文目录 前言        · 内容与小黑线重叠情况说明 1.安全区域含义 2.微信小程序适配iPhoneX底部小黑条(Home Indicator)     ...
微信小程序获取屏幕高度
qq_45314240的博客
05-16 2016
获取屏幕高度 wx.getSystemInfoSync().screenHeight 获取屏幕宽度 wx.getSystemInfoSync().screenWidth 获取屏幕可视高度 wx.getSystemInfoSync().windowHeight 获取屏幕可视宽度 wx.getSystemInfoSync().windowWidth 获取设备状态栏高度 wx.getSystemInfoSync().statusBarHeight ...
微信小程序 获取屏幕高度
最新发布
09-05
要在微信小程序中获取屏幕高度，您可以使用小程序提供的系统信息 API。以下是获取屏幕高度的步骤： 1. 在需要获取屏幕高度的页面或组件中，引入系统信息 API： ```javascript const app = getApp(); ``` 2. 在页面加载或组件初始化时，调用系统信息 API 获取屏幕高度： ```javascript wx.getSystemInfo({ success: function (res) { const screenHeight = res.windowHeight; console.log(screenHeight); } }); ``` 3. 通过 `res.windowHeight` 获取到的数值即为屏幕高度，您可以根据实际需求进行处理。 请注意，由于获取系统信息是一个异步操作，需要在 `success` 回调中处理获取到的结果。另外，如果需要判断屏幕高度是否包括状态栏的高度，可以使用 `res.screenHeight`。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值