Uni-app页面信息与元素影响解析

news2025/4/3 0:41:23

获取窗口信息uni.getWindowInfo

{
	pixelRatio: 3
	safeArea:{
		bottom: 778
		height: 731
		left: 0
		right: 375
		top: 47
		width: 375
	}
	safeAreaInsets: {
		top: 47, 
		left: 0, 
		right: 0, 
		bottom: 34
	},
	screenHeight: 812,
	screenTop: 0,
	screenWidth: 375,
	statusBarHeight: 47,
	windowBottom: 0,
	windowHeight: 812,
	windowTop: 0,
	windowWidth: 375
}

参数的含义

uni.getWindowInfo()​方法用于获取当前窗口的相关信息,其返回结果包含以下属性1:

  1. pixelRatio​:设备像素比。
  2. screenWidth​:屏幕宽度,单位为逻辑像素。
  3. screenHeight​:屏幕高度,单位为逻辑像素。
  4. windowWidth​:可使用的窗口宽度,单位为逻辑像素。
  5. windowHeight​:可使用的窗口高度,单位为逻辑像素。
  6. windowTop​:可使用窗口的顶部位置,即窗口顶部距离屏幕顶部的距离,单位为逻辑像素。
  7. windowBottom​:可使用窗口的底部位置,即窗口底部距离屏幕顶部的距离,单位为逻辑像素。
  8. statusBarHeight​:手机状态栏的高度,单位为逻辑像素。
  9. screenTop​:窗口顶部边缘的y​值,即窗口顶部距离屏幕顶部的距离,与windowTop​类似,但在某些情况下可能有不同的计算方式或用途。
  10. safeArea​:一个对象,包含了竖屏正方向下安全区域的信息,包括以下属性:
 * ​`left`​:安全区域左上角的横坐标,单位为逻辑像素。
 * ​`right`​:安全区域右下角的横坐标,单位为逻辑像素。
 * ​`top`​:安全区域左上角的纵坐标,单位为逻辑像素。
 * ​`bottom`​:安全区域右下角的纵坐标,单位为逻辑像素。
 * ​`width`​:安全区域的宽度,单位为逻辑像素。
 * ​`height`​:安全区域的高度,单位为逻辑像素。
  1. safeAreaInsets​:一个对象,包含了竖屏正方向下安全区域的插入位置信息,包括以下属性:
 * ​`left`​:安全区域左侧的插入位置,单位为逻辑像素。
 * ​`right`​:安全区域右侧的插入位置,单位为逻辑像素。
 * ​`top`​:安全区域顶部的插入位置,单位为逻辑像素。
 * ​`bottom`​:安全区域底部的插入位置,单位为逻辑像素。

示例图

在不同的机型上返回的参数对比如下:

  • 如果当前页面中没有在 pages中设置导航栏,windowHeight 与 screenHeight 高度相同

画布

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2326045.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

CentOS(最小化)安装之后,快速搭建Docker环境

本文以VMware虚拟机中安装最小化centos完成后开始。 1. 检查网络 打开网卡/启用网卡 执行命令ip a查看当前的网络连接是否正常: 如果得到的结果和我一样,有ens网卡但是没有ip地址,说明网卡未打开 手动启用: nmcli device sta…

【身份证证件OCR识别】批量OCR识别身份证照片复印件图片里的文字信息保存表格或改名字,基于QT和腾讯云api_ocr的实现方式

项目背景 在许多业务场景中,需要处理大量身份证照片复印件,手动输入其中的文字信息效率低下且容易出错。利用 OCR(光学字符识别)技术可以自动识别身份证图片中的文字信息,结合 QT 构建图形用户界面,方便用户操作,同时使用腾讯 OCR API 能够保证较高的识别准确率。 界面…

IP属地和发作品的地址不一样吗

在当今这个数字化时代,互联网已经成为人们日常生活不可或缺的一部分。随着各大社交平台功能的不断完善,一个新功能——IP属地显示,逐渐走进大众视野。这一功能在微博、抖音、快手等各大平台上得到广泛应用,旨在帮助公众识别虚假信…

Redis - 概述

目录 ​编辑 一、什么是redis 二、redis能做什么(有什么特点)? 三、redis有什么优势 四、Redis与其他key-value存储有什么不同 五、Redis命令 六、Redis数据结构 1、基础数据结构 2、高级数据结构 一、什么是redis 1、redis&#x…

vue3 根据城市名称计算城市之间的距离

<template><div class"distance-calculator"><h1>城市距离计算器</h1><!-- 城市输入框 --><div class"input-group"><inputv-model"city1"placeholder"请输入第一个城市"keyup.enter"cal…

html 列表循环滚动,动态初始化字段数据

html <div class"layui-row"><div class"layui-col-md4"><div class"boxall"><div class"alltitle">超时菜品排行</div><div class"marquee-container"><div class"scroll-…

QT基础:安装与简介

QT初级 1、简介1.1 安装1.2 设置1.3 在VS中配置Qt1.3 帮助文档 2、Qt项目2.1 创建项目2.1 项目文件2.2 Qt中的窗口类窗口显示 2.3 坐标体系2.4 内存回收 1、简介 QT是一个跨平台的C应用程序开发框架。几乎支持所有的平台, 可用于桌面程序开发以及嵌入式开发。 Qt是标准 C 的扩…

WEB安全-HTTPS

1 需求 结合Wireshark抓包实战&#xff0c;图文详解TCP三次握手及四次挥手原理&#xff08;附下载&#xff09; 结合Wireshark抓包分析&#xff0c;沉浸式体验HTTP请求的一次完整交互过程 https://mp.weixin.qq.com/s/f3LmUEtjIuLjkyjxJj7ebA 一文彻底了解DNS协议工作原理&…

【宇宙回响】从Canvas到MySQL:飞机大战的全栈交响曲【附演示视频与源码】

🌟 这是星际大战系列的第三篇,感谢一路以来支持和关注这个项目的每一位朋友! 💡 文章力求严谨,但难免有疏漏之处,欢迎各位朋友指出,让我们一起在交流中进步。 🎁 项目代码、文档和相关资源都可以免费获取,希望能帮助到更多对游戏开发感兴趣的朋友。 💌 如果您有任…

git push origin masterremote: [session-bd46a49f] The token username invalid

参考:如何把项目上传到Gitee&#xff08;保姆级教程&#xff09;_gitee上传项目-CSDN博客 1 新建仓库 username可以是登录账号的邮箱地址也可以是用户名 password可以是登录账号的密码也可以是私人令牌 2 创建分支 3 初始化 dev是你新建的分支 创建并切换分支 git init g…

基于MCU实现的电机转速精确控制方案:软件设计与实现

本文将详细介绍一篇基于微控制器&#xff08;MCU&#xff09;的电机转速精确控制的软件方案。通过采样PWM信号控制和ADC采样技术&#xff0c;结合PID闭环控制算法&#xff0c;实现了电机转速的高效、稳定调节。以下是软件方案流程图&#xff0c;下文将对其进行展开讲解。 原图太…

【模拟CMOS集成电路笔记】轨到轨运放(Rail to Rail)基础(附带实例:基于1:3电流镜的轨到轨输入运放)

【模拟CMOS集成电路笔记】轨到轨运放&#xff08;Rail to Rail&#xff09;基础 0前言1 简介1.1轨到轨输入级(1)互补差分对&#xff1a;(2)输入范围切换&#xff1a; 1.2轨到轨输出级(1)推挽输出&#xff1a;(1)输出级偏置&#xff1a; 2轨到轨输入运放2.1基于电流倍增实现恒定…

【零基础入门unity游戏开发——通用篇】图片相关设置

考虑到每个人基础可能不一样,且并不是所有人都有同时做2D、3D开发的需求,所以我把 【零基础入门unity游戏开发】 分为成了C#篇、unity通用篇、unity3D篇、unity2D篇。 【C#篇】:主要讲解C#的基础语法,包括变量、数据类型、运算符、流程控制、面向对象等,适合没有编程基础的…

解决关于原生gmssl无法直接输出sm2私钥明文的问题

解决关于原生gmssl无法直接输出sm2私钥明文的问题 问题描述解决方法解决方法一解决方法二 问题描述 通过gmssl生成sm2公私钥对时&#xff0c;输出的是加密的sm2私钥&#xff0c;无法获取到SM2私钥明文。 解决方法 解决方法一 手动解密&#xff1a; 解决方法二 修改源码&…

基于 Qt / HTTP/JSON 的智能天气预报系统测试报告

目录 一、项目概述 1.1项目背景 1.2项目目标 二、功能需求 2.1 用户界面功能 2.2 后台功能 三、技术选择 3.1 开发框架与工具 3.2 第三方 API 四、UI设计 4.1界面展示 4.2stylesheet样式 五、代码实现 1.构造函数 2.网络请求响应处理函数 3.处理json数据 4.更新…

基于Real-Sim-Real循环框架的机器人策略迁移方法

编辑&#xff1a;陈萍萍的公主一点人工一点智能 基于Real-Sim-Real循环框架的机器人策略迁移方法本文通过严谨的理论推导和系统的实验验证&#xff0c;构建了一个具有普适性的sim-to-real迁移框架。https://mp.weixin.qq.com/s/cRRI2VYHYQUUhHhP3bw4lA 01 摘要 本文提出的Rea…

Spring Boot 集成实战:AI 工具如何自动生成完整微服务模块

在数字化转型的浪潮中&#xff0c;开发效率和质量是企业竞争力的关键要素。飞算 JavaAI 作为一款创新的 AI 工具&#xff0c;能在 Spring Boot 开发中&#xff0c;自动生成完整微服务模块&#xff0c;极大提升开发效率。下面&#xff0c;我们就详细介绍如何借助飞算 JavaAI&…

Java高频面试之并发编程-01

hello啊&#xff0c;各位观众姥爷们&#xff01;&#xff01;&#xff01;本baby今天来报道了&#xff01;哈哈哈哈哈嗝&#x1f436; 面试官&#xff1a;并行跟并发有什么区别&#xff1f; 并发 vs 并行&#xff1a;核心区别与场景 1. 定义对比 维度并发&#xff08;Concu…

AI 驱动的安全分析的价值是什么?

作者&#xff1a;来自 Elastic Riya Juneja, Alyssa VanNice 与 Enterprise Strategy Group 一起量化经济影响 安全行业十分复杂&#xff0c;变化速度极快。攻击面、利益相关者需求、对手战术以及你使用的工具都在不断演变&#xff0c;导致许多安全团队不确定自己是否已做好准备…

AWE 2025:当AI科技遇见智能家居

3月20日&#xff0c;以“AI科技、AI生活”为主题的AWE2025&#xff08;中国家电及消费电子博览会&#xff09;在上海新国际博览中心开幕。作为全球家电行业风向标&#xff0c;本届展会最大的亮点莫过于健康理念在家电领域的全面渗透。从食材保鲜到空气净化&#xff0c;从衣物清…