Android视角看鸿蒙第六课(module.json5中的各字段含义之pages)designWidth的用法

Android视角看鸿蒙第六课(module.json5中的各字段含义之pages)

导读

前面几篇文章,我们陆续分析了entry->src->main下的module.json5中的各个字段的含义及作用。目前剩余pages和abilities两个字段,本篇文章一起来了解pages。
过程有错误,一定要看到最后

pages

官方文档

在这里插入图片描述
在这里插入图片描述

字段定义

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
可以看到pages的值是String,通过正则要求值的格式必须是
$profile: 开始的,作用是定义了所有page的路径

需要注意的是官方文档中说明除默认存在的src外,还可以存在window标签(可缺省),缺省状态下designWidth默认为720,目测类似于autosize.

思考

1、page的路径仅仅是说明,还是必须声明?
2、window下的designWidth的作用
3、autoDesignWidth的作用

尝试

1、page的路径仅仅是说明,还是必须声明?

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
EntryAbility目前是程序的入口,EntryAbility加载了pages/Index, pages/Index在main_pages.json中的src下存在。
现在把main_pages.json中的pages/Index注释看看会发生什么。
在这里插入图片描述
报错了,json不允许注释
直接删除
在这里插入图片描述
ok,有警告但不报错。
运行看看效果.
在这里插入图片描述
日志显示的是成功的,但是界面无内容.
在这里插入图片描述
改回来,再上个正常的
在这里插入图片描述

结论

被调用的page必须在pages所配置的profile中声明,未声明时不会报错,不影响运行,不会闪退但加载不出内容且
在这里插入图片描述

1.1 重复声明会如何

突发奇想,不声明不行,那么如果声明了两个会如何
在这里插入图片描述
有警告,运行看看
在这里插入图片描述
ok,没有什么问题

结论

重复声明会有警告,建议删除重复项,虽然不影响运行

2、window下的designWidth的作用

默认是没有这个值的,我们先手写一个这个字段,看看字段描述
在这里插入图片描述
Defines window-related configurations. This attribute is not supported by devices running the OHOS.
定义窗口属性,但OHOS不支持。
在这里插入图片描述
看看其他同学对于OHOS的描述,简单来说就是和鸿蒙OS不是一回事。 先不管他。

根据这个我们定义了一个designWidth,和缺省值一致,为720
在这里插入图片描述
同时,也看下designWidth的字段描述
在这里插入图片描述
Indicates the baseline width for page design, in pixels. The size of an element is scaled by the actual device width. This label is an integer.
指示页面设计的基线宽度(以像素为单位)。元素的大小按实际设备宽度进行缩放。此标签是一个整数。

为了更好的看出效果,我们修改一下page/index中的宽度和背景色
在这里插入图片描述
看效果
在这里插入图片描述

虚拟机效果不太对,理论上应该正好全屏,看看真机。

真机效果一致,这是什么原因呢?

继续修改designWidth的值,为72,相比之前缩小10倍,视图应该放大10倍才对
在这里插入图片描述
看看效果
无任何变化-_
郁闷了

结论

并无任何影响,可能我的方向是错误的,想参考一下其他同学的帖子,也未能发现有效的资料。有其他想法的同学欢迎反馈吧。

3、autoDesignWidth的作用

看一下autoDesignWidth的值

在这里插入图片描述

在这里插入图片描述
按照文档说明,当autoDesignWidth=true时,designWidth设置的值会被忽略,将会自动计算的得出。
看看效果
在这里插入图片描述
依然一致,无任何变化
在这里插入图片描述
研究了半天,在这个目录下看到了window的更多说明,疑似专用于类web开发范式
基于类web开发范式,我找到了这个
在这里插入图片描述
Stage模型下的应用或服务的页面仅支持声明式开发范式(推荐),Stage模型下的卡片支持声明式和类web两种开发范式。

上个官方链接

结论(错误的)

在Stage模型下,确定window下的designWidth及autoDesignWidth字段,无任何作用。

修正

发布之后其实我是很放心的,所以我去研究UI了,我很好奇,
我们在上述篇幅中修改的
width(720)
中的720是什么单位,如何保证屏幕兼容的。
我去看文档,无意中看到了这个
在这里插入图片描述

我门上述的720,默认使用的vp,等同于Android中的dp
而lpx是和designwidth有关系的

下图是designWidth和lpx的使用方式
在这里插入图片描述

在这里插入图片描述

结论

designWidth类似于autosize,可以等比例还原设计图,但是组件的width默认输入number是Vp单位的,等同于DP,不受designWidth影响,必须通过==width(px2vp(lpx2px(70)))==将lpx转换为px,暂未发现lpx直接转vp的办法。
所以designWidth和autoDesignWidth都是有效的,只是需要配合**px2vp(lpx2px(70)**使用

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

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

相关文章

mysql笔记:19. 主从复制和主主复制

文章目录 一、主从复制基础1. 主从复制的定义2. 主从复制的原理3. 实战:搭建MySQL的主从复制 二、主从复制的管理1. 用户权限管理2. 日常任务管理2.1. 监控主从复制的状态2.2. 控制主从复制的任务2.2.1. 在从节点上启动和停止主从复制2.2.2. 在从节点上启动和停止I/…

用Stable Diffusion生成同角色不同pose的人脸

随着技术的不断发展,我们现在可以使用稳定扩散技术(Stable Diffusion)来生成同一角色但不同姿势的人脸图片。本文将介绍这一方法的具体步骤,以及如何通过合理的提示语和模型选择来生成出更加真实和多样化的人脸图像。 博客首发地…

【Python】进阶学习:一文解决如何从指定的源目录中,挑选出符合条件的文件,并将这些文件复制到目标目录中

【Python】进阶学习:一文解决如何从指定的源目录中,挑选出符合条件的文件,并将这些文件复制到目标目录中 🌈 个人主页:高斯小哥 🔥 高质量专栏:Matplotlib之旅:零基础精通数据可视化…

cordova cordova-hot-code-push-plugin 插件热更新

node 版本 node-v10.18.0 ,node-v16.14.2-x64 添加插件 Cordova Hot Code Push cordova plugin add cordova-hot-code-push-plugin 添加热更新工具 cordova-hot-code-push-cli npm install -g cordova-hot-code-push-cli 添加cordova-hcp.json文件 此文件是用于…

音频剪辑软件评测,哪一款最适合你?

“音频剪辑小白求解!我正在制作一部个人纪录片,拍摄了很多原始音频素材,但是需要进行剪辑和整理才能使用。我完全不懂音频剪辑,请问有没有简单易懂的教程或者方法,帮助我快速上手并完成剪辑工作呢?” 随着…

5_相机标定_3_calibrateCamera()例子

上次介绍了calibrateCamera()接口参数,这次实际调用。 程序中所用标准标定板。 一、图片预处理 使用的图片原像素是3072*2048,即600万像素,处理起来不快;改成了560*420,即20万像素。调用opencv接口如下: //…

阿里通义灵码体验

点击访问体验 之前有体验过github的代码助手,奈何收费了,上周发现有一个免费的代码助手。 下载安装 vscode 搜索扩展 TONGYI Lingma 安装完成后登陆即可体验 写注释让他写代码 根据上下文自动补充 这里我只写了一个方法名,getAgencyList…

BUG日记之ES中字段中含有特殊字符,存储到SQLserver数据库中,再进行查询查询不到的问题

BUG日记之ES中字段中含有特殊字符,存储到SQLserver数据库中,再进行查询查询不到的问题 废话不多说原因是编码问题 如特殊字符 μ 在ES存储的编码格式是Unicode(存储了世界上所有的字符) sqlserver数据库中通常使用varchar数据类…

二、Eureka注册中心

Eureka注册中心服务端 引入依赖 <dependency><groupId>org.springframework.cloud</groupId><artifactId>spring-cloud-starter-netflix-eureka-server</artifactId> </dependency>编写启动类EnableEurekaServer package com.gwf;impor…

linux安装erlang

摘要 Erlang是一种通用的面向并发的编程语言&#xff0c;它由瑞典电信设备制造商爱立信所辖的CS-Lab开发&#xff0c;目的是创造一种可以应对大规模并发活动的编程语言和运行环境。 环境准备 系统环境 使用命令&#xff1a;uname -a 或者 uname -r&#xff0c;执行后如下&a…

蓝桥杯算法基础(20):(快速排序的其他优化)java版

三点中值法 选主元三点中值法左&#xff0c;中&#xff0c;右&#xff0c;三个位置&#xff0c;取中间值作为主元&#xff0c;与第一个元素交换 public static int partition(int[] A,int p,int r){int pivotA[p];//优化&#xff0c;在p,r,mid之间&#xff0c;选一个中间作为主…

【Mars3d】点位停止编辑时获取点位空间坐标位置信息等回传给后端

示例地址&#xff1a; http://mars3d.cn/editor-vue.html?idgraphic/primitive/point 当前问题&#xff1a; 右键编辑点&#xff0c;开始编辑对象--停止编辑。需要保存编辑后的点到数据库&#xff0c;需要对应的停止编辑函数。 {text: "停止编辑对象",icon: &quo…

浅谈SQL注入漏洞原理及利用方式

1.SQL注入 原理&#xff1a; 在数据交互中&#xff0c;前端的数据传入到后台处理时&#xff0c;由于后端没有做严格的判断&#xff0c;导致其传入的恶意“数据”拼接到SQL语句中后&#xff0c;被当作SQL语句的一部分执行。漏洞产生于脚本&#xff0c;注入是针对数据库进行。 …

Javaweb的学习21_CSS_属性

CSS的属性 (常用)属性&#xff1a; 1. 字体、文本 font-size&#xff1a;字体大小 color&#xff1a;文本颜色 text-align&#xff1a;文本的对齐方式 line-height&#xff1a;行高 2. 背景 background&#xff1a;是个复合属性 3. 边框 border&#xff1a;设置边框&#xff0c…

WordPress自动生成原创文章插件

WordPress作为最受欢迎的内容管理系统之一&#xff0c;为博客和网站的搭建提供了便捷的解决方案。而在内容创作方面&#xff0c;自动生成原创文章的插件为WordPress用户提供了更为高效的选项。 什么是WordPress自动生成原创文章插件&#xff1f; WordPress自动生成原创文章插件…

【NLP学习记录】One-Hot编码

1. One-Hot编码概念 one-hot编码的基本思想是将每个类别映射到一个向量&#xff0c;其中只有一个元素的值为1&#xff0c;其余元素的值为0。这样&#xff0c;每个类别之间相互独立&#xff0c;不存在顺序或距离关系。 举例&#xff1a;对于三个类别的情况&#xff0c;可以使用…

Telegraf--采集指定信息

Telegraf 采集字段解释 根据需求选取需要采集的字段,直接配置在fieldpass中,这样的好处是节约流量,更加简洁明了。下面加粗的部分是telegraf.conf中配置的指标,其他指标根据需求添加即可。 2024年3月18日10:55:41 更新说明: 添加自定义温度指标采集 CPU信息 usage_iowait:…

基于协同过滤的毕业生就业推荐系统python+django+flask

功能&#xff1a; 管理员&#xff1a;主页、个人中心、求职者管理、企业管理、招聘信息管理、就业信息管理、面试邀请管理、就业签约管理、投递的简历管理、系统管理 企业&#xff1a;主页、个人中心、求职者管理、招聘信息管理&#xff08;可看见所有的招聘信息。发布招聘信息…

三 C#插入排序算法

简介 插入排序算法是一种简单、直观的排序算法&#xff0c;其原理是将一个待排序的元素逐个地插入到已经排好序的部分中。 插入排序实现原理 插入排序算法是一种简单、直观的排序算法&#xff0c;其原理是将一个待排序的元素逐个地插入到已经排好序的部分中。 具体实现步骤…

【iOS】Blocks

文章目录 前言一、什么是Blocks二、Blocks模式1.Block语法2.Block类型变量3.截获自动变量值4.__block说明符5.截获的自动变量 三、Blocks的实现1.Block的实质__main_block_impl_0Block对象的实现结构体初始化 2.截获自动变量值3.__block说明符4.Block存储域5.__block变量存储域…