Android 集成有两种方式
- 源码依赖:能够快速使用WEEX最新功能,可以根据自己项目的特性进行相关改进。
- SDK依赖:WEEX 会在jcenter 定期发布稳定版本。jcenter
注:国内可能需要翻墙
前期准备
- 已经安装了JDK version>=1.7 并配置了环境变量
- 已经安装Android SDK 并配置环境变量。
- Android SDK version 23 (compileSdkVersion in
build.gradle
) - SDK build tools version 23.0.1 (buildToolsVersion in
build.gradle
) - Android Support Repository >= 17 (for Android Support Library)
快速接入
如果你是尝鲜或者对稳定性要求比较高可以使用依赖SDK的方式。
步骤如下:
创建Android工程,没有什么要特别说明的,按照你的习惯来。
修改build.gradle 加入如下基础依赖
implementation 'com.android.support:recyclerview-v7:26.1.0'
implementation 'com.alibaba:fastjson:1.1.67.android'
implementation 'com.taobao.android:weex_sdk:0.10.0@aar'
implementation ('com.github.bumptech.glide:glide:4.5.0') {
exclude group: 'com.android.support'
}
注:版本可以高不可以低。Glide作为一个图片渲染库,不是必选项,可自行实现或者选择其他轮子,比如Picasso、Fresco
代码实现
- 实现图片下载接口,初始化时设置。
import android.widget.ImageView;
import com.bumptech.glide.Glide;
import com.taobao.weex.WXEnvironment;
import com.taobao.weex.adapter.IWXImgLoaderAdapter;
import com.taobao.weex.common.WXImageStrategy;
import com.taobao.weex.dom.WXImageQuality;
/**
* Created by wsl on 18/1/11.
*/
public class ImageAdapter implements IWXImgLoaderAdapter {
@Override
public void setImage(String url, ImageView view, WXImageQuality quality, WXImageStrategy strategy) {
Glide.with(WXEnvironment.getApplication()).load(url).into(view);
}
}
- 初始化
import android.app.Application;
import com.taobao.weex.InitConfig;
import com.taobao.weex.WXSDKEngine;
/**
* Created by wsl on 18/1/11.
*/
public class WeexApplication extends Application {
@Override
public void onCreate() {
super.onCreate();
InitConfig.Builder builder = new InitConfig.Builder();
builder.setImgAdapter(new ImageAdapter());
InitConfig config = builder.build();
WXSDKEngine.initialize(this, config);
}
}
- 开始渲染
public class MainActivity extends AppCompatActivity implements IWXRenderListener {
private WXSDKInstance mWXSDKInstance;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
mWXSDKInstance = new WXSDKInstance(this);
mWXSDKInstance.registerRenderListener(this);
mWXSDKInstance.render(getLocalClassName(), WXFileUtils.loadAsset("index.js", this),
null, null, -1, -1, WXRenderStrategy.APPEND_ASYNC);
}
@Override
public void onViewCreated(WXSDKInstance instance, View view) {
setContentView(view);
}
@Override
public void onRenderSuccess(WXSDKInstance instance, int width, int height) {
}
@Override
public void onRefreshSuccess(WXSDKInstance instance, int width, int height) {
}
@Override
public void onException(WXSDKInstance instance, String errCode, String msg) {
}
@Override
protected void onResume() {
super.onResume();
if(mWXSDKInstance!=null){
mWXSDKInstance.onActivityResume();
}
}
@Override
protected void onPause() {
super.onPause();
if(mWXSDKInstance!=null){
mWXSDKInstance.onActivityPause();
}
}
@Override
protected void onStop() {
super.onStop();
if(mWXSDKInstance!=null){
mWXSDKInstance.onActivityStop();
}
}
@Override
protected void onDestroy() {
super.onDestroy();
if(mWXSDKInstance!=null){
mWXSDKInstance.onActivityDestroy();
}
}
}
重要的是这三行代码:
mWXSDKInstance = new WXSDKInstance(this);
mWXSDKInstance.registerRenderListener(this);
mWXSDKInstance.render(getLocalClassName(), WXFileUtils.loadAsset("index.js", this),
null, null, -1, -1, WXRenderStrategy.APPEND_ASYNC);
render里面对应的js文件是通过weex-toolkit打包出来的.
这里也可以把渲染出来的view加到已有的layout里
@Override
public void onViewCreated(WXSDKInstance instance, View view) {
FrameLayout layout = findViewById(R.id.xxx);
layout.addView(view);
//setContentView(view);
}
这样整个过程就完成了
参考连接
https://weex.apache.org/cn/guide/integrate-to-your-app.html
https://yq.aliyun.com/articles/58743
http://yifeng.studio/2016/11/11/weex-series-two-android-integration/