BoneMobile 容器 SDK
更新时间:2018-12-19 17:34:02
概述
BoneMobile 容器 SDK 为可选模块,提供了加载插件的功能。如果您需要开发或者使用插件,则需要在 App 中集成 BoneMobile 容器 SDK。
| 依赖SDK | 概述 |
|---|---|
| API 通道 | 提供API通道能力 |
初始化
初始化 BoneMobile 容器 SDK 前,请先初始化 API 通道 SDK,请参见:API 通道SDK - 初始化。请在 Application.onCreate 函数中,添加如下初始化代码:
String serverEnv = "production";//仅支持"production",即生产环境
String pluginEnv = "release";//仅支持“release”
String language = "zh-CN";//语言环境,目前仅支持“zh-CN”,“en-US”
// 初始化 BoneMobile RN 容器
InitializationHelper.initialize(application, pluginEnv, serverEnv,language);
// 添加基于 Fresco 的图片组件支持
RNGlobalConfig.addBizPackage(new FrescoPackage());
使用方式
打开插件面板
请参见如下代码打开插件面板:
// 第一参数,当前上下文,通常是 Activity
// 第二参数,格式为“link://plugin/{插件 Id}”, 可以参见想要打开的插件的具体说明,以下以打开国内配网插件为例
Router.getInstance().toUrl(context, "link://router/connectConfig"); // "link://plugin/a123kfz2KdRdrfYc"已不再推荐使用
打开插件面板并接收返回值
请参见调用配网插件,并接受配网结果的例子:
// 启动插件
Bundle bundle = new Bundle();
bundle.putString("productKey", pk);
Router.getInstance().toUrlForResult(activity, "link://router/connectConfig",{your_request_code}, bundle);
// 接收配网结果
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
...
if (REQUEST_CODE_PRODUCT_ADD == requestCode) {
if (Activity.RESULT_OK != resultCode) {
// 配网失败
return;
}
String productKey = data.getStringExtra("productKey");
String deviceName = data.getStringExtra("deviceName");
// 配网成功
}
}
打开调试面板
请参见如下代码使用本地调试功能:
String ip = "{IP地址}"; //开发电脑上要开启 Bone 调试服务
new BoneDevHelper().getBundleInfoAsync(this, ip, new BoneDevHelper.OnBondBundleInfoGetListener() {
@Override
public void onSuccess(BoneDevHelper.BoneBundleInfo boneBundleInfo) {
BoneDevHelper.RouterInfo info = new BoneDevHelper().handleBundleInfo(MainActivity.this, boneBundleInfo);
if (null == info) {
return;
}
Router.getInstance().toUrl(MainActivity.this, info.url, info.bundle);
}
@Override
public void onError(String message, Exception e) {
Toast.makeText(MainActivity.this, message, Toast.LENGTH_SHORT).show();
if (null != e) {
e.printStackTrace();
}
}
});
混淆配置
请参见:混淆配置
更多功能
集成账号能力
插件中如果需要访问当前用户相关信息(例如: 当前用户是否登陆?用户的昵称是什么?),需要集成账号及用户 SDK,并注册 API 到容器。
账号 SDK 的集成请参见: 账号及用户 SDK
API 注册到容器,请参考如下代码:
BonePluginRegistry.register(BoneUserAccountPlugin.API_NAME, BoneUserAccountPlugin.class);
集成设备模型能力
插件中如果需要使用设备模型 API(比如设备面板的场景),则需要集成设备模型 SDK,并注册 API 到容器。
设备模型 SDK 的集成,请参见设备模型 SDK;
API 注册到容器,请参考如代码:
BonePluginRegistry.register("BoneThing", BoneThing.class);
集成配网能力
插件中如果需要使用配网能力,则需要集成配网SDK,并注册 API 到容器。
配网 SDK 的集成,请参见: 配网SDK
API 的注册,请参考如下代码:
BonePluginRegistry.register("BoneAddDeviceBiz",BoneAddDeviceBiz.class);
BonePluginRegistry.register("BoneLocalDeviceMgr",BoneLocalDeviceMgr.class);
BonePluginRegistry.register("BoneHotspotHelper",BoneHotspotHelper.class);
// 如果需要绑定蓝牙设备,需要添加如下代码
BonePluginRegistry.register("BoneThing", BoneThing.class);
集成长连接能力
插件中如果需要订阅云端消息,则需要集成长连接通道 SDK,并注册 API 到容器。
长连接通道 SDK 的基础,请参见: 长连接通道 SDK
API 的注册,请参考如下代码:
BonePluginRegistry.register("BoneChannel", BoneChannel.class);
Native 和 JS 共享配置
某些业务场景下, Native 端和 JS 端可能需要共享一些配置。为了满足这个需求,我们开辟了一个 Native 和 JS 都可以访问的配置区。
JS 端访问配置区,请参见:环境配置信息
Android 端访问配置区,可以参考如下代码:
// 设置
BoneConfig.set("region", "china");
// 获取
String region = BoneConfig.get("region");
图片库替换
为了减小 BoneKit 的 SDK 大小,降低接入成本及运行期的 CPU /内存/文件系统资源消耗。
BoneMobileRN容器允许开发者定制自己想用的图片库组件。
如果您已经有了成熟的 apk,并且使用了 Fresco 以外的图片库,请参见以下步骤替换图片库。
注意:因为各个图片库支持的 feature 有所差异,所以替换图片库的时候,请注意以下问题:
gif 的支持。请尽量使用支持 gif 动画的图片库或者自己实现对于 gif 的支持,否则可能导致部分 使用了 gif 图片的页面不能正确的展示
图片圆角的支持。请实现对于圆角的支持,否则部分设置了圆角的图片可能无法正常展示
1. 实现 ImageLoaderModule
实现 ImageLoaderModule,请参见 Facebook 的官方说明:Native Modules
请参见 Facebook 基于 Fresco 实现的ImageLoaderModule, 来实现您的 ImageLoaderModule。
2. 实现 ReactImageManager
实现 ReactImageManager,请参见 Facebook 的官方说明:Native UI Components
请参见 Facebook 基于 Fresco 实现的ReactImageManager.java,来实现您的 ReactImageManager。
3. 实现 ReactTextInlineImageViewManager
实现 ReactTextInlineImageViewManager 与实现 ReactImageViewManager 类似,都继承自 ViewManager,但差别在于,这次需要实现 ShadowNode。ShadowNode 需要继承自 ReactTextInlineImageShadowNode,请参见基于 Fresco 实现的 FrescoBasedReactTextInlineImageViewManager和 FrescoBasedReactTextInlineImageShadowNode 来实现您的 ReactTextInlineImageViewManager。
4. 实现 ImagePackage
ImagePackage 的实现比较简单,把前面步骤实现的 API 和组件暴露出来即可。
参见下面的代码:
public class FrescoPackage implements ReactPackage {
@Override
public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {
return Arrays.<NativeModule>asList(
new ImageLoaderModule(reactContext)
);
}
@Override
public List<Class<? extends JavaScriptModule>> createJSModules() {
return Collections.emptyList();
}
@Override
public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {
return Arrays.<ViewManager>asList(
new ReactImageManager(),
new FrescoBasedReactTextInlineImageViewManager()
);
}
}
5. 注册 ImagePackage
最后把刚才实现的 ImagePackage 注册到 BoneKit 的全局配置即可:
// 添加你自己的图片组件支持
InitializationHelper.addBizPackage(new ImagePackage());
6. 删除 Fresco 的相关依赖和代码
删除 Fresco 的依赖,仅保留 BoneKit 的依赖,参见如下:
compile ('com.aliyun.iot.aep.page:rn:0.0.3.2-SNAPSHOT'){
exclude group:'com.aliyun.iot.aep.sdk', module:'rn-external-fresco' //移除Fresco的依赖
}
compile 'com.aliyun.alink.external:flog:1.0.0@aar'//ReactNative使用了Fresco内部的Flog相关类,Fresco移除后,需要额外添加flog
删除 FrescoPackage 的添加代码:
// 添加基于 Fresco 的图片组件支持
// InitializationHelper.addBizPackage(new FrescoPackage());
支持GIF WebP
Android 平台下,默认不支持 GIF、WebP 格式。可以增加支持库:
dependencies {
compile 'com.facebook.fresco:animated-gif:0.11.0' //需要GIF动画支持添加本行语句
compile 'com.facebook.fresco:webpsupport:0.11.0' //需要WebP格式支持添加本行语句
compile 'com.facebook.fresco:animated-webp:0.11.0' //需要WebP动画支持添加本行语句
}