weex android 简书,Weex应用在android studio中

注：以下文档都是假设您已经具备一定的Android开发经验。

前期准备

已经安装了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)

快速接入

步骤如下：

创建Android工程，没有什么要特别说明的，按照你的习惯来。

修改build.gradle 加入如下基础依赖

compile 'com.android.support:recyclerview-v7:23.1.1'

compile 'com.android.support:support-v4:23.1.1'

compile 'com.android.support:appcompat-v7:23.1.1'

compile 'com.alibaba:fastjson:1.1.46.android'compile '

com.taobao.android:weex_sdk:0.5.1@aar'

注:版本可以高不可以低。

MainActivity.java代码如下：

public class MainActivity extends AppCompatActivity implements IWXRenderListener{

private LinearLayout container;

private WXSDKInstance mWXSDKInstance;

private Handler mHander = new Handler(){

@Override

public void handleMessage(Message msg) {

super.handleMessage(msg);

Log.e("xxxx","handleMessage");

if(msg.what == 100){

if(WXSDKEngine.isInitialized()){

startRender();

}

}else{

mHander.sendEmptyMessageDelayed(100,100);

}

}

};

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

container = findViewById(R.id.container);

mWXSDKInstance = new WXSDKInstance(this);

mWXSDKInstance.registerRenderListener(this);

/** * WXSample 可以替换成自定义的字符串，针对埋点有效。

* template 是.we transform 后的 js文件。

* option 可以为空，或者通过option传入 js需要的参数。例如bundle js的地址等。

* jsonInitData 可以为空。

* width 为-1 默认全屏，可以自己定制。

* height =-1 默认全屏，可以自己定制。

*/

if(WXSDKEngine.isInitialized()){

startRender();

}else{

mHander.sendEmptyMessageDelayed(100,1000);

}

}

private void startRender(){

mWXSDKInstance.render("WXSample",WXFileUtils.loadAsset("test.js", this),null,"",           WXRenderStrategy.APPEND_ASYNC);

}

@Override

public void onViewCreated(WXSDKInstance instance, View view) {

if(null != container){

container.addView(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();

}

}

}

R.layout.activity_main代码如图所示:

代码上传不上去，只能截图了

注：

test.js是在main下面创建的assets目录，如果没有，自己创建一个文件夹就可以了

test.js必须是通过vue文件打包后生成的js文件

遇到的问题：

1.如果报多个dex合并异常的错误，可以试试在build.gradle中的android选项下面增加multiDexEnabled true

在dependencies中配置compile 'com.android.support:multidex:1.0.0'

2.Error:Error converting bytecode to dex:

如果遇到这样的错误，在build.gradle中的Android选项下配置

dexOptions {    jumboMode true}

作者也刚开始学习weex，如果有不对的地方，欢迎指正，也希望大家和我一起交流！

参考文章：http://weex.apache.org/cn/guide/integrate-to-your-app.html