weex嵌入到android工程(window系统)

HelloWorld实践

1.建立Android Project。module命名为WeexDemo.MainActivity选择EmptyActivity就好。
2.配置build.gradle。在app的build.gradle添加Weex依赖。如下

    compile 'com.android.support:appcompat-v7:23.0.1'
    compile 'com.android.support:recyclerview-v7:23.0.1'
    compile 'com.android.support:support-v4:23.0.1'
    compile 'com.alibaba:fastjson:1.1.45'
    compile 'it.sephiroth.android.library.picasso:picasso:2.5.2.4b'

后面两个依赖库,分别是fastjson解析Json,picasso图片加载,不加会出现 ClassNotFoundException。

3.在Mainfest.xml中添加网络权限

<uses-permission android:name="android.permission.INTERNET"/>

4.在工程中Application启动Weex RunTime,用于渲染UI,创建一个类WXAppliaction继承Application。

import android.app.Application;
import com.taobao.weex.InitConfig;
import com.taobao.weex.WXSDKEngine;
/**
 * Created by Administrator on 2016/12/15.
 */
public class WXApplication extends Application {
    @Override
    public void onCreate() {
        super.onCreate();
        InitConfig config=new InitConfig.Builder().setImgAdapter(new ImageAdapter()).build();
        WXSDKEngine.initialize(this,config);
    }
}

ImageAdapter是自定义一个类,用于加载网络图片。如果没有配置这个ImageAdapter,就会出现ClassNotFoundException错误。

import com.taobao.weex.adapter.IWXImgLoaderAdapter;
import com.taobao.weex.common.WXImageStrategy;
import com.taobao.weex.dom.WXImageQuality;
import it.sephiroth.android.library.picasso.Picasso;
/**
 * Created by Administrator on 2016/12/15.
 */
public class ImageAdapter implements IWXImgLoaderAdapter {
    @Override
    public void setImage(String url, ImageView view, WXImageQuality quality, WXImageStrategy strategy) {
        //实现你自己的图片下载,否则图片无法显示。
        Log.d("url",url);
        Picasso.with(view.getContext()).load(url).into(view);
    }
}

log日记你可以清晰看到之前.we文件添加图片的地址。

注意,必须记得到Mainfest.xml清单文件中更改上下文:

<application
        android:name=".WXApplication"
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">

5.在weex工程中运行文件hello.we文件:
weex hello.we
就会生成一个文件夹 weex_tmp,weex_tmp\h5_render下找到hello.js文件。
6.在android project工程中main目录下创建assets,将hello.js文件复制进去。
7.在MainActivity中渲染UI


import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import com.taobao.weex.IWXRenderListener;
import com.taobao.weex.WXSDKEngine;
import com.taobao.weex.WXSDKInstance;
import com.taobao.weex.common.WXRenderStrategy;
import com.taobao.weex.utils.WXFileUtils;
public class MainActivity extends AppCompatActivity implements IWXRenderListener{
    WXSDKInstance mWXSDKInstance;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mWXSDKInstance=new WXSDKInstance(this);
        mWXSDKInstance.registerRenderListener(this);
        /**
         * WXSample 可以替换成自定义的字符串,针对埋点有效。
         * template 是.we transform 后的 js文件。
         * option 可以为空,或者通过option传入 js需要的参数。例如bundle js的地址等。
         * jsonInitData 可以为空。
         * width 为-1 默认全屏,可以自己定制。
         * height =-1 默认全屏,可以自己定制。
         */
        mWXSDKInstance.render("WeexDemo", WXFileUtils.loadAsset("hello.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();
    }
}

布局文件为:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    tools:context="com.example.chen.weexdemo2.MainActivity">
</RelativeLayout>

到此,这个weex嵌入到android project就完成了。运行WeexDemo就可以出现效果。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值