style-unit

3.0.5 • Public • Published

style-unit

Unit conversion for calculating dimensional css attributes, especially for rpx.

API

convertUnit(value, prop, platform);

Property Type Required Description
value string/number true
prop string true
platform string false Auto assignment with universal-env, different platforms have different rpx conversion. Details are as follows.

Web

In Web, Calculate rpx to vw (relative to viewport width 750).

750rpx -> 100vw

setViewportWidth

You can use setViewportWidth method update viewport width

setViewportWidth(1500);

750rpx -> 50vw

Weex

In Weex, Calculate rpx to px (viewport width is 750).

750rpx -> 750px

setRpx

You can use setRpx method update coefficient of 750

setRpx(1500 / 750)

750rpx -> 1500px

MiniApp

rpx (responsive pixel): Adaptable to the screen width in MiniApp. The specified screen width is 750 rpx. If the screen width on iPhone6 is 375 px (750 physical pixels), then 750 rpx = 375 px = 750 physical pixels, i.e. 1 rpx = 0.5 px = 1 physical pixel.

Node.js

Use Weex result:

convertUnit('500rpx', 'width', 'weex')

Use Web result:

convertUnit('500rpx', 'width', 'web')

Dependencies (2)

Dev Dependencies (0)

    Package Sidebar

    Install

    npm i style-unit

    Weekly Downloads

    1,815

    Version

    3.0.5

    License

    BSD-3-Clause

    Unpacked Size

    10.5 kB

    Total Files

    5

    Last publish

    Collaborators

    • zeroling
    • wintercn
    • yuanyan
    • fyangstudio
    • oraaange
    • yacheng
    • rax-publisher