本篇文章由:http://www.sollyu.com/android-software-development-webview-addjavascriptinterface-cycle-of-gradual-one/

说明

文章列表

android软件开发之webView.addJavascriptInterface循环渐进【一】: http://www.sollyu.com/?p=302

android软件开发之webView.addJavascriptInterface循环渐进【二】: http://www.sollyu.com/?p=586

首先必要的啰嗦几句,这几天写VC写的累的要死,突然间不想再写想VC了,手里面有一个andriod的手机天天玩到半夜,却从来没有写过这方面的程序,真的是悲哀啊。所以我就想写这方面的程序,用管了VC的习程序的习惯,第一个程序当然是hello world。刚开始还没有什么大的问题,当到后面想写一刷Q*会员的程序的时候却发现,android的界面布局是真的难啊,怎么摆都不好看。弄得和....什么似的。气得头都大了,想想自己写了这么长时间的VC还真的没有碰到这样的界面问题,真可谓..

在verycd上看人家大牛的视频的时候听到人家说可以用html来做android的UI界面,这不仅让我眼前一亮。 :-) 因为我学过html开发,虽然学的不咋的,但却要比这XML好的太多了,真的是对XML头大...于是乎就入手andriod的HTML界面可是后来发现在这方面的文章那叫一个少的可惜啊,老外那边要不就是看不懂,要不就基本和我看的内容无关。因为自己是菜鸟所以就想到找个群,蹭进去找个大牛问问,谁知道进去之后,我XXX他的,居然收费,我XX它的OO,人家android都开源了问你个破问题还收费,什么道德啊。当时个气氛,,,发誓要学会,在网上写文章,让你收费,XX你个OO的。

发泄了一通舒服多了, :-) OK,啰嗦的话我就不多说了。下面就开始我们的android的webView 的HTML界面教程吧。这里我给大家一个国内大牛的HTML做界面的视频教程,不过他老人家讲的我没有听懂。

21.android的ui设计技巧.rar或者看3G手机Android应用开发第八天课程1.采用HTML设计软件界面.avi他老人家的的视频还要 [Android开发视频教程]02_12_JSON数据解析.mp4这个视频做基础。如果你也是大牛的话你也肯定看的懂的。下面就进入我们小菜阶级的开发教程了。

21.android的ui设计技巧.rar

3G手机Android应用开发第八天课程1.采用HTML设计软件界面.avi

Android开发视频教程02_12_JSON数据解

代码

由于这里是第一阶段的webView所我就写个最简单的文章,这样大家可以循环渐进的来了解addJavascriptInterface这句话是怎么用的。

在这里我们引用Google的一个事例下面是我Google给提供的一个dome的地址:点击打开链接

我们先看它的HTML文件,HTML的文件路径是在:点击打开链接

他的代码为:

<html>
<script language="javascript">
/* This function is invoked by the activity */
/* 这个函数被Activity调用的活动 这里的图片我们可以在它的连接里面下载 android_waving.png */
function wave() {
/* 这里是一个javascript 自定义函数,这是由我们在android的程序里调用的,不在在HTML中调用*/
document.getElementById("droid").src="android_waving.png";
}
</script>
<body>
<!-- Calls into the javascript interface for the activity -->
<!-- 从HTML文件中调用activity中的函数 -->
<!-- 也就是从HTML到android程序 留意window.demo.clickOnAndroid()这句话 -->
<a onClick="window.demo.clickOnAndroid()"><div style="width:80px;
margin:0px auto;
padding:10px;
text-align:center;
border:2px solid #202020;" >
<!-- 图片默认的为 android_normal.png -->
<img id="droid" src="android_normal.png"/><br>
Click me!
</div></a>
</body>
</html>

这里我做了注释,可能你会看不懂,没有关系,下面我们就再看的activity的代码吧。点击打开链接

由于他的源码比较长,我就不多全部都贴进来了,我只贴一下重要的部分就好了.......貌似都重要,还是全贴吧

package com.google.android.webviewdemo;

import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.util.Log;
import android.webkit.JsResult;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView public class WebViewDemo extends Activity {
private static final String LOG_TAG = "WebViewDemo";
private WebView mWebView;
private Handler mHandler = new Handler();
@Override
public void onCreate(Bundle icicle) {
super.onCreate(icicle);
setContentView(R.layout.main);
mWebView = (WebView) findViewById(R.id.webview); WebSettings webSettings = mWebView.getSettings();
webSettings.setSavePassword(false);
webSettings.setSaveFormData(false);
// 下面的一句话是必须的,必须要打开javaScript不然所做一切都是徒劳的
webSettings.setJavaScriptEnabled(true);
webSettings.setSupportZoom(false); mWebView.setWebChromeClient(new MyWebChromeClient()); // 看这里用到了 addJavascriptInterface 这就是我们的重点中的重点
// 我们再看他的DemoJavaScriptInterface这个类。还要这个类一定要在主线程中
mWebView.addJavascriptInterface(new DemoJavaScriptInterface(), "demo"); mWebView.loadUrl("file:///android_asset/demo.html");
} // 这是他定义由 addJavascriptInterface 提供的一个Object
final class DemoJavaScriptInterface {
DemoJavaScriptInterface() {
} /**
* This is not called on the UI thread. Post a runnable to invoke
* 这不是呼吁界面线程。发表一个运行调用
* loadUrl on the UI thread.
* loadUrl在UI线程。
*/
public void clickOnAndroid() { // 注意这里的名称。它为clickOnAndroid(),注意,注意,严重注意
mHandler.post(new Runnable() {
public void run() {
// 此处调用 HTML 中的javaScript 函数
mWebView.loadUrl("javascript:wave()");
}
});
}
}
// 线下的代码可以不看,调试用的
///////////////////////////////////////////////////////////////////////////////////////////////////
/**
* Provides a hook for calling "alert" from javascript. Useful for
* 从javascript中提供了一个叫“提示框” 。这是很有用的
* debugging your javascript.
* 调试你的javascript。
*/
final class MyWebChromeClient extends WebChromeClient {
@Override
public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
Log.d(LOG_TAG, message);
result.confirm();
return true;
}
}
}

这里我也做了注释,在这里他在他的类中定义了一个 clickOnAndroid() 的函数,我记不记得我们在HTML中看到的 window.demo.clickOnAndroid()这句话。如果忘记了就翻上去再看一下,特别是我说注意的地方。是的,这里的 clickOnAndroid() 是我们android程序中的一个函数。可能你会问那.为什么是windows.demo.这里demo我们可以看到在

mWebView.addJavascriptInterface(new DemoJavaScriptInterface(), "demo");

这句话 中后面它加了一个demo这个字符.我可以理解成 addJavascriptInterface 的前一个参数为HTML中的一个方法,当然我更喜欢说他为函数。demo就是个对象...呵呵,我对这也不是怎么的熟悉。至于这个window我也不知道是为什么我只知道这样写程序就可以正确的运行,如果你知道这是什么那么请你在下面的留言版里告诉我一下好吗?

现在知道怎么在HTML中怎么调用Android程序的一个方法了吧。其实就是这这么的简单,不过demo这个字符我没有试他是不是区分大小写。如果你有兴趣那么你可以去试一下它有没有区分大小写。知道了怎么样从HTML中怎么样调用Android中的方法,下面我就再研究一下,它是怎么样从Android到HTML的吧。其实这个很简单,只要使用

mWebView.loadUrl("javascript:wave()");

这句话就可以了。 这样我主解读完Google给我提供的一个demo了。下面就是让我来试一下吧,试试他的这个demo吧,因为人家给提供了源码,所以我就不贴的啦,大家把他的源码贴上去就可以实现这个啦

在下一集里我将会带领大家来怎么使用 addJavascriptInterface 怎么样从一个JavaScript 的函数中获得一个返回值。文章内容不多,还请见谅

android软件开发之webView.addJavascriptInterface循环渐进【一】的更多相关文章

  1. android软件开发之webView.addJavascriptInterface循环渐进【二】

    本篇文章由:http://www.sollyu.com/android-software-development-webview-addjavascriptinterface-cycle-of-gra ...

  2. Android安全开发之WebView中的地雷

    Android安全开发之WebView中的地雷 0X01 About WebView 在Android开发中,经常会使用WebView来实现WEB页面的展示,在Activiry中启动自己的浏览器,或者 ...

  3. Android混合开发之WebView与Javascript交互

    前言: 最近公司的App为了加快开发效率选择了一部分功能采用H5开发,从目前市面的大部分App来讲,大致分成Native App.Web App.Hybrid App三种方式,个人觉得目前以Hybri ...

  4. Android混合开发之WebView使用总结

    前言: 今天修改项目中一个有关WebView使用的bug,激起了我总结WebView的动机,今天抽空做个总结. 混合开发相关博客: Android混合开发之WebView使用总结 Android混合开 ...

  5. android基础开发之WebView

    WebView 是android平台沟通 http & H5 页面的桥梁. 但是google对这块的表述不是很清晰,而且SDK里面基本看不到源码,只有一个接口而已. 传送:http://dev ...

  6. Android软件开发之ListView 详解【转】

    ListView的使用方法  ListView是Android软件开发中非常重要组件之一,基本上是个软件基本都会使用ListView ,今天我通过一个demo来教大家怎么样使用ListView组件 绘 ...

  7. 【Android】Android软件开发之ListView 详解

    原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://xys289187120.blog.51cto.com/3361352/65717 ...

  8. Android安全开发之WebView中的大坑

    0X01 About WebView 在Android开发中,经常会使用WebView来实现WEB页面的展示,在Activiry中启动自己的浏览器,或者简单的展示一些在线内容等.WebView功能强大 ...

  9. Android 软件开发之 PreferenceActivity 中的组件

    1.PreferenceActivity 介绍 PreferenceActivity 继承ListActivity 它是以一个列表的形式在展现内容,它最主要的特点是添加Preference可以让控件的 ...

随机推荐

  1. Xamarin开发Android时Visual Studio 2012没有智能提示解决办法

    Most of the people who work with Xamarin’s Mono for Android in Visual Studio 2012 face a bug where I ...

  2. system partition table

    转载内容 摘录部分我的笔记的中doc,和大家一起感受Oracle 11g在分区方面的增强--System Partitioning 系统分区的特点 ●系统分区与其他分区相比,一个最根本的区别就是不需要 ...

  3. MariaDB-5.5.33a 编译安装

    交代一下内核的信息 [root@localhost soft]# uname -r 2.6.32-71.el6.x86_64 创建mariadb用户组 [root@localhost mariadb- ...

  4. 包含块、层叠上下文、BFC

    包含块 什么是包含块?简单来说,就是决定一个元素大小和定位的元素.一个元素会为它的内部元素创建包含块,但也不能说元素的包含块就是它的父元素: 1.position:fixed 的元素 包含块是当前可视 ...

  5. Maven管理项目架包

    最近一直在用Maven管理项目的架包,从而发现了几个不错的官方或者非官方的网站. http://mvnrepository.com/artifact/com.ning  这个是我刚刚用来找HTTP开发 ...

  6. NLog使用说明

    NLog是一个基于.NET平台编写的类库,我们可以使用NLog在应用程序中添加极为完善的跟踪调试代码. NLog允许我们自定义从跟踪消息的来源(source)到记录跟踪信息的目标(target)的规则 ...

  7. PowerShell随笔2_分支 选择 循环 特殊变量

    PowerShell特殊变量: PowerShell的特殊变量由系统自动创建.用户自定义的变量名称应该不和特殊变量相同. $^ :前一命令行的第一个标记 $$ :前一命令行的最后一个标记 $_ :表示 ...

  8. 【转】C++的继承与多态:为什么需要虚函数

    转自:http://www.educity.cn/zk/gjyy/201306271108011682.htm 多态性是面向对象设计语言的基本特征.仅仅是将数据和函数捆绑在一起,进行类的封装,使用一些 ...

  9. 13 引用WINAPI

            [System.Runtime.InteropServices.DllImport("user32.dll", EntryPoint = "SetWind ...

  10. ThinkPad New X1 Carbon中关闭任务栏上的触摸键盘

    1. 执行services.msc 2. 选择Touch Keyboard and Handwriting Panel 服务. 3. 将其停止执行. 并disable.