Use PhoneGap to crop and compress images and upload them (Android version)

After installing the camera plugin of phonegap, you can crop or compress the image from the picture library, but the plugin itself has some problems and has been improved, and can now complete the above functions smoothly.

Installation Method

1 First install the camera plugin using the command line:

PhoneGap Plugin Add Org.apache.cordova.camera

2 After the installation is successful, download the following Cameralauncher.java file to replace the file with the same name in the plug-in package:

Http://phonegap.jiusem.net/camera/src/android/CameraLauncher.java

How to use

1 crop the picture. The following code demonstrates the complete process of cropping a picture to 100*100 and uploading it to the server, note the highlighted section:

$ (function () {$ (' #b1 '). Click (function () {navigator.camera.getPicture (Imgdata) {$ (' #pInfo '). HTML (imgdata) ;//$ (' #img '). attr (' src ', imgdata); var options = new Fileuploadoptions (); options.filekey= "file"; Options.filename= " Test.jpg "; options.mimetype=" Image/jpeg "; var ft = new Filetransfer (); Ft.upload (Imgdata, encodeURI (" http://... Test.php "), Win, fail, options), function () {}, {quality:50,    DestinationType:Camera.DestinationType.FILE_URL, c2/>sourcetype:0,

        //==== Key Settings =======================================    allowedit:true,//Crop box    targetwidth:100,//picture crop height    targetheight:100}); /Picture Clipping height

====== key Settings =========================================});//upload successful callback var win = function (r) {             Console.log (r);} Upload failed callback var = function (Error) {    alert ("Upload failed");});

2 compress the picture. The following code shows the process of limiting the size of a picture to 768*1280 and uploading, and the last picture is not necessarily 768*1280, but the width height does not exceed the set value, please note the highlighted part:

$ (function () {$ (' #b1 '). Click (function () {navigator.camera.getPicture (Imgdata) {$ (' #pInfo '). HTML (imgdata) ;//$ (' #img '). attr (' src ', imgdata); var options = new Fileuploadoptions (); options.filekey= "file"; Options.filename= " Test.jpg "; options.mimetype=" Image/jpeg "; var ft = new Filetransfer (); Ft.upload (Imgdata, encodeURI (" http://... Test.php "), Win, fail, options), function () {}, {      quality:50,    destinationType:Camera.DestinationType.FILE_ URL,    sourcetype:0,    //===== key section =========================================    targetwidth:768,//Picture output width    targetheight:1280//Image Output height

====== key part ==========================================}); /upload Successful callback var win = function (r) {           Console.log (r);} Upload failed callback var = function (Error) {    alert ("Upload failed");});

The above example contains file upload, if you need to test the complete example, you also need to install the file transfer plug-in, the document upload server code and normal form upload no difference.

Welcome to communicate with me, any questions or suggestions for improvement please leave a message or add me qq:291445576 (explanation) ~

Use PhoneGap to crop and compress images and upload them (Android version)