android原生应用,用webview加载应用中的网页,并且java代码与js代码可以互相操作。

这是混合开发的基石,最基本也最重要的东西,实验代码在这里

概括说说——

java调js:调用webView.load("javascript:someFunction()");

这样可以调用webView里页面上的全局方法。这不是什么新鲜东西,你在网页中也可以这么做,试试在浏览器地址栏输入javascript:alert("427studio");也可以在浏览器地址栏里调用全局方法。

js调java:调用webView.addJavascriptInterface(somePOJO, "varName");

让一个java对象成为webview里面网页的window对象的varName属性,就好像执行了window.varName = somePOJO一样,因为window是全局上下文,js即可以用访问全局变量的方式访问这个java对象了,然后调用这个对象的函数即可,如果somePOJO这个对象有个public void doIt()方法,则可以这样调用它:someButton.onclick=function(){varName.doIt();}

具体的代码:这里这里,都非常基本,简要列出如下:

1.activity,调js方法那里手痒痒抽了个方法,图简单直接拼"javascript:jsDoIt('" + xx + "');"也没啥。

对了,loadUrl时,加载安卓程序assets包里的资源,以file:///android_asset/开头,如file:///android_asset/index.html表示要加载assets包里的index.html文件。

package com.example.testhybrid;

import android.annotation.SuppressLint;
import android.app.Activity;
import android.app.Fragment;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.webkit.JavascriptInterface;
import android.webkit.WebView;

public class MainActivity extends Activity {

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

if (savedInstanceState == null) {
            getFragmentManager().beginTransaction()
                    .add(R.id.container, new PlaceholderFragment())
                    .commit();
        }
    }
}

class PlaceholderFragment extends Fragment {

WebView webView;
    
    public PlaceholderFragment() {
    }

@SuppressLint("SetJavaScriptEnabled") @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        View rootView = inflater.inflate(R.layout.fragment_main, container, false);
        
        webView = (WebView)rootView.findViewById(R.id.webView1);

webView.getSettings().setJavaScriptEnabled(true);
        
        Handler handler = new Handler(){
            @Override
            public void handleMessage(Message msg) {
                String str = msg.getData().getString("str");
                doJs("jsDoIt", str.replaceAll("\\d", ""));
            }
        };
        webView.addJavascriptInterface(new MyJavascriptInterface(webView, handler), "javaObject");
        
        webView.loadUrl("file:///android_asset/webviews/index.html");
        
        return rootView;
    }
    
    //调用js方法,第一个参数是js方法名,后面的参数是js方法的参数列表
    void doJs(String function, Object... params){
        StringBuilder result = new StringBuilder();
        result.append("javascript:").append(function).append("(");
        for(int i = 0; i < params.length; i++){
            result.append("'").append(params[i].toString()).append("'");
            if(i < params.length - 1){
                result.append(",");
            }
        }
        result.append(")");
        String jsStr = result.toString();
        webView.loadUrl(jsStr);
    }
}

//要用来被js调用的java对象
class MyJavascriptInterface{
    
    MyJavascriptInterface(WebView wv, Handler h){
        this.theWebView = wv;
        this.handler = h;
    }
    
    WebView theWebView;
    Handler handler;
    
    //要用来被js调用的java方法
    @JavascriptInterface
    public void javaDoIt(final String str){
        Message msg = new Message();
        Bundle bundle = new Bundle();
        bundle.putString("str", str);
        msg.setData(bundle);
        handler.sendMessage(msg);
    }

}

网页结构不赘,javascript代码:

//html按钮点击触发
function theBtnOnClicked(){
    //调用java方法
    javaObject.javaDoIt("427studio");
}

//要用来被java程序调用的js方法
function jsDoIt(str){
    document.getElementById('theBtn').innerText += str;
}

长期欢迎项目合作机会介绍,项目收入10%用于酬谢介绍人。新浪微博:@冷镜,QQ:908789432

android混合开发,webview的java与js互操作的更多相关文章

  1. Android应用开发 WebView与服务器端的Js交互

    最近公司再添加功能的时候,有一部分功能是用的html,在一个浏览器或webview中展示出html即可.当然在这里我们当然用webview控件喽 WebApp的好处: 在应用里嵌套web的好处有这么几 ...

  2. uni-app&H5&Android混合开发三 || uni-app调用Android原生方法的三种方式

    前言: 关于H5的调用Android原生方法的方式有很多,在该片文章中我主要简单介绍三种与Android原生方法交互的方式. 一.H5+方法调用android原生方法 H5+ Android开发规范官 ...

  3. Android与H5交互(java与js的交互)

    一.理论概述 1.js调用java方法 直接调用WebView的该方法就可以添加接口了,不过先要启动交互 // 启用javascript mWebView.getSettings().setJavaS ...

  4. Android NDK开发 JNI操作java构造方法,普通方法,静态方法(七)

    Android NDK开发 JNI操作java普通.静态.构造方法 1.Jni实例化一个Java类的实例jobject 1.通过FindClas( ),获取Java类的的jclass 2.通过GetM ...

  5. [Hybrid App]--Android混合开发,Android、Js的交互

    AndroidJs通信 *:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: 0 !imp ...

  6. Android 混合开发 的一些心得。

    其实所谓这个混合开发,也就是hybird,就是一些简单的,html5和native 代码之间的交互.很多电商之类的app里面都有类似的功能, 这种东西其实还是蛮重要的,主要就是你有什么功能都可以进行热 ...

  7. Android混合开发,html5自己主动更新爬过的坑

    如今使用混合开发的公司越来越多,尽管出现了一些新技术,比方Facebook的react native.阿里的weex,但依旧阻挡不了一些公司採用h5的决心.当然,这也是从多方面考虑的选择. 在三年前就 ...

  8. webview中java与js交互

    WebView提供了在Android应用中展示网页的强大功能.也是目前Hybird app的大力发展的基础.作为Android系统的一个非常重要的组件,它提供两方面的强大的能力:对HTML的解析,布局 ...

  9. Android使用开发WebView战斗技能

    转载请注明出处:http://blog.csdn.net/allen315410/article/details/44619181 前段时间做项目的时候.在项目中用了WebView组件,遇到了一些问题 ...

随机推荐

  1. iOS下的 Fixed + Input 调用键盘的时候fixed无效问题解决方案

    做touchweb开发的时候,做头疼的是,电脑上面时候好的,有些手机上面也是好的,个别手机和浏览器出现问题,对于这些,只能慢慢调试,找问题. 今天说一下比较老的IOS的问题,那就是"iOS下 ...

  2. #nav li:hover ul 与#nav li a:hover ul 的区别

    #nav li:hover ul 与#nav li a:hover ul 有什么区别? ──────────────────────────────────────────── #nav li:hov ...

  3. 李洪强iOS经典面试题上

    李洪强iOS经典面试题上     1. 风格纠错题 修改完的代码: 修改方法有很多种,现给出一种做示例: // .h文件 // http://weibo.com/luohanchenyilong/ / ...

  4. android-数据存储之手机内部file存储

    一.基础概要 1.说明: 1>应用程序运行需要一些较大的数据或者图片可保存在手机内部 2>文件类型:任意 3>路径:/data/data/packageName/files/ 4&g ...

  5. inline,block,inline-block的区别

    display:block block元素会独占一行,多个block元素会各自新起一行.默认情况下,block元素宽度自动填满其父元素宽度. block元素可以设置width,height属性.块级元 ...

  6. HDU1892二维树状数组

    See you~ Time Limit: 5000/3000 MS (Java/Others)    Memory Limit: 65535/32768 K (Java/Others)Total Su ...

  7. html5用到的js

    1.Zepto.js 是专门为现代智能手机浏览器退出的 Javascript 框架, 拥有和jQuery相似的语法, 但是和jQuery相比下来, 他有很多优点, 大小方面 , 压缩后的 zepto. ...

  8. 创造tips的秘籍——PHP回调后门

    作者:Phithon 原文连接:https://www.leavesongs.com/PENETRATION/php-callback-backdoor.html 最近很多人分享一些过狗过盾的一句话, ...

  9. Learn ZYNQ (3)

    移植android3.3到ZedBoard follow doc:Android移植Guide1.3.pdf follow website: http://elinux.org/Zedboard_An ...

  10. CSS学起来并不难

    CSS CSS学起来并不难,但在大型项目中,就变得难以管理,特别是不同的人在CSS书写风格上稍有不同,团队上就更加难以沟通,为此总结了一些如何实现高效整洁的CSS代码原则: 1. 使用Reset但并非 ...