注：以下文档都是假设您已经具备一定的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
网友评论