美文网首页
Weex android集成

Weex android集成

作者: 比目鱼26 | 来源:发表于2018-01-11 18:38 被阅读0次

    Android 集成有两种方式

    1. 源码依赖:能够快速使用WEEX最新功能,可以根据自己项目的特性进行相关改进。
    2. 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/

    相关文章

      网友评论

          本文标题:Weex android集成

          本文链接:https://www.haomeiwen.com/subject/puytoxtx.html