Ionic Photo Camera App

Ionic Photo Camera App

Ionic Camera Image Capture App using Cordova

$0.00

Neven

Neven

Member since 2015

Details

Version:
1.0
Ionic:
1.x  
Platforms:
iOS, Android  
Released:
5 years ago
Updated:
1 year ago
Category:
Starters
Tags:
,

Description

Ionic Camera Image Capture App using Cordova

A simple barebone ionic camera application for iOS and Android that takes photos or loads them from the library and displays them on a canvas. You can then rotate the images and share them via the share sheet or upload them to your server. On iOS save image is supported from the share sheet. For android you will have to add separate button to save images. The Image is drawn onto a canvas for easy image manipulation.

The app does not shrink images so if you load large images the rotation is not as fast. You can use Caman JS library for adding image filters but you will have to scale down images to something more reasonable for performance reasons. Instagram photo filters are fast because they scale down the images a lot when you take them.

Check out my other useful starters are here: Great Ionic Starters.

Features

  • Take Photos with Camera
  • Load Images from the Photo Library
  • Rotate Images left and right
  • Share Images via Share Sheet
  • Save Images to Photo Gallery
  • Reading image metadata with EXIF library

    if you don't need to read image metadata you can remove this line:EXIF.getData(image, function() { console.log("in exif " + JSON.stringify(this)) });

Read the ionic installation guide first:

Run in your project terminal:

  • Unzip and go to the project folder
  • Install Ionic sudo npm install -g ionic
  • ionic platform add ios
  • ionic platform add android
  • cordova plugin add cordova-plugin-camera
  • cordova plugin add https://github.com/devgeeks/Canvas2ImagePlugin.git
  • cordova plugin add cordova-plugin-console (for debugging)
  • cordova plugin add https://github.com/EddyVerbruggen/SocialSharing-PhoneGap-Plugin.git
  • ionic emulate ios
  • ionic run android (use run if you use genymotion)
  • the app will ask you to allow camera operations

Save Images on Android

  • Social Share Sheet on android does not include save so you have to do it separately
  • Install Canvas2Image cordova plugin add https://github.com/devgeeks/Canvas2ImagePlugin.git
  • The following code does the image saving on android

    if ( ionic.Platform.isAndroid() ) { window.canvas2ImagePlugin.saveImageDataToLibrary( function(msg){ alert("Photo Saved!"); }, function(err){ alert(err); }, 'myCanvas' ); }

Support

  • Leave a comment if you get stuck on anything
  • And Kudos if you leave a rating! =)

Payment Information

  • The payment on this site is processed by Stripe.com and sometimes your bank will decline the charges if they don't recognize it. You can contact your bank or try a different card.

Stay in Touch

  • Visit my blog [rubberchickin.com](http: ubberchickin.com)

App Icon by: Vintage vector designed by Freepik