android开发 +phonegap环境搭建

目前移动终端访问moodle的方式有两中：

1.    基于moodlemobile的APP访问；

2.    使用手机浏览器访问，moodle2.4之后的版本提供了专门用于手机浏览器访问的附加主题，使得手机用户可以在浏览器对moodle，进行操作，操作界面如同app风格。

 

moodle不仅提供了开源服务器搭建文件，而且还有开源的手机客户端moodle，android和iPhone都有。

开发环境搭建

如果要对开源的mobile moodle进行二次开发，首先要搭建合适的开发环境。由于mobile moodle使用的是PhoneGap的开发框架，所以开发环境当中最好使用PhoneGap做二次开发（PhoneGap是一个用基于HTML，CSS和JavaScript的，创建移动跨平台移动应用程序的快速开发平台，百度百科）。

参考：http://blog.csdn.net/eyetee/article/details/8967202

根据PhoneGap官网提示，搭建开发环境需要：http://docs.phonegap.com/en/2.5.0/guide_getting-started_android_index.md.html#Getting%20Started%20with%20Android

·        Download and install EclipseClassic

·        Download and install AndroidSDK

·        Download and install ADT Plugin

·        Download the latest copy of PhoneGap and extractits contents. We will be working with the Android directory

目前android develop官网直接提供集成Eclipse 和ADT Plugin的adt-bundle 。（http://developer.android.com/index.html），并且使用adt-bundle上面的Android SDK manager可以下载开发所需的SDK，adt-bundle直接将所有设置都配置好，无需用户自己再去手工设置。所以实际上所需的只有adt-bundle和PhoneGap。

PhoneGap下载地址：http://phonegap.com/install/  超级慢最后在百度共享上下载: http://pan.baidu.com/share/link?shareid=2580160533&uk=2067677249

下载之后解压到c盘。

1.下载android 开发工具IDE    Eclipse + ADT plugin

http://developer.android.com/sdk/index.html

2.    环境变量设置 

sdk路径配置：  我的电脑->属性->高级->环境变量 ->系统变量  双击path  在最后添加路径

；F:\chromedownload\adt-bundle-windows-x86-20131030\adt-bundle-windows-x86-20131030\sdk\tools；F:\chrome download\adt-bundle-windows-x86-20131030\adt-bundle-windows-x86-20131030\sdk\platform-tools

 

jdk环境变量配置：

新建：JAVA_HOME               值为：C:\Program Files\Java\jdk1.7.0_45 

新建：CLASSPATH               值为：.;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar;

Path末尾添加    ;C:\ProgramFiles\Java\jdk1.7.0_45\bin  或者    ;%JAVA_HOME%\bin

如果不是使用phonegap开发，而是纯粹使用java开发，至此已经可以使用ADT进行android开发了 

3.ant路径配置：

现在eclipse开发软件当中都继承了ant,要添加的ant路径在adt-bundle-eclipse文件包里面，搜索找到后添加即可：

F:\chrome download\adt-bundle-windows-x86-20131030\adt-bundle-windows-x86-20131030\eclipse\plugins\org.apache.ant_1.8.3.v201301120609\bin

 

配置后的Path:
%SystemRoot%\system32;%SystemRoot%;%SystemRoot%\System32\Wbem;C:\ProgramFiles\Microsoft SQL Server\90\Tools\binn\;E:\adt-bundle-windows-x86-20131030\sdk\tools;E:\adt-bundle-windows-x86-20131030\sdk\platform-tools;C:\ProgramFiles\Java\jdk1.7.0_45\bin;%JAVA_HOME%\bin;E:\adt-bundle-windows-x86-20131030\eclipse\plugins\org.apache.ant_1.8.3.v201301120609\bin

 

4.    创建phonegap工程

进入 windows dos  执行

cd C:\phonegap-2.9.0\lib\android\bin

然后创建新的PhoneGap工程 官网参考如下：

Typein ./create<project_folder_path><package_name><project_name> thenpress "Enter"

create E:\mycourse com.demo.mycoursemycourse 

 

5.    .添加PhoneGap到eclipse

运行eclipse点击左上角的进行导入操作；

选择Android Project from Existing Project；

在import projects文件导入目标文件；

导入的文件便是完整的文件包；

 

如果此时报错 Invalid project description.

这是因为eclipse插件在创建项目的时候需要在workspace目录下创建一个同名的目录。 但发现workspace目录下已存在对应的目录时，就会报上面的处错误信息了。解决方法：把工程从workspace中移出来就可以了，重新导入就可以了。参考：http://blog.csdn.net/imyang2007/article/details/7888263

 

6.    添加moodle源文件到eclipse工程：

github 下载moodle文件包，下载地址https://github.com/moodlehq/moodlemobile

然后将该文件打入到新建工程的assets下面将文件夹更名为www；

但是当使用从github上现在的开发包时，调试时手机只是显示界面无法进行实际操作；因此将已经发布的moodlemobile.apk可从google play或者网易应用http://m.163.com/android/software/32dlal.html下载；将下载之后的文件后缀apk更改为tar解压，获得www文件将，然后将其导入到工程。

 

7.        添加phonegap插件webintent添加到工程

https://github.com/phonegap/phonegap-plugins/tree/DEPRECATED/Android/WebIntent

将webintent.js复制到assets/www文件夹下，并在index.html文件内添加reference 

<script src="childbrowser.js"></script>

创建路径com/borismus/webintent将webintent.java复制进去

res/xml/config.xml

<plugin name="WebIntent"value="com.borismus.webintent.WebIntent" />

 

8.        childbrowser插件添加到工程

https://github.com/alunny/ChildBrowser/blob/master/readmes/android.md

To install the plugin, movewww/childbrowser.js to your project's www folder and include a reference to itin your html file after phonegap.js.

<script type="text/javascript"charset="utf-8" src="phonegap.js"></script>

<script type="text/javascript"charset="utf-8" src="childbrowser.js"></script>

 

Copy the image files folder www/childbrowserto your project'w www folder.

Create a directory within your projectcalled "src/com/phonegap/plugins/childBrowser" and moveChildBrowser.java into it.

其实直接复制childBrowser文件夹下的phonegap文件夹到src/com文件夹即可。

 

Add the following activity to yourAndroidManifest.xml file. It should be added inside the <application>tag.

 

<activityandroid:name="com.phonegap.plugins.childBrowser.ChildBrowser"android:label="@string/app_name">

<intent-filter>

</intent-filter>

</activity>

 

In your res/xml/plugins.xml file add thefollowing line:

 

<plugin name="ChildBrowser"value="com.phonegap.plugins.childBrowser.ChildBrowser"/>

 

8.    修改moodlemobile

moodlemobile更换布局，是通过在moodle当中添加新的布局文件，然后moodlemobile同步moodle的设定，实现新的css布局文件覆盖override app默认的布局文件，具体步骤如下：
1.下载用于替换的模版，https://github.com/moodlehq/moodlemobile/tree/master/css 网速太慢直接下载后传到云盘；（但是这个开发文件只是一个大致框架，运行当中有很多的问题，最后下载发布版本进行反编译，只是简单的将apk后缀名改为tar，然后解压缩，将解压缩之后获得的www文件，放到上面创建的工程的asset文件夹下）；

2.模拟器调试太慢直接真机调试，run as->android appication选择手机，看看是否配置成功；
3.修改logo图标，将www文件夹当中所有的图标替换为希望的图标；

4.汉化：首先将www/lang当中的en.json文件汉化；然后在index.html文件头文件部分添加<metahttp-equiv="Content-Type" content="text/html";charset="utf-8"/>；

5.替换图标drawable当中的替换。

 

9.    成功调试之后会在android工程bin文件夹下出现.apk文件便是安装包；

 

参考：

http://docs.moodle.org/dev/Moodle_Mobile_Building_the_app_for_Android

http://docs.moodle.org/dev/Moodle_Mobile_Customization

http://docs.moodle.org/dev/Moodle_Mobile_Automatic_Building_System

http://docs.moodle.org/dev/Moodle_Mobile

http://docs.moodle.org/25/en/Mobile_app

 

使用android SDK manager 下载SDK时可能提示如下错误

Failed to fectchURl https://dl-ssl.google.com/android/repository/addons_list.xml,reason: Connection to https://dl-ssl.google.com refused

解决办法：（参考： http://lushuifa.iteye.com/blog/1676743）

·        用notepad打开C:\WINDOWS\system32\drivers\etc中的hosts文件

·        在最后一行添加74.125.237.1dl-ssl.google.com

·        成功解决问题。