在android真机上运行cocos2d-html5-2.2自带的HelloHTML5World和其它demo

第一步:mac10.9上搭建android和eclipse的运行环境

主要参考下面两篇文章:

http://www.raywenderlich.com/5527/getting-started-with-android-development

http://www.cocos2d-x.org/wiki/Installation_guide_of_Android_ndk_r4b_development_environment#1-JDK

1.JDK 

下载地址： http://www.oracle.com/technetwork/java/javase/downloads/index.html  ,选择 Java Platform (JDK) 7u45 下载。安装之后

$ java -version

java version "1.7.0_45"

Java(TM) SE Runtime Environment (build 1.7.0_45-b18)

Java HotSpot(TM) 64-Bit Server VM (build 24.45-b08, mixed mode)

2.Elipse IDE

下载地址: http://www.eclipse.org/downloads/ 选择 Eclipse Standard 4.3.1, 196 MB -> Mac OS X 64 Bit

3.Android SDK

下载地址:http://developer.android.com/sdk/index.html

4. 设置环境变量

$vi ~/.bash_profile
在最后添加: 
export PATH=$PATH:/Users/wenke/Documents/tools/cocos2d/android/android-sdk-macosx/tools
export PATH=$PATH:/Users/wenke/Documents/tools/cocos2d/android/android-sdk-macosx/platform-tools
export PATH=$PATH:/Users/wenke/Documents/tools/cocos2d/android/android-ndk-r9b
export ANDROID_NDK_ROOT=/Users/wenke/Documents/tools/cocos2d/android/android-ndk-r9b
export ANDROID_SDK_ROOT=/Users/wenke/Documents/tools/cocos2d/android/android-sdk-macosx
export NDK_ROOT=/Users/wenke/Documents/tools/cocos2d/android/android-ndk-r9b


5.
在elipse里面安装ADT等插件的过程，大概4分钟。重启之后，会提示设置sdk路径，然后会打开SDK manager，安装一些东西，速度在500多K，大概5分钟

6.
wenke-mini:~ wenke$ android list targets
Available Android targets:
----------
id: 1 or "android-19"
     Name: Android 4.4
     Type: Platform
     API level: 19
     Revision: 1
     Skins: HVGA, QVGA, WQVGA400, WQVGA432, WSVGA, WVGA800 (default), WVGA854, WXGA720, WXGA800, WXGA800-7in
     ABIs : armeabi-v7a
----------
id: 2 or "Google Inc.:Google APIs:19"
     Name: Google APIs
     Type: Add-On
     Vendor: Google Inc.
     Revision: 1
     Description: Android + Google APIs
     Based on Android 4.4 (API level 19)
     Libraries:
      * com.google.android.media.effects (effects.jar)
          Collection of video effects
      * com.android.future.usb.accessory (usb.jar)
          API for USB Accessories
      * com.google.android.maps (maps.jar)
          API for Google Maps
     Skins: WVGA854, WQVGA400, WSVGA, WXGA800-7in, WXGA720, HVGA, WQVGA432, WVGA800 (default), QVGA, WXGA800
     ABIs : armeabi-v7a


wenke-mini:~ wenke$ android create avd --name sdk_22_version --target  android-19
Auto-selecting single ABI armeabi-v7a
Android 4.4 is a basic Android platform.
Do you wish to create a custom hardware profile [no]
Created AVD 'sdk_22_version' based on Android 4.4, ARM (armeabi-v7a) processor,
with the following hardware config:
hw.lcd.density=240
vm.heapSize=48
hw.ramSize=512
wenke-mini:~ wenke$ 


在Eclipse->Window->Navigation->Android Virtual Device Manager里面，可以看到新增加的AVD: sdk_22_version


8.
wenke-mini:samples wenke$ android update project --path hello-jni --target 1
Updated and renamed default.properties to project.properties
Updated local.properties
No project name specified, using Activity name 'HelloJni'.
If you wish to change it, edit the first line of build.xml.
Added file hello-jni/build.xml
Added file hello-jni/proguard-project.txt
It seems that there are sub-projects. If you want to update them
please use the --subprojects parameter.

因为mac 升级到10.9的时候，系统已经把ant删除了，所以需要重新安装！

wenke-mini:samples wenke$ su
sh-3.2#brew update
sh-3.2# brew install ant
Warning: No developer tools installed.
You should install the Command Line Tools.
Run `xcode-select --install` to install them.
==> Downloading http://www.apache.org/dyn/closer.cgi?path=ant/binaries/apache-ant-1.9.2-bin.tar.gz
==> Best Mirror http://apache.fayea.com/apache-mirror/ant/binaries/apache-ant-1.9.2-bin.tar.gz
######################################################################## 100.0%
  /usr/local/Cellar/ant/1.9.2: 1590 files, 39M, built in 8 seconds
sh-3.2# xcode-select --install
xcode-select: note: install requested for command line developer tools
在弹出的提示框里，确认安装xcode命令行工具,大约半小时  
(注：10.9必须这样安装，如果下载ant的二进制文件，然后把bin路径解压添加进PATH，会造成其他问题，详见http://nathancahill.github.io/installing-homebrew-on-mac-osx-mavericks/ 的第一楼回复!)

bash-3.2$ $ANDROID_SDK_ROOT/tools/emulator -avd sdk_wenke
等一会，就能看到android的模拟器了！ （注：模拟器测试会有很多意想不到的错误。建议还是直接usb连接android真机测试！）

第二步:android真机上运行cocos2d-html5-2.2自带的HelloHTML5World

首先请参考之前的文章在ios真机上运行cocos2d-html5-2.2自带的HelloHTML5World里面的

step1：在cocos2d-x-2.2里面，用命令行新建javascript版本的项目HelloHTML5World

HelloHTML5World的路径是: /Users/wenke/Documents/cocos2d/cocos2d-x-2.2/projects/HelloHTML5World

请认真阅读：

/Users/wenke/Documents/cocos2d/cocos2d-x-2.2/projects/HelloHTML5World/proj.android/README.md

注：这个官方文档里面基本讲清楚了android真机上运行cocos2d-html5-2.2自带的HelloHTML5World的步骤，但是由于cocos2d-x的版本升级了，而且安装的sdk和ndk的版本也升级了，所以还是遇到了几个坑.

1.http://www.mobfound.com/，下载安装mac版本的 魔方手机助手.app，将android真机连接上mac，打开魔方手机助手.app，会自动安装驱动.

2.设置环境变量

$vi ~/.bash_profile
在最后添加: 
export PATH=$PATH:/Users/wenke/Documents/tools/cocos2d/android/android-sdk-macosx/tools
export PATH=$PATH:/Users/wenke/Documents/tools/cocos2d/android/android-sdk-macosx/platform-tools
export PATH=$PATH:/Users/wenke/Documents/tools/cocos2d/android/android-ndk-r9b
export ANDROID_NDK_ROOT=/Users/wenke/Documents/tools/cocos2d/android/android-ndk-r9b
export ANDROID_SDK_ROOT=/Users/wenke/Documents/tools/cocos2d/android/android-sdk-macosx
export NDK_ROOT=/Users/wenke/Documents/tools/cocos2d/android/android-ndk-r9b

这是最终版本的，中间报错，逐渐完善的过程就不一一赘述了！

3.打开Terminal

1)

$ cd /Users/wenke/Documents/cocos2d/cocos2d-x-2.2/projects/HelloHTML5World/proj.android

$ android list target  (这个命令用来查看已安装的sdk包)

Available Android targets:
----------
id: 1 or "android-19"
     ...
----------
id: 2 or "Google Inc.:Google APIs:19"
....

$ android update project -p . -t  android-19 

(a.因为我只装了android-19，所以target只能选择1或者android-19  

b.之前用命令create_project.py生成的target是“android-8”，必须改成本机的可用target

c.也可以直接编辑/Users/wenke/Documents/cocos2d/cocos2d-x-2.2/projects/HelloHTML5World/proj.android/project.properties 

修改

target=android-8 

为

 target=android-19

)

2)

$vi HelloHTML5World/proj.android/jni/Application.mk 在最后添加一行:

APP_CFLAGS += -Wno-error=format-security

这一步很重要，如果有同学是跟我一样用的是NDK r9的就要注意啦，意思是忽略格式错误（我的理解哈），不然会报error。

参考文章：http://www.ptoh.net/blog/index.php/archives/80  

3)

$ vi /Users/wenke/Documents/cocos2d/cocos2d-x-2.2/projects/HelloHTML5World/proj.android/build_native.sh:
1)注释掉下面这一行
mkdir "$APP_ANDROID_ROOT"/assets/res
2)在
cp -f "$BINDINGS_JS_ROOT"/* "$APP_ANDROID_ROOT"/assets
下面添加：

# link res and src from the cocos2d-html5 Resource dir
ln -s /Applications/XAMPP/xamppfiles/htdocs/Cocos2d_html5_v22/HelloHTML5World/res "$APP_ANDROID_ROOT"/assets/res
ln -s /Applications/XAMPP/xamppfiles/htdocs/Cocos2d_html5_v22/HelloHTML5World/src "$APP_ANDROID_ROOT"/assets/src
echo "link res and src from the cocos2d-html5 Resource dir"
#这几行是为了将cocos2d-html5的res和src目录引用过来，这样才能做到一次js编写代码，ios和android平台都能运行


# link res and src from the cocos2d-html5 Resource dir
ln -s "$COCOS2DX_ROOT"/CocosDenshion "$APP_ANDROID_ROOT"/CocosDenshion
echo "link CocosDenshion"
#这几行的目的是避免AppDelegate.cpp里面出现错误提示:Unresolved inclusion: "SimpleAudioEngine.h"  和 Symbol 'CocosDenshion' could not be resolved等等

4.打开Elipse,

1)Path Variable `COCOS2DX`: 
    * Eclipse->Preferences->General->Workspace->**Linked Resources**
    * Click **New** button to add a Path Variable `COCOS2DX` pointing to the root cocos2d-x directory.(/Users/wenke/Documents/cocos2d/cocos2d-x-2.2)

  2)

i. C/C++ Environment Variable `NDK_ROOT`: 
    * Eclipse->Preferences->C/C++->Build->**Environment**.
    * Click **Add** button and add a new variable `NDK_ROOT` pointing to the root NDK directory.(/Users/wenke/Documents/tools/cocos2d/android/android-ndk-r9b)

 ii.Android->NDK Location

   * Eclipse->Preferences->Android->NDK
    *NDK Location:  pointing to the root NDK directory.(/Users/wenke/Documents/tools/cocos2d/android/android-ndk-r9b)

3)Import libcocos2dx library project:

1. File->New->Project->Android Project From Existing Code.
2. Click **Browse** button and open `/Users/wenke/Documents/cocos2d/cocos2d-x-2.2/cocos2dx/platform/android/java` directory.
3. Click **Finish** to add project.
**NOTE:** This step needs to be done only once to setup the Eclipse environment for cocos2d-x projects. Skip this section if you've done this before.

3) File->New->Project->Android Project From Existing Code

  **Browse** to your project directory. eg: `/Users/wenke/Documents/cocos2d/cocos2d-x-2.2/projects/HelloHTML5World/proj.android`
 Add the project 

4)右键HelloHTML5World->Properties->Builders
Invalid External tool Builder (如果有这一前面是红x的选项的话，Remove)

5)选择 Window->Show View->Other->Android->Devices  
就会在主窗口的下方出现Devices子窗口。显示当前已连接的设备或者模拟器（注意，一次只能有一个模拟器或者一个设备，否则adb install的时候不知道装到哪个上去）

6) Click **Run** or **Debug** to compile C++ followed by Java and to run on connected device or emulator.

7)所有cc.log输出的日志信息，会出现在Logcat的debug里面，而不是在Console里面

第三步：运行htm5_tests（拷贝粘贴自samples/tests）

1.

用

/Applications/XAMPP/xamppfiles/htdocs/Cocos2d_html5_v22/html5_tests/cocs2d.js里面的 appFiles = [...], 数组里面的引用文件内容

替换掉

/Users/wenke/Documents/cocos2d/cocos2d-x-2.2/projects/html5_tests/Resources/main.js里面的 appFiles = [...]; 数组里面的引用文件内容

2.如果测试Test Cases里面的Extensions Test->websocketTest和XMLHttpRequest等联网功能时，

a)AndroidManifest.xml 添加访问网络权限:
<uses-permission android:name="android.permission.INTERNET"/>  

b)必须保证android测试真机要么是有sim卡，要么是通过无线上网了的，否则所有的联网功能测试都不好使！否则可能出现下面的错误提示:
(iphone的真机是插了sim卡的，可以走gprs联网，所以每次测试都能成功！)

11-12 00:25:26.323: D/libc-netbsd(23901): getaddrinfo: httpbin.org  return error = 0x7 >>
11-12 00:25:26.326: D/libc-netbsd(23901): res_queryN name = httpbin.org, class = 1, type = 1
11-12 00:25:26.327: D/libc-netbsd(23901): res_queryN name = httpbin.org., class = 1, type = 1
11-12 00:25:26.327: D/libc-netbsd(23901): getaddrinfo: httpbin.org  return error = 0x7 >>
11-12 00:25:26.350: D/cocos2d-x debug info(23901): response failed

c)如果出现下面的错误提示:

System property http.nonProxyHosts has been set to local„ÄÅ169.254/16|*.local„ÄÅ169.254/16 by an external source. This value will be overwritten using the values from the preferences

解决办法：

I found this in System Preferences -> Network -> wifi -> Advanced -> Proxies:Bypass proxy for these Hosts & Domains: *.local, 169.254/16. 
Removing *.local and *.169.254 from the list solves the problem.

第四步：运行samples/games/FruitAttack

1.

/Users/wenke/Documents/cocos2d/cocos2d-x-2.2/projects/FruitAttack/Resourcesmain.js

1）

var appFiles = [
                'src/CCNotificationCenter.js',
                'src/WelcomeLayer.js',
                'src/GameData.js',
                'src/Pattern.js',
                'src/PatternMatrix.js',
                'src/ResultLayer.js'
];

2）

var myScene = new MyGameScene();

2.

/Users/wenke/Documents/cocos2d/cocos2d-x-2.2/projects/FruitAttack/proj.android/build_native.sh

1)

#mkdir "$APP_ANDROID_ROOT"/assets/res

2)

# link res and src from the cocos2d-html5 Resource dir
ln -s /Applications/XAMPP/xamppfiles/htdocs/Cocos2d_html5_v22/samples/games/FruitAttack/res "$APP_ANDROID_ROOT"/assets/res
ln -s /Applications/XAMPP/xamppfiles/htdocs/Cocos2d_html5_v22/samples/games/FruitAttack/src "$APP_ANDROID_ROOT"/assets/src
ln -s /Applications/XAMPP/xamppfiles/htdocs/Cocos2d_html5_v22/samples/games/FruitAttack/audio "$APP_ANDROID_ROOT"/assets/audio
ln -s /Applications/XAMPP/xamppfiles/htdocs/Cocos2d_html5_v22/samples/games/FruitAttack/resultLayer "$APP_ANDROID_ROOT"/assets/resultLayer
echo "link res and src from the cocos2d-html5 Resource dir"


# link res and src from the cocos2d-html5 Resource dir
if [ -d "$APP_ANDROID_ROOT"/CocosDenshion ]; then
    rm -rf "$APP_ANDROID_ROOT"/CocosDenshion
fi
ln -s "$COCOS2DX_ROOT"/CocosDenshion "$APP_ANDROID_ROOT"/CocosDenshion
echo "link CocosDenshion"

3./Users/wenke/Documents/cocos2d/cocos2d-x-2.2/scripting/javascript/bindings/js/jsb_cocos2d.js 
添加:
cc.Point = function (x, y) {
    return cc.p(0, 0);
};

cc.RectZero = function () {
    return cc.rect(0, 0, 0, 0);
};

第五步：运行samples/games/MoonWarriors

1.main.js

var myApp = new cocos2dApp(SysMenu.scene);

改成:

var myApp = new cocos2dApp(SysMenuScene);

2.SysMenu.js

最后添加:

var SysMenuScene = cc.Scene.extend({

   ctor:function() {

       this._super();

       cc.associateWithNative( this, cc.Scene );

   },

   onEnter:function () {

       this._super();

       var layer = new SysMenu();

       this.addChild(layer);

       layer.init();

   }

});

3.

/Users/wenke/Documents/cocos2d/cocos2d-x-2.2/projects/MoonWarriors/proj.android/build_native.sh

1)

#mkdir "$APP_ANDROID_ROOT"/assets/res

2)

# link res and src from the cocos2d-html5 Resource dir
ln -s /Applications/XAMPP/xamppfiles/htdocs/Cocos2d_html5_v22/samples/games/MoonWarriors/res "$APP_ANDROID_ROOT"/assets/res
ln -s /Applications/XAMPP/xamppfiles/htdocs/Cocos2d_html5_v22/samples/games/MoonWarriors/src "$APP_ANDROID_ROOT"/assets/src
echo "link res and src from the cocos2d-html5 Resource dir"


# link res and src from the cocos2d-html5 Resource dir
if [ -d "$APP_ANDROID_ROOT"/CocosDenshion ]; then
    rm -rf "$APP_ANDROID_ROOT"/CocosDenshion
fi
ln -s "$COCOS2DX_ROOT"/CocosDenshion "$APP_ANDROID_ROOT"/CocosDenshion
echo "link CocosDenshion"