HarmonyOS 鸿蒙Next关于屏幕适配的问题求助(lpx)

发布于 1周前 作者 vueper 来自 鸿蒙OS

HarmonyOS 鸿蒙Next关于屏幕适配的问题求助(lpx)

不知道大家都是怎么做屏幕适配的,可以交流学习一下~~

我有个问题虚心请教各位:

设计稿是750*1334px的,我在main_pages.json5里面配置了

“window”: {
“designWidth”: 750,
“autoDesignWidth”: false
}<button style="position: absolute; padding: 4px 8px 0px; cursor: pointer; top: 8px; right: 8px; font-size: 14px;">复制</button>

请问在开发过程中,关于组件的宽高、margin、padding、字体大小等这些数值都要用lpx单位吗,我怎么感觉用了lpx后字体变小了,组件间距也变小了,变得挤了一些,跟设计稿反而不太一样了呢?

另外,比如说创建一个宽度为100的按钮,我看有些朋友写的宽度为:lpx2px(100) + ‘px’ ,这种方式设置的宽高,而有些是直接设置宽度为"100lpx",应该用哪种方式呢?



关于HarmonyOS 鸿蒙Next关于屏幕适配的问题求助(lpx)的问题,您也可以访问:https://www.itying.com/category-93-b0.html 联系官网客服。

10 回复

希望HarmonyOS能继续推出更多实用的功能,满足用户的不同需求。

自适配不是通过获取断点类型来决定页面布局吗?用vp单位会不会更好?

找HarmonyOS工作还需要会Flutter的哦,有需要Flutter教程的可以学学大地老师的教程,很不错,B站免费学的哦:https://www.bilibili.com/video/BV1S4411E7LY/?p=17

有要学HarmonyOS AI的同学吗,联系我:https://www.itying.com/goods-1206.html

还是用lpx更好,用vp单位后,在不同的手机,用户在手机中设置不同的主题字号后,app内显示的布局样式都会多少存在差异,没办法像lpx那样等比缩放,当不懂技术的产品、领导来问为什么不同的手机展示的效果和设计图不完全一样,为什么设计图上这一行能显示5个按钮,你做的这个手机能显示5个半?你要花很多时间去解释,还不一定能解释的通。

那你是不是没用flex布局?vp是要搭配flex来玩的,也是缩放自如

用了flex也可以用lpx实现,不需要搭配vp。vp在密度不同的手机展示效果不一样的。用displayInfo.densityDPI可以获取密度,参考【https://developer.huawei.com/consumer/cn/blog/topic/03158411427459025】。也就是说如果你写了30vp,当不同的密度设备,你会发现展示大小不一样。鸿蒙的vp有自己的一套计算规则,这其实并不利于适配。可以参考微信小程序中的rpx单位(就是现在鸿蒙的lpx单位),能更方便直观的去按设计图写代码。 如果遇到折叠屏、平板等设备,那就再获取设备类型,根据宽度不同,多设计几套设计图,多写几套lpx单位的布局就行。

直接'100lpx'就行,

注意事项,当designWidth=750时,预览器有bug还是按720显示,但真机才发现和设计图一模一样。

组件的宽高、margin、padding、字体大小等这些数值都要用lpx单位吗

是的,这样会等比缩放尽量和设计图保持一致,但如果有特殊需求还是要改改的,比如隐私政策希望的是屏幕越大展示的内容越多,这种情况就用vp或者px就好了

回到顶部