cordova+Android Studio 1.0+ionic+win7

1、准备工作

·        安装JDK1.6+,设置环境变量

JAVA_HOME

C:\Program Files\Java\jdk1.5.0_07

 

CLASSPATH

.;%JAVA_HOME%\lib

 

Path

%JAVA_HOME%\bin

·        安装ANT,设置环境变量

ANT_HOME

D:\apache-ant-1.8.2                   

 

Path

D:\apache-ant-1.8.2\bin

·        安装Android SDK,设置环境变量

ANDROID_HOME

C:\Program Files\Android\sdk

 

Path

%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools;%ANDROID_HOME%\build-tools\20.0.0;

·        安装VS2013 WP8模拟器

 

2、下载Node.js

http://nodejs.org/下载32位或64位版本

3、运行Node.js command prompt

输入配置phonegap

C:\Users\用户名> npm install -gphonegap

phonegap保存在C:\Users\[用户名]\AppData\Roaming\npm

4、在项目目录下执行

a、创建工程

C:\Users\用户名>phonegap create myapp
C:\Users\用户名\myapp>cd myapp

b、添加平台支持

> cordova platforms add ios 
> cordova platforms add android 
> cordova platforms ls

c、添加插件(在Android Studio 1.0可略去)

> cordova plugin add org.apache.cordova.device 
> cordova plugin add org.apache.cordova.console 
> cordova plugin ls

d、编译代码

> cordova build android

e、运行代码

(1)在模拟器上
> cordova emulate android
(2)在浏览器上
> cordova serve android
浏览器访问地址:http://localhost:8000/,就可以和调试页面一样调试app的布局了。如果app中使用了cordova的Native API调用,会弹出以下对话框: 
 
这是因为浏览器无法提供@JavascriptInterface的接口,Cordova视图通过prompt()和Native交互,这样做是因为Android2.3 simulatorBug。所以调试页面布局,无视即可。 
(3)在真机上
C:\Users\用户名\myapp> cordova run android
或者C:\Users\用户名\myapp> cordova run wp8/ios

cordova会自动建立my-app文件夹,不同平台的项目在platforms文件夹下面 缓存的内容在C:\Users\[用户名]\.cordova\lib

5、配置ionic

 

1、打开Node.js命令行
2
、输入C:\Users\用户名>npm install -g cordova ionic
3
、建立工程输入$ionic start myApp tabs
4
、如果工程已经建立过,会出现would you like to overwrite the directory with this new project?yes
5
、运行添加不同平台,如果为android,直接将ios替换成android即可。
$ cd myApp
$ ionic platform add ios
编译$ ionic build ios
运行在模拟器上$ ionic emulate

运行在浏览器上$ ionic serve

运行在真机上$ionic run

6、移植到Android Studio 1.0

 Android Studio 1.0:由于AndroidStudio 1.0默认安装的是Android5.0,编译器版本是21,gradle目前版本是2.2.1,所以要对相关文件做一些更改
(1)修改选择my-app\platforms\android\build.gradle

第10行 classpath 'com.android.tools.build:gradle:1.0.+'
第40行 compileSdkVersion 21
第41行 buildToolsVersion "21.1.1"
第74行 gradleVersion = '2.2.1'

(2)修改my-app\platforms\android\project.properties

第13行 target=android-21

(3)修改my-app\platforms\android\AndroidManifest.xml

第13行 <uses-sdk android:minSdkVersion="10" android:targetSdkVersion="21" />

(4)修改my-app\platforms\android\CordovaLib\build.gradle

第28行 classpath 'com.android.tools.build:gradle:1.0.+'
第35行 compileSdkVersion 21
第36行 buildToolsVersion "21.1.1"

(5)修改my-app\platforms\android\CordovaLib\project.properties

第13行 target=android-21

(6)修改my-app\platforms\android\CordovaLib\

AndroidManifest.xml

第22行 <uses-sdk android:minSdkVersion="10" />
(7)导入工程import project->选择build.gradle 
位于my-app\platforms\android\build.gradle
gradle的下载路径为C:\Users\[用户名]\.gradle\wrapper\dists,可以用下载工具下载后拷到相应目录下,并新建一个内容为空的gradle-2.2.1-all.zip.ok文件 8、如果编译报错,提示Task '' not found in root project 'android',则打开android.iml,点击“同步”即可。

至此工程建立完成

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值