Android原生代码与html5交互
一、首先是网页端，这个就是一些简单的标签语言和JS函数：
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>H5 And Android</title>
<script>
//定义本地方法 效果提供给Android端调用 被调用后将获得参数值
function callH5(data){
document.getElementById("result").innerHTML="result success for Android to:"+data;
}
//定义本地点击事件 效果调用Android方法 传递参数给Android客服端
function myOnclick(){
document.getElementById("result").innerHTML="按钮被点击了"
//调用android本地方法 调用对象由Android定义实例化，调用方法由Android提供 (具体对象名和方法待定，可变更)
myObj.callAndroid("弹窗显示回调成功了～～～");
}
js调用android
WebSettings webSettings = webView.getSettings();
// 设置WebView属性，能够执行Javascript脚本
webSettings.setJavaScriptEnabled(true);
// 设置可以访问文件
webSettings.setAllowFileAccess(true);
// 设置支持缩放
webSettings.setBuiltInZoomControls(true);
webView.addJavascriptInterface(new JavaScriptInterfaces(), "control");
// 加载需要显示的网页
webView.loadUrl(url + "?newsId=" + newsId + "&newsType=" + newsType + "&subjectImg=" + imageUrl);
String str = url + "?newsId=" + newsId + "&newsType=" + newsType + "&subjectImg=" + imageUrl;
LogUtils.e(url + "?newsId=" + newsId + "&newsType=" + newsType + "&subjectImg=" + imageUrl);
// 设置Web视图
webView.setWebViewClient(new webViewClient());// 如果去掉webView会用浏览器加载网络连接
class JavaScriptInterfaces {
JavaScriptInterfaces() {
}
@JavascriptInterface
public void toNews(long newsId, String accessUrl) {
Intent intent = new Intent(SpecialWebActivity.this, NewsDetailsWebActivity.class);
intent.putExtra("newsId", newsId + "");
startActivity(intent);
}
}
</script>
</head>
<body>
<button id="button" onclick="myOnclick()">点击调用Android方法</button>
<p/>
<div id="result">效果展示</div>
</body>
</html>
二、接下来就是Android中加载web网页，并且设置完成交互了，直接上代码，也有详细注释:
package com.lvyerose.h5andandroid;
import android.annotation.SuppressLint;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.View;
import android.webkit.JavascriptInterface;
import android.webkit.WebView;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
private WebView mWebView;
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
mWebView = (WebView) findViewById(R.id.webView);
initWeb();
}
@SuppressLint({"JavascriptInterface", "SetJavaScriptEnabled"})
void initWeb(){
//设置编码
mWebView.getSettings().setDefaultTextEncodingName("utf-8");
//支持js
mWebView.getSettings().setJavaScriptEnabled(true);
//设置本地调用对象及其接口
//第一个参数为实例化自定义的接口对象 第二个参数为提供给JS端调用使用的对象名
mWebView.addJavascriptInterface(new Contact() {
@JavascriptInterface //必须加的注解
@Override
public void callAndroid(String phone) {
Toast.makeText(MainActivity.this, phone, Toast.LENGTH_LONG).show();
}
}, "myObj");
//载入js
mWebView.loadUrl("http://lvyerose.com/h5andAndroid.html");
findViewById(R.id.button).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//Android调用Js方法，其中参数 'Android OK !!!' 可传入变量 效果如下：
// mWebView.loadUrl("javascript:callH5('"+str+"')");
mWebView.loadUrl("javascript:callH5('Android OK !!!')");
}
});
}
//定义接口，提供给JS调用
interface Contact {
@JavascriptInterface
void callAndroid(String phone);
}
}
Android原生代码与html5交互的更多相关文章
- PhoneGap或者Cordova框架下实现Html5中JS调用Android原生代码
PhoneGap或者Cordova框架下实现Html5中JS调用Android原生代码 看看新闻网>看引擎>开源产品 0人收藏此文章, 发表于8小时前(2013-09-06 00:39) ...
- Android原生webview中js交互
http://www.cnblogs.com/android-blogs/p/4891264.html Html页面和Java代码结合的方式一般用在界面经常被更改 的情况下,可以讲html放在网络中, ...
- Android原生代码拦截H5 Web页面中JavaScript弹窗/弹框
<html> <body> <script> function showAlert(){ alert("JavaScript - hello , worl ...
- Android NDK开发篇(六)：Java与原生代码通信(异常处理)
一.捕获异常 异常处理是Java中的功能.在Android中使用SDK进行开发的时候常常要用到.Android原生代码在运行过程中假设遇到错误,须要检測,并抛出异常给Java层.运行原生代码出现了问题 ...
- Android NDK开发篇：Java与原生代码通信(异常处理)
一.捕获异常 异常处理是Java中的功能,在Android中使用SDK进行开发的时候经常要用到.Android原生代码在执行过程中如果遇到错误,需要检测,并抛出异常给Java层.执行原生代码出现了问题 ...
- iOS原生APP和H5交互-delegate和第三方
一.原生代码中直接加载页面(拦截) 1. 具体案例 加载本地/网络HTML5作为功能介绍页 2. 代码示例 //本地 -(void)loadLocalPage:(UIWebView*)we ...
- uni-app&H5&Android混合开发三 || uni-app调用Android原生方法的三种方式
前言: 关于H5的调用Android原生方法的方式有很多,在该片文章中我主要简单介绍三种与Android原生方法交互的方式. 一.H5+方法调用android原生方法 H5+ Android开发规范官 ...
- Android原生嵌入React Native
1.首先集成的项目目录 我使用的是直接按照react-native init Project 的格式来导入的,也就是说,我的Android项目目录是跟node_modules是在一个目录下的. 我们i ...
- Android - 通过真实案例学习解内存泄漏问题，最终发现Android原生Bug
作为一个Android新手小白,刚到新公司,最近的工作就是在学习解各类Bug.转型之初,面临各种新知识,会有压力,但是学习的过程是快乐的. 上周刚遇上一类bug,就是应用的内存泄漏问题.最终通过前辈的 ...
随机推荐
- 易卡易APP的出现改变你的消费习惯
科技发展越来越快,移动支付占据市场主导地位,银行业发展受到了重大冲击,致使银行对于信用卡的推广更加重视.人们的消费观念也受到了很大影响从以前的现金消费变成现在的数字消费,人们对于金钱的观念就是一个数字 ...
- YDKJS:作用域与闭包
作用域与闭包 什么是作用域 编译器 理解作用域 嵌套的作用域 词法作用域 词法分析时 欺骗词法作用域 函数与块作用域 函数中的作用域 隐藏标识符于普通作用域 函数作为作用域 块作为作用域 提升 先有鸡 ...
- 使用 GStreamer appsrc 等插件实现视频音频混流，录制和推流
目前在做的在线直播教室,需要将老师分享的屏幕和老师的声音.学生的声音录制为一个视频文件,以便学生上课后还可以再看回放. 直播服务我们采用的是腾讯的视频服务,有现成的 SDK 可以用.但 SDK 自带的 ...
- Deep Learning速成教程
引言 深度学习,即Deep Learning,是一种学习算法(Learning algorithm),亦是人工智能领域的一个重要分支.从快速发展到实际应用,短短几年时间里, ...
- [国嵌攻略][070-095][Linux编程函数手册]
第1类 时间编程类 1.1 获取日历时间 1.1.1 函数名 time 1.1.2 函数原形 time_t time(time_t *t) 1.1.3 函数功能 返回日历时间 1.1.4 所属头文件 ...
- UVA 673 Parentheses Balance (栈)
题意描述: 给出一段只包含()和[]的字符串,判断是否合法,合法输出YES,不合法输出NO 规则: 1.该串为空,则合法 2.若A合法,B合法,则AB合法 3.若A合法,则(A)和[A]均合法 解题思 ...
- TCP协议中三次握手
TCP/IP是互联网相关的各类协议族的总称 TCP/IP协议族分为:应用层,传输层,网络层,数据链路层 应用层:向用户提供应用服务时的通讯的活动 传输层:提供处于网络连接中的两台计算机之间的数据传输 ...
- Flume环境搭建_五种案例
Flume环境搭建_五种案例 http://flume.apache.org/FlumeUserGuide.html A simple example Here, we give an example ...
- memcached经典问题和现象
缓存刷新时间集中问题 某个缓存失效了,导致其他节点的缓存命中率下降, 缓存中缺失的数据 去数据库查询.短时间内,会造成数据库服务器崩溃 需要将缓存失效时间离散分布在访问量比较低的时间段 multige ...
- PHP截取中英文字符串
//如果字符串长度超过10,则截取并以省略号结尾 function sub($str){ $str=(string)$str; if( mb_strlen($str,'utf-8') >10){ ...