PhoneGap Android article

Source: Internet
Author: User
Tags install node

Recently in the use of phonegap through the parties to explore and read a variety of information encountered problems are resolved, here to write a summary for everyone and their own later review, the 13th step can be ignored before the front is enough to generate and publish the app

Upgrade Project Cordova, now 3.5.0 version

D:\projectname>cordova Platform update Android

    1. PHONEGAP installation, each step has the corresponding command to check if there is no correct installation, if there is no subsequent compilation when there is enough information to indicate where not installed correctly

Environment: Win system, jdk,android,eclipse,ant,git,phonegap3.x (Cordova)

1. Install JRE, set java_home, such as Java_home=c:\program\java\jre6\bin, how to set the settings to see the JDK

Check: Hit java-version to view the Java version if you make sure that you have a JDK but you can't find a command in Java, that's where the path is not set. In the win7 environment variable, set the bin directory in the JDK installation directory to copy in

2. Cordova supports Android 2.2, 2.3, and 4.x.

Download and install sdk:http://developer.android.com/sdk/index.html

Installing the Android SDK, such as installing the c:\android-sdk\, requires adding c:\android-sdk\tools and platform-tools to the system PATH environment variable.

Or the 8th step out of the following error:

[error:the command ' Android ' failed. Make sure your latest Android SDK installed, and the ' Android ' command (inside the Tools/folder) added to your PA Th. Output: ' Android ' ...]

3. Install eclipse to be able to support Android projects. http://www.eclipse.org/downloads/

4. Install Ant and add the directory where the Ant.bat is located to the PATH environment variable, such as c:\apache-ant\bin\,http://ant.apache.org.

5. Install node. js, after successful installation, you can enter commands at the command line: node or NPM. http://nodejs.org/.

(Note: All of the following commands are entered in the Nodejs command-line window)

6. Installing the PhoneGap toolset: Open command line, run: NPM install-g phonegap

7. Move the drive letter to the directory where you want to create the project, such as C: \.

8. Create app, run: Phonegap/cordova Create hello Com.vmeitime.hello HelloWorld

A project named HelloWorld is created under C:\hello, and the HTML5 file is in the C:\hello\www directory.

The first parameter, Hello, represents the project folder name, where the WWW subdirectory is generated as the main page in the directory, including Css,js and IMG resources. In this configuration, config: Contains important resource descriptions and project configurations information.

The 2nd parameter is optional, Com.vmeitime.hello represents the project package name, and the 3rd parameter: Helloword represents the displayed text;

Also available with-I and-n command options: c:\> phonegap create Hello-n helloworld-i Com.vmeitime.hello

c:\> phonegap Create Hello--name HelloWorld--id Com.vmeitime.hello

Of course, after the command executes, the above information can also be modified in the subsequent development of the corresponding values in Comfig.xml.

9. Follow-up is done in the project directory you created: cd Hello

10. Run the build command, enter the different platform identities, and generate the corresponding files under different platforms. The following are examples of Android devices:

C:\hello> PhoneGap Build Android, if you want to build release version: Cordova build android–release (must use Cordova here, PhoneGap cannot be generated Relea SE version)

To see the verbose (verbose) execution process, you can increase the command parameter-V:

C:\hello> Phonegap-v Build Android

You can then see the Android project appearing in C:\hello\platforms\android.

11. Test App:c:\hello>phonegap install Android on a module or mobile device

D:\projectname\platforms\android\ant-build>phonegap Run Android

Also available with the parameter e specifically specified to run on the module: C:\hello>phonegap-e install Android

Build and run (equivalent to the above build and install two step operation): C:\hello>phonegap run Android

Also available with the parameter e specifically specified to run on the module: C:\hello>phonegap-e run Android

13 to sign the release version, first you want to be a keystore to Mr.

This command is to sign the release version so that it can be posted on Google Play

D:\projectName \platforms\android\ant-build >jarsigner-verbose-sigalg sha1withrsa-digestalg sha1-keystore Xx.keystore xx.apk Mykey-storepass XX

Storepass is your keystore password, MyKey is your keystore alias

You can use Keytool-list-keystore Myname.keystore to view specific information about your keystore.

14 after signing your post to Google Play you will be prompted not to zipalign

D:

CD D:\Enviroment\Android Software\sdk\sdk\tools

Zipalign-f-V 4 "d:\ projectname\platforms\android\ant-build\project-release.apk" "D:\ projectName\platforms\android \ant-build\project.apk "

This will finally generate an apk that can be posted to Google Play.

15 Debugging there are 3 ways

    • PhoneGap run Android directly with the command
    • With Avdmanger
    • Real-Machine debugging, you can put the APK in Dropbox and then directly installed on it.

Icon and SplashScreen

In version 3.5, config. D:/project/config.xml is placed in the topmost folder.

Then add this section to CONFIG.

<platform name= "Android" >

<icon src= "Res/android/icon.png" density= "ldpi"/>

<icon src= "Res/android/icon.png" density= "mdpi"/>

<icon src= "Res/android/icon.png" density= "hdpi"/>

<icon src= "Res/android/icon.png" density= "xhdpi"/>

</platform>

Splahscreen to go directly to d:\projectNam\platforms\android\res inside set

__________________________________________________________________________________________

16. Open Eclispe, import Project C:\hello\platforms\android,helloworld.

17. There may be some errors in the project, and setting the Android project Build target to the highest level of API will generally be resolved.

18. You can then start the project with Eclipse.

19. You can use the command PhoneGap emulate Android to start the project in the simulator, but it feels more troublesome than eclipse and always launches a new simulator.

In this way also pay attention to the version of the Android virtual device, it seems at least API level 10, because the auto-generated androidmanifest.xml:

<USES-SDK android:minsdkversion= "ten" android:targetsdkversion= "/>"

20. You can run the app on your real device with the command PhoneGap run Android.

21. Add a plugin (you need to install the Git tool https://help.github.com/articles/set-up-git first):

PHONEGAP 3.0 The most need to focus on is the full plug-in architecture, all the features including the camera, etc. are provided using plug-in way. This means that many features are not available after you create a new project, and you must add its corresponding plug-in to your project.

For example, adding a plug-in to Cordova is as follows:

Cordova Plugin Add Https://git-wip-us.apache.org/repos/asf/cordova-plugin-camera.git

The way to do this is by phonegap the command-line tool:

PhoneGap Local plugin Add https://git-wip-us.apache.org/repos/asf/cordova-plugin-camera.git

This means that when you start the PHONEGAP project, you need to consider what features the project requires, and then add these features from the command line.

1). The added plugins will be placed in the C:\hello\plugins directory.

2). Add the feature plug-in configuration to the config. ins file in all platforms, such as the:c:\hello\platforms\< platform >\res\xml\config.xml)

3). Add the appropriate plugin Java files: C:\hello\platforms\android\src

4). Add the corresponding plugin js file: C:\hello\platforms\android\assets\www\plugins

The following is a complete list of plugins, which I copied directly and may change:

Basic device information (device API):

$ phonegap Local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-device.git

Network Connection and Battery Events:

$ phonegap Local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-network-information.git

$ phonegap Local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-battery-status.git

Accelerometer, Compass, and geolocation:

$ phonegap Local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-device-motion.git

$ phonegap Local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-device-orientation.git

$ phonegap Local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-geolocation.git

Camera, Media playback and Capture:

$ phonegap Local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-camera.git

$ phonegap Local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-media-capture.git

$ phonegap Local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-media.git

Access files on device or network (File API):

$ phonegap Local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-file.git

$ phonegap Local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-file-transfer.git

Notification via dialog box or vibration:

$ phonegap Local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-dialogs.git

$ phonegap Local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-vibration.git

Contacts:

$ phonegap Local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-contacts.git

Globalization:

$ phonegap Local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-globalization.git

SplashScreen:

$ phonegap Local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-splashscreen.git

Open new browser windows (Inappbrowser):

$ phonegap Local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-inappbrowser.git

Debug Console:

$ phonegap Local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-console.git

View currently installed plugins: $ phonegap Local plugin list

Remove the specified plug-in: $ phonegap Local plugin Remove Org.apache.cordova.core.console

22 Customizing each platform resource (merges):

In the www/merges/directory to create various platform different resource files, such as css,js, pictures, etc., referring to the corresponding file path, do not need to write the platform path. Such as:

Add a custom CSS file to the www/index.html file Overrides.css as follows:

<link rel= "stylesheet" type= "Text/css" href= "Css/overrides.css"/>

In the Www/merges/android/directory, create a overrides.css for the Android platform, (if it is iOS, it is the Www/merges/ios/overrides.css file. )

Add the following to the Overrides.css file, overwriting the default 12px text size style in the Www/css/index.css file:

body {font-size:14px;}

In this way, under the Android platform, the file displayed is 14px, the text displayed under other platforms is 12px;

You can also add custom picture resources for each platform, such as Merges/ios/img/back_button.png, which is referenced in the www/index.html page img/back_button.png.

23. Remote compilation:

By default, it is the appropriate platform to compile the locally installed SDK environment, and the build target is platforms. However, you can also remotely compile the appropriate platform without installing the SDK (or installed SDK) locally. can also be remotely tested.

1). First, you need to register your account on the PhoneGap Build website (https://build.phonegap.com/) and log in using the login command.

$ phonegap Remote login-u [email protected]-P mypassw0rd

$ phonegap Remote login--username [email protected]--password mypassw0rd

Use the Loginout command to exit the login PhoneGap build.

$ phonegap Remote Logout

2). Remote compile: $ phonegap Remotes Build iOS

3). To use the plugin, you must first add the plugin to the local and then compile it remotely. Such as:

$ phonegap Local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-network-information.git

$ phonegap Remote Build iOS

4) $ phonegap Remote Install iOS

# ... or ...

$ phonegap Remote Run iOS

5) Local compilation by default, the following two commands are the same effect:

$ phonegap Local Build iOS

$ phonegap Build iOS

24. Update PhoneGap to the latest version of the command:c:\> NPM update-g phonegap

22. View the PhoneGap version command:

$ phonegap Version

$ phonegap-v

25. View the PhoneGap details command:

$ NPM Info PhoneGap

26. To install the specified version of the PHONEGAP command:

c:\> NPM install-g [email protected]

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.