Hot File

Create Quick Tip Using and Installing Cordova

View: 338    Dowload: 0   Comment: 0   Post by: hanhga  
Author: none   Category: Android   Fields: Other

0 point/0 review File has been tested

First install Node.js from their official packages,Homebrew (Mac), Chocolatey or Scoop (Windows). Cordova uses the package manager of Node.js, npm, for installation.

Introduction

First install Node.js from their official packages,Homebrew (Mac), Chocolatey or Scoop (Windows). Cordova uses the package manager of Node.js, npm, for installation.

On OSX and Linux open your terminal and run:

sudo npm install -g cordova

On Windows open Command Prompt run:

C:\>npm install -g cordova

This installs the Cordova package globally and accessible in any project.

Create a Project

Create a new project with cordova create <name> e.g.

cordova create my-mobile-app
cd my-mobile-app

Add a Platform

Type cordova platform to see a list of available platforms. You’ll see different options depending on the operating system, here’s the results on a Mac.

Cordova Platform Options

Add a platform with cordova platform add <platform>, e.g.

cordova platform add ios
cordova platform add android

To build and run you’ll need SDKs for each platform that you want to target installed. We have a handy quick tip for installing Android and for iOS you will need XCode.

To check you have everything needed for the platforms added, run:

cordova requirements

Build

Build your app with cordova build <platform>, e.g.

cordova build ios
cordova build android

You can also run cordova build to build all platforms added to the project.

Run

Run the app with cordova run <platform>, e.g.

cordova run ios
cordova run android

 

Note: On a Mac cordova run ios will open the iOS Simulator. A good option for emulating android devices is with GenyMotion that lets you install and run popular android devices as a Virtual Machine (VM). Once the VM is running, cordova run android will install and run the app.

Plugins

Plugins are additions to Cordova that allow you to access hardware features from JavaScript.

To Install a plugin run cordova plugin add <plugin>. For example, to install the camera plugin.

cordova plugin add cordova-plugin-camera

Adding Your Application

The custom code for your app sits in the www directory. You can edit those files, build and run to see the changes reflected in an emulator. As an example, add a button which will take a photo from the library and show it in the view.

Replace the #deviceready div in index.html with:

<div id="deviceready">
  <p>
    <button id="get-picture">Take a photo</button>
  </p>
  <p>
    <img id="my-photo" width="300" />
  </p>
</div>

Add the following to the end of js/index.js:

document.getElementById('get-picture').addEventListener('click', getPicture, false);

function getPicture() {
  navigator.camera.getPicture(onSuccess, onFail, {
    quality: 50,
    sourceType: Camera.PictureSourceType.PHOTOLIBRARY,
    destinationType: Camera.DestinationType.FILE_URI
  });
}

function onSuccess(imageURI) {
  var image = document.getElementById('my-photo');
  image.src = imageURI;
}

function onFail(message) {
  alert('Failed because: ' + message);
}

Build then Run and you should be able to test out your first ‘native’ feature.

Camera Example

You’re on your way to building great apps :)

Next Steps

Read the Cordova Overview for an understanding of how Cordova works and search the Plugins to see what’s available on different platforms.

 

Note: On a Mac cordova run ios will open the iOS Simulator. A good option for emulating android devices is with GenyMotion that lets you install and run popular android devices as a Virtual Machine (VM). Once the VM is running, cordova run android will install and run the app.

Plugins

Plugins are additions to Cordova that allow you to access hardware features from JavaScript.

To Install a plugin run cordova plugin add <plugin>. For example, to install the camera plugin.

Create Quick Tip Using and Installing Cordova

Create Quick Tip Using and Installing Cordova Posted on 06-07-2016  First install Node.js from their official packages,Homebrew (Mac), Chocolatey or Scoop (Windows). Cordova uses the package manager of Node.js, npm, for installation. 5/10 338

Comment:

To comment you must be logged in members.

Files with category

  • How to Monetizing Apps with the Google AdMob SDK

    View: 433    Download: 0   Comment: 0   Author: none  

    How to Monetizing Apps with the Google AdMob SDK

    Category: Android
    Fields: Other

    4.75/2 review
    AdMob is a mobile advertising platform from Google that developers can use to generate revenue from apps through in-app advertising. AdMob provides different sets of ads like banner ads, interstitial ads, video ads, or native ads integrated with...

  • How to Securing Your Android Apps with the Fingerprint API

    View: 362    Download: 0   Comment: 0   Author: none  

    How to Securing Your Android Apps with the Fingerprint API

    Category: Android
    Fields: Other

    5/1 review
    Passwords have had their day, with software vendors and hardware manufacturers encouraging users to try other methods of securing their data. Fingerprint readers are becoming more common on Android devices since Marshmallow introduced a new...

  • Transfer Data between Activities with Android Parcelable with android

    View: 781    Download: 0   Comment: 0   Author: none  

    Transfer Data between Activities with Android Parcelable with android

    Category: Android
    Fields: Other

    0/0 review
    An Android app typically consists of more than one activity that need to pass data between each other. For example a primary activity with a list of elements and a corresponding secondary activity to show the details of these elements

  • Optimize Your Java Code with Android Butter Knife

    View: 525    Download: 0   Comment: 0   Author: none  

    Optimize Your Java Code with Android Butter Knife

    Category: Android
    Fields: Other

    1.5/3 review
    Creating code can sometimes be frustrating. Developers have to deal with redundant coding that is visually unattractive.

  • How to Use React Native to a Create a Face Recognition App

    View: 487    Download: 0   Comment: 0   Author: none  

    How to Use React Native to a Create a Face Recognition App

    Category: Android
    Fields: Other

    2.25/2 review
    nce you have signed up for an account, login and click on the search icon at the top of the screen and search for ‘cognitive services’. From the dropdown that shows, click on Cognitive Services accounts (preview) and you should see the following...

  • How to Authenticating Users via OAuth with Cordova and Ionic

    View: 246    Download: 0   Comment: 0   Author: none  

    How to Authenticating Users via OAuth with Cordova and Ionic

    Category: Android
    Fields: Other

    0/0 review
    You will need to install Cordova (I recommend SitePoint’s QuickTip) and the Ionic framework (again, I recommend SitePoint’s QuickTip)

  • Make Access Platform APIs with React Native Modules

    View: 22107    Download: 0   Comment: 0   Author: none  

    Make Access Platform APIs with React Native Modules

    Category: Android
    Fields: Other

    4.5/1 review
    SitePoint has a full guide for installing React Native available here. Once it’s installed, create a new project with the following command

  • Build Animating an Android Floating Action Button

    View: 484    Download: 0   Comment: 0   Author: none  

    Build Animating an Android Floating Action Button

    Category: Android
    Fields: Other

    4.5/1 review
    The Floating Action Button looks something like this in a layout file and will be auto generated if create an Android Studio project with a Blank Activity:

 
Newsletter Email

File suggestion for you

File top downloads

logo codetitle
Codetitle.com - library source code to share, download the file to the community
Copyright © 2015. All rights reserved. codetitle.com Develope by Vinagon .Ltd