Weex 屏幕參數接口

2023-12-28 15:54 更新

我們通過添加一系列接口讓 Weex 使用者可以控制排版參數。

一、設置頁面使用的 viewPortWidth

1. 使用 Meta Module

const meta = weex.requireModule('meta');
meta.setViewport({
    width: 800
});

2. 使用 WXSDKInstance 的接口

  • iOS:
WXSDKInstance* instance = [[WXSDKInstance alloc] init];
[instance setViewportWidth:800.f];
  • Android:
WXSDKInstance instance = new WXSDKInstance(mContext);
instance.setInstanceViewPortWidth(800);

二、設置頁面使用的 deviceWidth

Android暫不支持

1. 使用 Meta Module

const meta = weex.requireModule('meta');
meta.setViewport({
    deviceWidth: 375,
    deviceHeight: 800
});

2. 使用 WXSDKInstance 的接口

WXSDKInstance* instance = [[WXSDKInstance alloc] init];
[instance setPageRequiredWidth:375.f height:800.f];

3. 設置全局的 deviceWidth

[WXSDKEngine setGlobalDeviceSize:CGSizeMake([UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height)];

三、設置頁面保留原始 CSS 樣式值

1. 使用 Meta Module

const meta = weex.requireModule('meta');
meta.setViewport({
    reserveCssStyles: true
});

2. 使用 WXSDKInstance 的接口

  • iOS:
WXSDKInstance* instance = [[WXSDKInstance alloc] init];
[instance setPageKeepRawCssStyles];
  • Android:
WXSDKInstance instance = new WXSDKInstance(mContext);
instance.setPageKeepRawCssStyles();

四、強制頁面重新排版

  • iOS:
[instance reloadLayout];
  • Android:
instance.reloadPageLayout();


以上內容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號