ionic调用android原生代码,ionic和原生安卓混合开发遇到的交互问题和指定页面跳转问题...-优快云博客

第一步：从安卓里调用ionic指定页面

主要是通过WebView打开h5界面

NewWebViewActivity主要代码

import android.app.Activity;

import android.content.BroadcastReceiver;

import android.content.Context;

import android.content.Intent;

import android.content.IntentFilter;

import android.os.Bundle;

import android.view.KeyEvent;

import android.view.View;

import android.webkit.WebChromeClient;

import android.webkit.WebSettings;

import android.webkit.WebView;

import android.webkit.WebViewClient;

import android.widget.Toast;

import com.example.lmtpddemo.view.SimpleHorizontalProgressbar;

import androidx.localbroadcastmanager.content.LocalBroadcastManager;

/**

* Description：主要用于与ionic交互

public class NewWebViewActivity extends Activity {

//预约挂号

public static final int ACTION_REG = 1;

//选择医院

public static final int ACTION_SELECT_HOS = 2;

//页面类型

public final static String ACT_TYPE = NewWebViewActivity.class.getName() + ".actType";

//webview

private WebView mWebView;

//水平进度条

private SimpleHorizontalProgressbar mHorizontalProgressbar;

//地址

private String mUrl;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

LocalBroadcastManager.getInstance(this).registerReceiver(receiver, new IntentFilter("jumpNative"));

setContentView(R.layout.activity_new_web_view);

mWebView = (WebView) findViewById(R.id.web_view);

mHorizontalProgressbar = (SimpleHorizontalProgressbar) findViewById(R.id.horizontal_pbr);

WebSettings webSettings = mWebView.getSettings();

webSettings.setCacheMode(WebSettings.LOAD_NO_CACHE);

// 设置与Js交互的权限

webSettings.setJavaScriptEnabled(true);

webSettings.setDomStorageEnabled(true);//开启DOM

// 设置允许JS弹窗

webSettings.setJavaScriptCanOpenWindowsAutomatically(true);

int actType = getIntent().getIntExtra(ACT_TYPE, ACTION_REG);

if (actType == ACTION_REG) {

mUrl = "http://192.168.20.131:8105/#/GetBigDeptPage";

} else if (actType == ACTION_SELECT_HOS) {

mUrl = "http://192.168.20.131:8105/#/SelectHospitalPage";

}

System.out.println();

// 先载入JS代码

// 格式规定为:file:///android_asset/文件名.html

mWebView.loadUrl(mUrl);

mWebView.setWebViewClient(new WebViewClient() {

@Override

// 在点击请求的是链接是才会调用，重写此方法返回true表明点击网页里面的链接还是在当前的webview里跳转，不跳到浏览器那边。这个函数我们可以做很多操作，比如我们读取到某些特殊的URL，于是就可以不打开地址，取消这个操作，进行预先定义的其他操作，这对一个程序是非常必要的。

public boolean shouldOverrideUrlLoading(WebView view, String url) {

// 判断url链接中是否含有某个字段，如果有就执行指定的跳转(不执行跳转url链接)，如果没有就加载url链接

System.out.println("ionicUrl = " + url);

if (url.contains("/finish")) {

finish();

return true;

} else {

return false;

}

});

//设置进度条

mWebView.setWebChromeClient(new WebChromeClient() {

@Override

public void onProgressChanged(WebView view, int newProgress) {

if (newProgress == 100) {

mHorizontalProgressbar.setVisibility(View.INVISIBLE);

} else {

if (View.INVISIBLE == mHorizontalProgressbar.getVisibility()) {

mHorizontalProgressbar.setVisibility(View.VISIBLE);

}

mHorizontalProgressbar.setProgress(newProgress);

}

super.onProgressChanged(view, newProgress);

}

@Override

public void onReceivedTitle(WebView view, String title) {

super.onReceivedTitle(view, title);

if (title != null) {

System.out.println("title == "+title);

}

});

}

@Override

public boolean onKeyDown(int keyCode, KeyEvent event) {

// 当按下返回键时所执行的命令

if (keyCode == KeyEvent.KEYCODE_BACK) {

// 此处写你按返回键之后要执行的事件的逻辑

if (mWebView.canGoBack()) {

mWebView.goBack();

} else {

finish();

}

return super.onKeyDown(keyCode, event);

}

return super.onKeyDown(keyCode, event);

}

NewWebViewActivity的xml文件

xmlns:custom="http://schemas.android.com/apk/res-auto"

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context=".NewWebViewActivity">

android:id="@+id/toolbar"

android:layout_width="match_parent"

android:layout_height="1dp"

android:layout_alignParentTop="true"

android:background="#FFFFFF"

android:id="@+id/web_view"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:scrollbars="none" />

layout="@layout/horizontal_progressbar"

android:layout_alignParentTop="true"

android:layout_width="match_parent"

android:layout_height="2dp"

9bcda86aac6c

image.png

当你点击选择医院按钮的时候，webview调用ionic写的选择医院界面，点预约挂号按钮的时候，webview调用ionic写的预约挂号界面。

现在有个问题就是，当你在ionic页面里选择完医院的时候，怎么通知原生安卓端关闭掉webview这个Activity呢？这时就涉及到ionic向原生安卓传值的问题了。

解决方法：我们在选择完医院的时候，往iFrame里加入特定字段，来代表特定的操作，我这里是用finish表示关闭当前activity的操作，当用户在ionic端选择完医院点击确定的时候，我们向安卓的webview传递一个“finish”字段，安卓可以在webview的shouldOverrideUrlLoading方法里截获这个字段，去做相应的操作，具体代码上面代码已经写的很清楚了。

CommonUtil.jsCallNative("haleyAction://finish");

/**

* js调用原生

* @param url 协议接口

public static jsCallNative(url) {

let iFrame;

iFrame = document.createElement("iframe");

iFrame.setAttribute("src", url);

iFrame.setAttribute("style", "display:none;");

iFrame.setAttribute("height", "0px");

iFrame.setAttribute("width", "0px");

iFrame.setAttribute("frameborder", "0");