Hybrid App 是混合模式应用的简称,兼具 Native App 和 Web App 两种模式应用的优势,开发成本低,拥有 Web 技术跨平台特性。目前大家所知道的基于中间件的移动开发框架都是采用的 Hybrid 开发模式,例如国外的 PhoneGap、Titanium、Sencha,还有国内的 AppCan、Rexsee 等等。Hybrid App 开发模式正在被越来越多的公司和开发者所认同,相信将来会成为主流的移动应用开发模式。

Hybrid App 融合 Web App 的原理就是嵌入一个WebView组件,可以在这个组件中载入页面,相当于内嵌的浏览器,代码如下:

import android.app.Activity;
import android.os.Bundle;
import android.webkit.WebSettings;
import android.webkit.WebView;

public class AActivity extends Activity{

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// 创建WebView
WebView webView= new WebView(this);
// 切换到内容视图
setContentView(webView);
// 获取WebView配置
WebSettings ws = webView.getSettings();
// 启用JavaScript
ws.setJavaScriptEnabled(true);
// 载入assets目录下的一个页面
webView.loadUrl("file:///android_asset/www/BoBox/index.html");
}
}
  还有另一种引入方式是在布局文件中添加 WebView 组件,代码如下:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">

<WebView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="@+id/webview"
/>

</LinearLayout>
import android.app.Activity;
import android.os.Bundle;
import android.webkit.WebSettings;
import android.webkit.WebView;

public class BActivity extends Activity{

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.webview);
// 查找WebView
WebView webView = (WebView) findViewById(R.id.webview);
// 获取WebView配置
WebSettings ws = webView.getSettings();
// 启用JavaScript
ws.setJavaScriptEnabled(true);
// 在载入assets目录下的一个页面
webView.loadUrl("file:///android_asset/www/index.html");
}
}
  WebView 还有一个非常重要的方法——addJavascriptInterface,可以用来实现 Java 程序和 JavaScript 程序的相互调用,代码如下:
webView.addJavascriptInterface(new Object(){
public void clickOnAndroid(){
mHandler.post(new Runnable(){
public void run(){
webView.loadUrl("javascript:wave()");
}
});
}
}, "demo");
  页面代码如下:
<script>
function wave() {
document.getElementById("id").innerHTML = "Hello World!";
}
</script>
</head>
<body>
<div>
<a href="#" id="demo" onclick="window.demo.clickOnAndroid()">Click Me</a>
</div>
</body>
</html>
  这样,当你点击页面上 Click Me 按钮的时候就会调用 Java 代码中的 clickOnAndroid 函数,clickOnAndroid 函数中又调用页面中的 wave 方法。需要注意的是:这个接口在 Android 2.3 版本的模拟器中运行会导致 WebView 崩溃,目前还没有修复。这是一个非常简单的演示 Java 和 JavaScript 相互调用的例子,在实际应用中可以在页面调用的 clickOnAndroid 函数中再调用摄像头、通讯录、通知提醒等设备功能。

hybird app的更多相关文章

  1. Cordova+ionic 开发hybird App --- 开发环境搭建

    Cordova 开发hybird App 开发环境搭建 一.一些基础概念: Ant : 简单说来可以这么理解,如果你用记事本写JAVA程序,然后在cmd里输入javac命令编译它,但是有一天你发现每次 ...

  2. 用ionic快速开发hybird App(已附源码,在下面+总结见解)

    1.ionic简介 ionic 是用于敏捷开发APP的解决方案.核心思路是:利用成熟的前端开发技术,来写UI和业务逻辑.也就是说,就是一个H5网站,这个区别于react-native,native.即 ...

  3. 通过chrome inspect 来调试手机hybird APP

    hybird APP 虽然显示效果和编译前的前端页面大致相同,但是其中操作可能会调用一些浏览器中没有的接口,从而产生一些意料之外的问题,因此了解和掌握如何调试就变得尤为重要. 本文简要介绍了如何利用c ...

  4. hybird app混合开发介绍

    一 概念 1 Hybird App,是用现有前端(html,js,css)技术来开发的app.特点:1 灵活(开发灵活 ,部署灵活) 2 拥有类似原生的性能体验. 2 不是h5页面,也不是在webvi ...

  5. 开发框架-APP:Hybird App

    ylbtech-开发框架-APP:Hybird App Hybrid App(混合模式移动应用)是指介于web-app.native-app这两者之间的app,兼具“Native App良好用户交互体 ...

  6. 何为Web App,何为Hybird App

    这些概念听起来很火,当下也很流行,真正理解起来却并非易事.如果让我来全面的解释Web App和Hybird App,我觉得还有些困难. 这篇文章只是我深入了解移动领域开发过程中的不断整理和总结,其中涉 ...

  7. Web App, Native APP,Hybird App 介绍

    一.Web App 这个主要是采用统一的标准的 HTML,JavaScript.CSS 等 web 技术开发. 用户无需下载,通过不同平台 的浏览器访问来实现跨平台, 同时可以通过浏览器支持充分使用 ...

  8. Hybird App(一)----第一次接触

    App你知道多少 一 什么是Native App 长处 缺点 二 什么是Web App 长处 缺点 三 什么是Hybrid App 长处 缺点 四 Web AppHybrid AppNative Ap ...

  9. Hybird App ( 混合模式移动应用)开发初体验

    最近1,2个月一直都尝试开发一款Hybird app,遇到了很多问题,谈谈自己的体会. Hybird app (混合模式移动应用),它利用例如安卓端webview组件+HTML5内嵌的方式混合的方式开 ...

  10. hybird app 工具选型

    目前hybird app工具众多,如何选择?哪个坑少点呢? 下面来分析一下: 1开发工具都开源.基于Eclipse的有:apicloud,WeX5 2热门指数.下面的百度的搜索结果数,代表不了什么,至 ...

随机推荐

  1. [Arduino+Android] 自制土砲智能安全帽

    专案动机(1/2) .现今社会中,各种交通运输载具方便了人类的生活,缩小了地域的差异性,当中车辆是人们日常生活中最频繁接触到的一部分. .车辆使人们的行动更加便利,也因此道路上行驶的车辆越来越多. . ...

  2. iOS开发笔记系列-基础4(变量与数据类型)

    对象的初始化 对象的初始化方法一般都如下: -(id)init { self=[super init]; if(self){ ... } return self; } 这个方法首先会调用父类的初始化方 ...

  3. There is no Action mapped for namespace [/pages/action/student] and action name [findStudent]

    1.错误描写叙述 2014-7-13 2:38:54 org.apache.jasper.compiler.TldLocationsCache tldScanJar 信息: At least one ...

  4. VMWare9下基于Ubuntu12.10搭建Hadoop-1.2.1集群

    VMWare9下基于Ubuntu12.10搭建Hadoop-1.2.1集群 下一篇:VMWare9下基于Ubuntu12.10搭建Hadoop-1.2.1集群-整合Zookeeper和Hbase 近期 ...

  5. Android端如何获取手机当前的网络状态,比如wifi还是3G, 还是2G, 电信还是联通,还是移动

    不多说了,直接看代码, NB人会懂的! package com.example.vdisktest; import android.app.Activity; import android.conte ...

  6. iOS开发——开发技巧&LLDB详解

    开胃小菜--简单的断点调试 在xcode中打开一个app,在想要break的行号上单击,即可生成一个深色的箭头标识--断点.如下图,在viewDidLoad:中设置了断点. 运行app,等待...就可 ...

  7. SAP ABAP MARD和MARDH计算逻辑

    mard里记载的是当前库存的数量,但是期间并不一定是当月.比如你物料4月一整月都没有库存数量变化(没收没发),那么5月初你看mard里的条目期间数还是4月而非5月. 当某个期间发生货物移动的时候,系统 ...

  8. firefly 问题

    1.G:\servers\Python27\Lib\mimetypes.py reload(sys) sys.setdefaultencoding('gb18030') 2.G:\servers\Py ...

  9. Nginx模块开发入门

    前言 Nginx是当前最流行的HTTP Server之一,根据W3Techs的统计,目前世界排名(根据Alexa)前100万的网站中,Nginx的占有率为6.8%.与Apache相比,Nginx在高并 ...

  10. C# 指针(unsafe与fixed的使用)

    c#在默认情况下生成的都是安全代码,即进行了代码托管(.NET的CLR机制好处之一是,进行代码托管,适时的释放内存,程序员便不必考虑资源的回收问题),而此时,指针不能出现在安全代码的编译条件下. 一. ...