Create flashlight application in ionic 2
flashlight
application
ionic2
- By Code solution
- Jan 20th, 2021
- 0 comments
- 1
Ionic Free & Open Source and Fully Cross-Platform Framework.ionic provide the native plugin for access mobile feature like camera, network, location, file etc.
Today we are creating the flash light application using ionic 2 frameworks .ionic 2 provide to enhance the capabilities of your app by utilizing the features of your phone. Eg. Camera, Flashlight, Geolocation etc.
See demo: https://www.youtube.com/watch?v=lWsbk0VbmVE
To start with, create a project run this command:
ionic start flashlight2 blank
then move into the newly created directory:
cd flashlight2
Now we need to add the plugin and install ionic-native. This could be done by giving the 2 commands below.
ionic cordova plugin add cordova-plugin-flashlight npm install --save @ionic-native/flashligh
Open up home.html in Pages -> home directory and add the below code between the ion-content tags.
<h2>Flashlight is {{isOn ? 'On': 'Off'}}</h2><button ion-button block primary (click)="toggleFlash()">{{isOn ? 'On': 'Off'}} flash</button>
Open home.ts and add the code:
import { Component } from '@angular/core'; import { NavController } from 'ionic-angular'; import { Flashlight } from '@ionic-native/flashlight'; @Component({ selector: 'page-home', templateUrl: 'home.html' }) export class HomePage { isOn: boolean = false; constructor(public navCtrl: NavController, public flashlight: Flashlight) { } async isAvailable():Promise{ try{ return await this.flashlight.available(); }catch(e){ console.log(e); } } async toggleFlash():Promise{ try{ let available = await this.isAvailable(); if(available){ await this.flashlight.toggle(); this.isOn = !this.isOn; }else{ alert("Flash not available..."); } }catch(e){ console.log(e); } } }
then open app.module.ts and add the code:
import { Flashlight } from '@ionic-native/flashlight'; providers: [ StatusBar, SplashScreen, Flashlight, {provide: ErrorHandler, useClass: IonicErrorHandler} ]
Flashlight application code is done you add platform in your application code platform add command:
ionic cordova platform add android/ios/windows
Build and Run command
ionic cordova build android/ios/windows ionic cordova run android/ios/windows
Github Link: https://github.com/Sudarshan101/flashlight2
thank you