长度单位
Hummer 中支持的各种长度单位。目前支持hm
、px
、纯数值
、%
四种长度单位。
WARNING
- 不支持
rem
、em
、pt
、vh
、vm
等单位。 - 目前从 TS 侧设置给 Native 侧的长度单位,都支持 以上四种 单位,而从 Native 侧返回到 TS 侧的长度单位,只支持
纯数值
单位。
hm
Hummer 特有长度单位,为前端常用单位,任何移动设备的全屏宽均为750hm
。
px
移动设备屏幕物理像素点。比如某个手机屏幕分辨率是1920x1080
,那么就意味着该屏幕的宽度是1080px
,高度是1920px
。即在这个分辨率下,750hm == 1080px
。
纯数值
纯数值单位为客户端常用单位,是一个逻辑像素单位,根据移动设备的屏幕DPI(像素密度)
计算而来,目的是为了使相同物理大小的屏幕,在不同像素密度的情况下,同一尺寸的视图,看起来是一样大的。在 Android 端对应的是dp
,在 iOS 端对应的是pt
。比如某个手机屏幕分辨率是1920x1080
,DPI
为3.0
,那么全屏宽即为1080/3.0 (dp或pt)
。
%
占据父元素的百分比。比如父元素宽度是100px
,那么50%
即为50px
。
示例
示例一
- 屏幕分辨率:
1920x1080
- 屏幕 DPI:3.0
- 单位关系:
750hm == 1080px == 1080/3.0 (dp或pt)
示例二
- 屏幕分辨率:
2560x1440
- 屏幕 DPI:3.5
- 单位关系:
750hm == 1440px == 1440/3.5 (dp或pt)