Skip to content

Latest commit

 

History

History
116 lines (83 loc) · 3.28 KB

README.md

File metadata and controls

116 lines (83 loc) · 3.28 KB
Raw

Cordova CameraPreview Plugin

Cordova plugin that allows camera interaction from HTML code.
Show camera preview popup on top of the HTML.

Features:

  • Start a camera preview from HTML code.
  • Drag the preview box.
  • Set camera color effect (Android and iOS).
  • Send the preview box to back of the HTML content.
  • Set a custom position for the camera preview box.
  • Set a custom size for the preview box.
  • Maintain HTML interactivity.

Installation:

cordova plugin add https://github.com/mbppower/CordovaCameraPreview.git

Phonegap Build:

<gap:plugin name="com.mbppower.camerapreview" version="0.0.8" source="plugins.cordova.io" />

Methods:

startCamera(rect, defaultCamera, tapEnabled, dragEnabled, toBack)
Starts the camera preview instance.

When setting the toBack to TRUE, remember to add the style bellow on your app's HTML body element:

style="background-color='transparent'"

Javascript:

var tapEnabled = true; //enable tap take picture
var dragEnabled = true; //enable preview box drag across the screen
var toBack = true; //send preview box to the back of the webview
var rect = {x: 100, y: 100, width: 200, height:200};
cordova.plugins.camerapreview.startCamera(rect, "front", tapEnabled, dragEnabled, toBack)

stopCamera()
Stops the camera preview instance.

cordova.plugins.camerapreview.stopCamera();

takePicture(size)
Take the picture, the parameter size is optional

cordova.plugins.camerapreview.takePicture({maxWidth:640, maxHeight:640});

setOnPictureTakenHandler(callback)
Register a callback function that receives the original picture and the image captured from the preview box.

cordova.plugins.camerapreview.setOnPictureTakenHandler(function(result){
	document.getElementById('originalPicture').src = result[0];//originalPicturePath;
	document.getElementById('previewPicture').src = result[1];//previewPicturePath;
});

switchCamera()
Switch from the rear camera and front camera, if available.

cordova.plugins.camerapreview.switchCamera();

show()
Show the camera preview box.

cordova.plugins.camerapreview.show();

hide()
Hide the camera preview box.

cordova.plugins.camerapreview.hide();

Base64 image:
Use the cordova-file in order to read the picture file and them get the base64.
Please, refer to this documentation: http://docs.phonegap.com/en/edge/cordova_file_file.md.html
Method readAsDataURL: Read file and return data as a base64-encoded data URL.

Sample:
Please see the CordovaCameraPreviewApp for a complete working example for Android and iOS platforms.

Android Screenshots: