uni-app
使用 upx 作为默认尺寸单位, upx 是相对于基准宽度的单位,可以根据屏幕宽度进行自适应。uni-app
规定屏幕基准宽度750upx。
开发者可以通过设计稿基准宽度计算页面元素 upx 值,设计稿 1px 与框架样式 1upx 转换公式如下:
设计稿 1px / 设计稿基准宽度 = 框架样式 1upx / 750upx
举例说明:
- 若设计稿宽度为 640px,元素 A 在设计稿上的宽度为 100px,那么元素 A 在
uni-app
里面的宽度应该设为:750 * 100 / 640
,结果为:117upx。 - 若设计稿宽度为 375px,元素 B 在设计稿上的宽度为 200px,那么元素 B 在
uni-app
里面的宽度应该设为:750 * 200 / 375
,结果为:400upx。
1、动态绑定的 style
不支持直接使用 upx
。
2、使用 uni.upx2px(Number)
转换为 px
后再赋值。
半屏宽度