android DSBridge混合开发交互利器

腾讯X5内核支持:https://github.com/wendux/DSBridge-Android/tree/x5-3.0

Android studio配置如下:

  1. 添加 JitPack repository 到gradle脚本中

    allprojects {
      repositories {
       ...
       maven { url 'https://jitpack.io' }
      }
    }
2.
dependencies {
   compile 'com.github.wendux:DSBridge-Android:x5-3.0-SNAPSHOT'
}

使用事例如下:

(1)native调用js ,js处理完成之后,给native一个回调,通知完成了

  1. js端注册一个函数 供native调用

html>
lang="en">

    charset="UTF-8">
    </span>native-call-js<span style="color:#e8bf6a;">
    name="renderer" content="webkit">
    http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    name="viewport" content="width=device-width,initial-scale=0.5,user-scalable=no"/>
    
    


结果:
id="result">

2.native端调用js中注册的函数,传递目标参数,接受js的回调

/**
 * JsBridge demo
 * @author summer
 *
 * */

public class MainActivity extends AppCompatActivity implements View.OnClickListener{

    private DWebView mDWebView;
    private Button mBtnAddValue;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
        initEvent();
        initWebView();

    }

    private void initEvent() {
        mBtnAddValue.setOnClickListener(this);
    }

    private <T extends View> T getView(int id){
        View view=findViewById(id);
        return (T) view;
    }

    private void initWebView() {
        DWebView.setWebContentsDebuggingEnabled(true);
        mDWebView.loadUrl("file:///android_asset/native-call-js.html");
    }

    private void initView() {
        mDWebView=getView(R.id.webview);
        mBtnAddValue=getView(R.id.btn_add_value);
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()){
            case R.id.btn_add_value:
                addValue();
                break;
        }
    }


    /**
     * native 调用js的方法,
     * js最后在将处理的结果回调给native
     *
     * */
    private void addValue() {
     mDWebView.callHandler("addValue", new Object[]{1, 2}, new OnReturnValue() {
         @Override
         public void onValue(Integer integer) {
             Toast.makeText(MainActivity.this ,integer+"", Toast.LENGTH_SHORT).show();
         }
     });
    }
}

测试成功

2.js调用native

同理,在native中注册一个函数供js调用,native处理完成之后,将结果回调个js,通知js本次处理完成

native注册一个函数,供js调用,为了便于管理,将函数封装在一个类中:

/**
 * native注册函数,供js调用
 * @author summer
 */

public class JsApi {
    //同步
    @JavascriptInterface
    public String testSyn(Object msg)  {
        return msg + "syn call";
    }

    //异步回调
    @JavascriptInterface
    public void testAsyn(Object msg, CompletionHandler handler){
        handler.complete(msg+" [ asyn call]");
    }
}

activity配置:

public class JsCallNativeActivity extends AppCompatActivity {
    private DWebView mDWebView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_js_call_native);
        initView();
        initData();
    }

    private void initData() {
// set debug mode
        DWebView.setWebContentsDebuggingEnabled(true);
        mDWebView.addJavascriptObject(new JsApi(), null);

        mDWebView.loadUrl("file:///android_asset/js-call-native.html");
    }


    private void initView() {
        mDWebView=getView(R.id.dwebview);
    }

    private <T extends View> T getView(int id){
        return (T)findViewById(id);
    }


}

js调用native方法:

html>
lang="en">

    charset="UTF-8">
    </span>js-call-native<span style="color:#e8bf6a;">
    name="renderer" content="webkit">
    http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    name="viewport" content="width=device-width,initial-scale=0.5,user-scalable=no"/>
    
    
    


class="btn" οnclick="callSyn()">Synchronous call
class="btn" οnclick="callAsyn()">Asynchronous call

so easy~~~

DsBridge的更多用法,可以参考官方demo.

DsBridge github:

https://github.com/wendux/DSBridge-Android/tree/x5-3.0

你可能感兴趣的:(android)