Ionic Action Sheet

This Article I’m going to explain, How to create ActionSheet using Ionic Framework. Goal: Create a button When user pressed button, open action sheet with 2 option Option 1: Access Camera Option 2: Access Gallery Display Output in console STEPS Create New Ionic 2 Project ionic start ActionSheet blank Create a button with click functionality …

Access camera using Ionic

This example, I’m gonna explain how to access camera using Ionic 2 with Ionic Native Goal Take Picture via Camera & Display on the page DOWNLOAD SOURCE CODE Steps Create New Ionic Project ionic start TakePhoto Add Required Platform ionic platform add android ionic platform add ios Add cordova Camera Plugin (https://github.com/apache/cordova-plugin-camera) ionic plugin add …

Date Picker Example using Ionic

This article, I’m going to create Ionic date picker example using typescript. Our Goal: Display Current Date time inside <ion-datetime></ion-datetime> Tag Open DatePicker for choose other date & change date STEPS Create new ionic blank project ionic start DatePicker blank create DateTime tag src/home.html with two-way(ngModel) binding <ion-content padding> <ion-datetime displayFormat=”DD-MM-YYYY HH:mm” [(ngModel)]=”today”></ion-datetime> </ion-content> Define today …

Multiple image picker using Ionic

In this article, we’ll learn how to use multiple image picker using ionic. We are going to use https://github.com/wymsee/cordova-imagePicker / https://github.com/Telerik-Verified-Plugins/ImagePicker for picking up images from your android & ios photo gallery. It contains following steps Step 1: Create new ionic project & Change your working directory ionic start imagePicker blank cd imagePicker Step 2: Add required …

Ionic AccountKit Integration

Ionic AccountKit Integration: This article, we’re going to learn “How to authenticate user using SMS / Phone Number by Facebook AccountKit” Requirements: Facebook Developer Account Ionic Setup Create Client Token on Developer’s Account Login with https://developers.facebook.com Working with Ionic Project Create new project ionic start accountkit blank Adding Platform ionic cordova platform add android ionic …

Cordova Plugin InAppBrowser

Apache Cordova / Phonegap InAppBrowser is used for Loading Child Browser in your application (which cannot access cordova api like camera, contacts ..etc) for loading third party (untrusted) content. This provide some default UI controls such as back, forward, done. Installing InAppBrowser Plugin To use Apache Cordova / Phonegap InAppBrowser we need to add a plugin. …

Upload Images using PhoneGap & PHP

This article, I’m going to explain How to Upload Images to the server using PhoneGap File Transfer Plugin. Requirements PHP based Web Server (you can use local web servers) Cordova Camera Plugin (cordova-plugin-camera) Cordova File Transfer Plugin (cordova-plugin-filetransfer) Steps Writing Simple PHP code for receiving files from Mobile App Camera Plugin is used for accessing …

Accessing user location using Ionic Geolocation

Ionic Geolocation: In this tutorial, I’m going to teach you, “How to access user’s location by using Ionic Native (cordova-plugin-geolocation)” & Display locations on UI Technology used: Ionic 3 Ionic Native Geolocation (cordova-plugin-geolocation) Step 1: Create New Ionic project ionic start GeoDemo blank Step 2: Add plugin ionic cordova plugin add cordova-plugin-geolocation –variable GEOLOCATION_USAGE_DESCRIPTION=”To locate you” …

Parse JSON using Cordova (PhoneGap)

Let’s learn about how to parse JSON data using phonegap (cordova). We’re going to read json data using jquery so we can use getJSON or Ajax method. To get sample json data, i’m gonna read JSON data from https://reqres.in !! Important !!: Please download jquery and use it local to improve performance https://code.jquery.com/jquery-3.3.1.min.js create new project cordova create cordovajson …

PhoneGap Login with PHP & MySQL

Phonegap login system (cordova login) using php & mysql: In this tutorial, we’re going to build simple login system using phonegap with php and mysql backend. Creating database for storing user data ( mysql ) Creating Login page for authenticate existing user Creating Signup page for add new user account Database design for phonegap login system First …