0%
Loading ...

FLASH-JET

Create Android Phonegap HTML5 project

Android Goes All In On Html5

01. Install Android Studio.

Verify that JDK installed, if not then download and install it from here.

02. Create example project of hello world.

03. Run the project on AVD (Android Virtual Device) – Verify everything works ok:

  • Create AVD
  • Select Phone: Nexus 5x
    • System with VT-x select Image x86.
    • Weak system select arm
  • Kitkat 4.4 with google APIs

04. Install Node.js. Use the LTS version.

 

05. Install PhoneGap or open command prompt and write there:

  • Option 1:
    • Open command prompt as Administrator.
    • npm install -g phonegap
  • Option 2:
    • Download phonegap installer
    • Run phonegap desktop up at windows start, search “Phonegap Desktop”.
    • C:ProgramDataMicrosoftWindowsStart MenuProgramsAdobePhoneGapAdobePhoneGap

06. Open command prompt.

07. Create a phonegap project as follows:

phonegap create

Example: c:>phonegap create myfirstproject com.myfirst.androidproject my_first_android_project

cd (change directory) to the directory you have created at #2 (“myfirstproject”).

At command prompt write the following: c:>phonegap platform add android

08. Open Android Studio

09. Select “Import project”

10. Browse to path you have created at #8 +”platforms” and select directory “android”.

11.  At all of the following options click next.

12. Upon Android studio asks is to overwrite the directory, select YES, click next.

13. Some SDK and Gradle error appeared with link next to it. After clicking on the link, Android studio downloads all required competent.

Click on the link as illustrated at the following picture:

Capture

14. Click on Run an android studio, it will run AVD (android virtual machine) and then the HTML5 application will be loaded.

15. How to stuff:

01. How to change app name?

  • click on the following picture:

01.changeAppName

02. How to Change app icon?

  • Delete previous icon.
    • Under android->res->drawable delete icon.png
  • For Android Studio:
    • Option A:
      • Right click on android->res, new Image Asset
      • On Asset type choose Action Bar and Tab Icons
      • Choose the image path or enter Text Name
      • Give your image a name in Resource name (name it icon).
      • Next->Finish
    • Option B
      • Right click on android->res->drawable->icon and delete it.
      • Right click on android-res select new->image asset
      • Click on image and select a picture to use as icon.
      • Then click on next->finish.
      • Under android->manifests edit AndroidManifests.xml.
      • Replace 
        • android:icon=”@drawable/icon”
        • By
        • android:icon=”@mipmap/ic_launcher” , save the file.
      • Delete from Res-xml-config.xml records of icon.

External sources:

https://www.youtube.com/watch?v=V1VVMVlZgoI

03 – How to remove Phonegap splash screen?

  • Delete android->res-drawable->screen.png
  • Delete lines of splash from
    • android->manifests->AndroidMenifest.xml
  • Delete from android->res->xml->config.xml block that starts with

 

 

gmagen

,
, , , ,