尚硅谷—Android与H5互调

1.为什么学Android也要学H5?

Android很多软件都有内嵌H5DE

2.有什么用处,提高开发效率

节约成本,提高开发效率

3.实现的原理是是什么?

本质是:java代码和JavaScript调用

package com.example.testapplication;

import androidx.appcompat.app.AppCompatActivity;

import android.content.Context;
import android.os.Bundle;
import android.text.TextUtils;
import android.view.View;
import android.webkit.JavascriptInterface;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Toast;

import java.io.File;

public class JavaAndJSActivity extends AppCompatActivity implements View.OnClickListener {
    private EditText etNumber;
    private EditText etPassword;
    private Button btnLogin;
    /**
     * 加载网页或者说H5页面
     */
    private WebView webView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_java_and_jsactivity);
        findViews();

    }

    private void initWebView() {
        // 1.加载h5网页,html.自定义浏览器,直接在webview中播放视频
        webView = new WebView(this);
        WebSettings webSettings = webView.getSettings();

        // 设置支持js
        webSettings.setJavaScriptEnabled(true);
        //webSettings.setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK); //设置缓存
        webView.clearCache(true);
        webSettings.setDomStorageEnabled(true);//适应Html5

        //支持双击-前提是页面要支持才显示
//        webSettings.setUseWideViewPort(true);

        //支持缩放按钮-前提是页面要支持才显示
        webSettings.setBuiltInZoomControls(true);
        // 不调用浏览器 - 自定义浏览器
        webView.setWebViewClient(new WebViewClient());

        //设置支持js调用java
        webView.addJavascriptInterface(new AndroidAndJSInterface(),"Android");

        // 加载网络页面-本地的网页
        webView.loadUrl("http://www.baidu.com");  // TODO 有bug
        // webView.loadUrl("http://192.168.0.104:8080/example/JavaAndJavaScriptCall.html");
        webView.loadUrl("file:///android_asset/JavaAndJavaScriptCall.html");
        //setContentView(webView);

        //显示页面
       setContentView(webView);
    }

    private void findViews() {
        etNumber = (EditText) findViewById(R.id.et_number);
        etPassword = (EditText) findViewById(R.id.et_password);
        btnLogin = (Button) findViewById(R.id.btn_login);
        btnLogin.setOnClickListener(this);

        initWebView();
    }

    @Override
    public void onClick(View view) {
        if(view == btnLogin){
            login();
        }
        
    }

    private void login() {
        String numebr = etNumber.getText().toString().trim();
        String password = etPassword.getText().toString().trim();
        if (TextUtils.isEmpty(numebr) || TextUtils.isEmpty(password)) {
            Toast.makeText(JavaAndJSActivity.this, "账号或者密码为空", Toast.LENGTH_SHORT).show();
        } else {
            //登录
            login(numebr);
        }
    }

    /**
     *  java 调用js (重点)
     * */

    private void login(String numebr){
        webView.loadUrl("javascript:javaCallJs(" + "'" + numebr + "'" + ")");
        setContentView(webView);
    }

    /**js可以调用该类*/
    class AndroidAndJSInterface{
        @JavascriptInterface
        public void showToast(){
            Toast.makeText(JavaAndJSActivity.this, "我被js调用了", Toast.LENGTH_SHORT).show();
        }
    }
    


    @Override
    protected void onDestroy() {
        super.onDestroy();
        //deleteFilesByDirectory(context.getCacheDir());
    }
}

html

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <script type="text/javascript">

	function javaCallJs(){
		 document.getElementById("content").innerHTML +=
	         "<br\>java调用了js无参函数";
	}

	function javaCallJs(arg){
		 document.getElementById("content").innerHTML =
	         ("欢迎:"+arg );
	}


   function showDialog(){
      alert("谷粉们你好,我是来自javascript");
   }






    </script>


</head>


<body>

<div align="left" id="content"> 谷粉</div>
<div align="right">光临尚硅谷</div>

<p><img src="http://atguigu.com/images/logo.gif"></p>


<input type="button" value="点击Android被调用" onclick="window.Android.showToast()" />

</body>


</html>

有bug如何清除缓存

播放视频

package com.example.testapplication;

import androidx.appcompat.app.AppCompatActivity;

import android.annotation.SuppressLint;
import android.content.Intent;
import android.net.Uri;
import android.os.Bundle;
import android.webkit.JavascriptInterface;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;

public class JsCallJavaVideoActivity extends AppCompatActivity {
    private WebView webView;

    @SuppressLint("JavascriptInterface")
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_js_call_java_video);
        webView = (WebView) findViewById(R.id.webview);

        WebSettings webSettings = webView.getSettings();
        // 设置支持js语言
        webSettings.setJavaScriptEnabled(true);

        // 设置客户端 - 不跳转到默认浏览器中
        webView.setWebViewClient(new WebViewClient());

        // 设置支持js调用java
        webView.addJavascriptInterface(new AndroidAndJSInterface(),"android");
        webView.loadUrl("file:///android_asset/RealNetJSCallJavaActivity.htm");

    }
    class AndroidAndJSInterface {
        /**
         * 该方法将被js调用
         * @param id
         * @param videoUrl
         * @param tile
         */
        @JavascriptInterface
        public void playVideo(int id,String videoUrl,String tile){
            //调起系统所有播放器
            Intent intent = new Intent();
            intent.setDataAndType(Uri.parse(videoUrl),"video/*");
            startActivity(intent);
        }
    }
}

xml

<?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:layout_wi
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值