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,就是应用的内存泄漏问题.最终通过前辈的 ...
随机推荐
- ps 替换背景以及调整尺寸
领导吩咐我修改她的图片背景,尺寸, 屁颠屁颠去弄,半小时后发现大学里学的 ps 忘差不多了,这里总结一下修改图片背景以及尺寸的基本操作. 1. 去除原背景 方法一: 选中魔术橡皮擦, 点击原图中背景, ...
- 微信小程序之获取验证码js
在微信小程序中怎样实现获取验证码的倒计时功能捏,倒计时的原理是一样一样的,就是某些地方需要注意. 第一步:结构 <view class='get-code' wx:if="{{!isS ...
- kmalloc、vmalloc、__get_free_pages()的区别
一.分布位置上的区别: kmalloc()和__get_free_pages()函数申请的内存位于物理内存的映射区域,而且在物理上也是连续的,它们与真实的物理地址只有一个固定的偏移,因此存在简单的线性 ...
- Coursera课程 Programming Languages, Part C 总结
碎言碎语 和前面的 ML 和 Racket 感觉明显不一样了,一边学着一边觉得这真是一门奇怪的语言,有着各种奇怪的语法,不过真的算是一个奇妙的体验(相比前面的两门语言,Ruby 的学习资源多了不少). ...
- Python3.5下安装&测试Scrapy
1.引言 Scrapy框架结构清晰,基于twisted的异步架构可以充分利用计算机资源,是做爬虫必备基础,本文将对Scrapy的安装作介绍. 2.安装lxml 2.1 下载地址:https://ww ...
- Flask源码流程剖析
在此之前需要先知道类和方法,个人总结如下: 1.对象是类创建,创建对象时候类的__init__方法自动执行,对象()执行类的 __call__ 方法 2.类是type创建,创建类时候type的__i ...
- 模板层（template）
模板: 什么是模板? html+模板语法 模板语法: 1 变量:{{}} 深度查询: 通过句点符号 . 过滤器 filter {{var|filter_name}} 2 标签: {% tag %} f ...
- Java入门篇（二）——Java语言基础（下）
上篇说到Java中的变量与常量,接下来就是简单的计算了,首先需要了解一下Java中的运算符. 六.运算符 1. 赋值运算符 赋值运算符即"=",是一个二元运算符(即对两个操作数进行 ...
- 关于maven项install时报找不到符号的错误
解决办法: 聚合工程: 1.eclipse中执行project -->clean,将项目清理一下: 2.选中聚和工程右键-->Run As-->Maven builed...--&g ...
- BZOJ 3211: 花神游历各国【线段树区间开方问题】
3211: 花神游历各国 Time Limit: 5 Sec Memory Limit: 128 MBSubmit: 3514 Solved: 1306[Submit][Status][Discu ...