标签：
本文是混合应用开发入门教程，如果您不懂原生应用开发，那么请尝试混合模式的应用开发。本教程将使用Android、Html5和Cordova进行样例讲解。
一，创建开发环境并下载开发包：
关于Android开发环境搭建请自行上网查询，本教程不作讲解。
使用的相关开发包：
二，创建混合应用
1，创建Android Project如下图所示，默认点击下一步直至完成创建。
2，在项目中加入cordova-3.4.0.jar。
3，在res文件夹下创建名为xml文件夹，接着在xml文件夹下创建名为config.xml文件，config.xml文件内容如下：
<?xml version="1.0" encoding="UTF-8"?>
<widget xmlns = "http://www.w3.org/ns/widgets"
id = "io.cordova.helloCordova"
version = "2.0.0">
<name>Hello Cordova</name>
<description>
A sample Apache Cordova application that responds to the deviceready event.
</description>
<author href="http://cordova.io" email="dev@cordova.apache.org">
Apache Cordova Team
</author>
<access origin="*"/>
<!-- <content src="http://mysite.com/myapp.html" /> for external pages -->
<content src="index.html" />
<preference name="loglevel" value="DEBUG" />
<!--
<preference name="splashscreen" value="resourceName" />
<preference name="backgroundColor" value="0xFFF" />
<preference name="loadUrlTimeoutValue" value="20000" />
<preference name="InAppBrowserStorageEnabled" value="true" />
<preference name="disallowOverscroll" value="true" />
-->
<!-- This is required for native Android hooks -->
<feature name="App">
<param name="android-package" value="org.apache.cordova.App" />
</feature>
</widget>
4,修改MainActivity.java文件，代码如下：
package code.android.hybrid;
import org.apache.cordova.Config;
import org.apache.cordova.CordovaActivity;
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
/**
*
* @author 蔡治平
* @since 2015-08-12
*
*/
public class MainActivity extends CordovaActivity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
super.init();
// Load your application
super.loadUrl(Config.getStartUrl());
}
}
5，在assets文件夹下创建名为www的文件夹，创建名为index.html文件。index.html文件内容如下：
<!DOCTYPE html>
<html>
<head>
<title>DEMO</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" >
<meta name="apple-mobile-web-app-capable" content="yes" >
<meta name="apple-touch-fullscreen" content="yes" >
</head>
<body>
<h1>Hello Html5!!!</h1>
</body>
</html>
三，丰富UI界面
这里不讲述Sencha touch如何使用，有时间会单独出Sencha touch教程。
标签：
原文地址：http://my.oschina.net/u/560628/blog/491649
