当前位置: 首页 > article >正文

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

获取窗口信息uni.getWindowInfo

{pixelRatio: 3safeArea:{bottom: 778height: 731left: 0right: 375top: 47width: 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 高度相同

画布

相关文章:

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

获取窗口信息uni.getWindowInfo {pixelRatio: 3safeArea:{bottom: 778height: 731left: 0right: 375top: 47width: 375}safeAreaInsets: {top: 47, left: 0, right: 0, bottom: 34},screenHeight: 812,screenTop: 0,screenWidth: 375,statusBarHeight: 47,windowBottom: 0,win…...

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 的扩…...

41、当你在 index.html 中引用了一个公共文件(比如 common.js),修改这个文件后,用户访问页面时仍然看到旧内容,因为浏览器缓存了旧版本

由于浏览器缓存导致公共文件无法更新。当用户修改了公共文件&#xff08;如 JavaScript 或 CSS&#xff09;&#xff0c;但 index.html 中引用的文件名没有变化&#xff0c;浏览器会认为文件没有更新&#xff0c;继续使用缓存的旧版本。因此&#xff0c;需要通过某种方式让浏览…...

WEB安全-HTTPS

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

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

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

Linux内核内存管理 ARM32页表映射流程和案例分享

ARM32架构使用两级页表结构将虚拟地址转换为物理地址&#xff0c;以下为详细流程及案例分析&#xff1a; ARM32页表映射流程 1.获取页目录基地址 MMU通过TTBR&#xff08;Translation Table Base Register&#xff09;寄存器获取当前进程的一级页表&#xff08;L1页表&#x…...

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;下文将对其进行展开讲解。 原图太…...

suse15 sp1使用华为云软件源yum源zypper源

登录suse15终端&#xff0c; cd /etc/zypp/repos.d/进入目录后执行以下命令&#xff1a; zypper ar -fcg https://mirrors.huaweicloud.com/opensuse/distribution/leap/15.1/repo/oss HuaWeiCloud:15.1:OSS zypper ar -fcg https://mirrors.huaweicloud.com/opensuse/distribu…...

amd64 架构机器如何拉取arm64的镜像

在 AMD 架构&#xff08;通常是 x86_64 架构&#xff09;的机器上拉取 ARM 架构的镜像 拉取指定架构的镜像 例如&#xff0c;要拉取 ARM64 架构的 nginx 镜像&#xff0c;可以使用以下命令&#xff1a; docker pull --platform linux/arm64 nginx...

【模拟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; 解决方法二 修改源码&…...

齐次线性方程组及python求解

齐次线性方程组的概念 齐次线性方程组是指所有常数项都为零的线性方程组&#xff0c;其一般形式为&#xff1a; a 11 x 1 a 12 x 2 ⋯ a 1 n x n 0 a_{11}x_1 a_{12}x_2 \cdots a_{1n}x_n 0 a11​x1​a12​x2​⋯a1n​xn​0 a 21 x 1 a 22 x 2 ⋯ a 2 n x n 0 a_…...

基于 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&…...

Vue React

Vue 的源码主要分为以下几个部分&#xff1a; 主要涉及 响应式、虚拟 DOM、组件系统、编译器、运行时。 ├── packages/ │ ├── compiler-core/ # 编译器核心 │ ├── compiler-sfc/ # 处理 .vue 单文件组件 │ ├── compiler-dom/ # 处理 DOM 相关…...

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

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

(Kotlin)Android 高效底部导航方案:基于预定义 Menu 和 ViewPager2 的 Fragment 动态绑定实现

支持预定义 Menu 并绑定 Fragment&#xff0c;同时保留动态添加 Tab 的能力 BottomTabHelper.kt package smartconnection.com.smartconnect.home.utilimport android.content.Context import android.util.SparseArray import androidx.annotation.IdRes import androidx.fra…...

2024年零知识证明(ZK)研究进展

Sumcheck 整个领域正在转向更多地依赖于 Sumcheck Protocol Sumcheck是用于验证多项式承诺的协议&#xff0c;常用于零知识证明&#xff08;ZKP&#xff09;中&#xff0c;尤其是在可验证计算和扩展性上。它的主要目的是通过对多项式进行分段检查&#xff0c;从而保证某个多项…...

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

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

目标检测YOLO实战应用案例100讲-基于孤立森林算法的高光谱遥感图像异常目标检测(续)

目录 3.4 实验结果与分析 3.4.1 数据集介绍 3.4.2 实验参数分析 3.4.3 实验结果评价与讨论 基于高维孤立森林算法的高光谱图像异常检测 4.1 引言 4.2 基于高维孤立森林算法的异常检测模型 4.2.1 面向高维数据的改进策略 4.2.2 基于光谱有效信息率和目标-背景分离…...

flutter框架中文文档,android智能手机编程答案

RecyclerView优化全攻略&#xff1a;从数据处理到性能提升 字节跳动四面有三面都问了这个问题&#xff0c;在此做了整理&#xff0c;希望可以帮助到大家&#xff0c;欢迎查漏补缺。 数据处理和视图加载分离 我们知道&#xff0c;从远端拉取数据肯定是要放在异步的&#xff0…...