Ionic 5|4 Geolocation, Native Geocoder Example Pincode Application to get Coordinates and Address

In this Ionic 5 tutorial, we’ll discuss how to add Geolocation functionality to get current location in the form of coordinates like latitude, longitude and accuracy of the device. Also, we’ll add the Geocoder plugin in the application to convert coordinates into a readable physical address.

Fetching location of a device plays a great role in a number of real-world applications around us. In one or the other task, we may need coordinates, for example, to deliver some items, book a cab, check the weather at the current location etc.

Hybrid Application we can easily access native features of a device using Cordova plugin and Native wrappers for Ionic Framework. We’ll create an example Ionic 5 application and implement Geolocation service to get Lattitude, Longitude, Accuracy of location, Speed, Altitude etc of the device. After we have Latitude and Longitude, these can be used to get Addresses available on these coordinates. To fetch address from coordinates of the device, we use Geocoder service.

Read more

Ionic 3 Geolocation and Geocoder Example – Device Latitude, Longitude and Address

UPDATED(26/03/19) for latest CLI 4.12.0

In this post, we will implement Geolocation and Geocoder plugins in Ionic 3 application. Using Geolocation service we can get Lattitude, Longitude, Accuracy of location, Speed, Altitude etc of the device. After that Latitude and Longitude can be used to get Addresses available on these coordinates. To fetch address from coordinates of the device, we use Geocoder service.

Read more

Use Native Device Camera in Ionic 3 Application

In this tutorial, we will create an Ionic 3 application to demonstrate the usage of Native Camera feature with the help of Cordova and Ionic Native Plugins wrappers.

Check: Ionic 4 Camera Tutorial Example

Read more

Ionic 5|4 Add Barcode/ QR Code Scanner/ Encoder Generator using Native Plugin

In this tutorial, we will implement a Barcode or QR Scanner / Encoder plugin in an Ionic application. Barcodes and QR codes are widely used for multiple purposes like to add a link where a user doesn’t need to type the whole URL it can be easily scanned from a QR code. Barcodes can also be seen everywhere on the day to day items like eatables clothes etc, we can wimple scan these barcodes to get information like item code date of manufacturing, prices, etc.

Read more

Ionic 3 AdMob Plus Tutorial – Update of AdMob Free

AdMob Plus is a Cordova plugin to use Google AdMob in hybrid applications like Ionic. AdMob Plus is developed by same developer Ratson who previously developed and maintained AdMob Free plugin. Ratson wanted to create an AdMob plugin with no ad sharing, as most of the plugin do, they take a part of the revenue from developer earning when they cross a certain threshold. But Ratson was interested to develop an open source project where a developer can use AdMob without any risk of revenue sharing.

Read more

Ionic 3 Swipeable/ Draggable Tabs Pages Application in Ionic 3

Like we see in popular applications like Instagram, we usually have different views which can be easily swiped or dragged right to left to change the view. Today we will implement same user interface having swipeable pages instead of tradition Tap to Change scenario.

Read more

Ionic 3 Resolve! Failed to install ‘cordova-plugin-admob-free’: Error: Variable(s) missing: ADMOB_APP_ID

Here we will discuss an issue faced during the platform build of Ionic 3 application, having an AdMob Free plugin. You can see that error below, this issue comes when we don’t add AdMob app id in an application using AdMob Free Ionic 3 native Plugin.

Read more

Ionic 3 Torch /Flashlight Tutorial – Using Backlight Plugin Ionic Native 3.x

In this post, we will create Flashlight/ Torch app in Ionic 3 version using Ionic Native plugin Flashlight, the application will have a switch button to on/ off camera flashlight which can be used as a torch.

Read more

Ionic 5 Pull/ Swipe Down to Refresh on Ionic Page Tutorial with Example Application

In this Ionic 5/4 tutorial, we’ll discuss pull or swipe down the page to refresh functionality in Ionic Angular application using the UI components available in the Ionic framework.

As seen in many Android native applications like chrome browser we usually have a user-friendly feature to pull down the page to refresh. A user just pulls or simply drag the page down to some limit then release, this acts like a an event handler to trigger some methods using which we can refresh the data on the page. Pull to refresh feature eliminates any need to tap or click somewhere.

This is a must-have feature in modern applications as most of the user tries to pull down the page to refresh something.. I personally do on some apps which even don’t provide such a feature 🙂

In the Ionic framework, we can easily implement the page refresher functionally by adding the combination of ion-refresher and ion-refresher-content components.

Let’s implement and discuss all configuration by building a real example application

Read more

Ionic 3 Resolve “Execution failed for task ‘:app:processDebugResources’.”

During development Ionic 3 project when I added Ionic Native File Opener plugin I faced the following issue during building android apk

Read more

Ionic 3 Adding Bug and Crash Reporting System Crashlytics in Ionic Native 3.X

Firebase Crashlytics service is widely used these days by many developers, it helps in reporting crash, bug, and error reporting in your dashboard. This helps a lot to know the reasons behind application crashes and improving user experiences. Firebase Crashlytics is now only used in Native applications, In this tutorial, we will implement to Cordova plugin in Ionic 3 application providing close enough automation in Crash reporting.

Read more

How to Get Fabric API Key and Fabric Api Secret?

Fabric.io is a platform that provides many services for building better apps, to grow performance and look into the insight of user and business behavior.

The most useful feature provided by Fabric.io is Crashlytics, this is an error reporting tool which immediately reports issues in an application like warning, error or fatal crashes in an application. It really helps in making applications bug free more smooth for better user experience. You can read more about services and feature on their official site.

Read more

Ionic 3 Image Viewer Example – Load Assets Folder Images

In this post, we will discuss on how to show local images in application asset’s images folder in Image / Photo viewer having basic functionalities like Pan, Zoom, Share download image on device etc.

Read more

Ionic 3 Copy to Clipboard Plugin ( Copy and Paste ) Ionic Native 3.x Version

Clipboard is referred to a special memory space provided in the device, specialized to keep last copied data like text, images, files etc. Clipboard is a temporary space which is washed out as user copies new data and replaces existing data.

In this tutorial we will implement Clipboard or Copy Paste plugin in Ionic 3 application, using which developer can provide a handy operation to a user for easy copy and paste features on some event like button click as sometimes it takes much time to select text and paste it somewhere by deleting existing and long tap to paste.

Read more

Ionic 4/5 – Add App Rating ( Rate Us 5 Stars ) Popup in Ionic 5 Application

To get more rating or feedback from users of your application, we can show a model or popup to a user to rate your application on play or app store. Feedback for users helps to make your application better.  More rating and good feedback help an application to rank better in app stores.

Here we will implement Rate Us 5 Stars prompt in an Ionic 3 sample application.

Read more