Weex 如何将前端样式值转换为系统坐标值

以 iOS 为例，在应用启动时，Weex 获取当前屏幕宽度作为全局默认值。在 iOS 系统上该宽度为实际像素/屏幕比例后的 UIKit 宽度。比如 iPhone6 为 375。

@implementation WXCoreBridge

+ (void)install
{
    static dispatch_once_t onceToken;
    dispatch_once(&onceToken, ^{
        WeexCore::WXCoreEnvironment* env = WeexCore::WXCoreEnvironment::getInstance();
        env->SetPlatform(OS_iOS);
        env->AddOption("scale", "1");
        
        CGSize screenSize = [UIScreen mainScreen].bounds.size;
        env->SetDeviceWidth(std::to_string(screenSize.width));
        env->SetDeviceHeight(std::to_string(screenSize.height));
        ...
        ...
}

创建的每个 WXSDKInstance，其默认的 viewPortWidth 为 750px。

// The default screen width which helps us to calculate the real size or scale in different devices.
static const CGFloat WXDefaultScreenWidth = 750.0;

当指定 CSS 样式值为 "375px" 时，Weex 在接收到该样式后，自动根据当前屏幕宽度和当前 Instance 的 viewPortWidth 计算出在 iOS 系统上，对应的 UIKit 坐标值为：

dimension(UIKit) = dimensionPx(CSS) / viewPortWidth(instance) * globalScreenWidth

代入后： dimension(UIKit) = 375 / 750 * 375 = 187.5

之后 Weex 排版引擎使用 187.5 来排版，并最终将排版后的结果设置给 iOS UIView。之后没有坐标转换过程了。