App refresh after camera return captured image

ionic-v1
1

Hey guys .I know this question has been asked before here and many times on stackoverflow , But still i am struggling here.
First of all congrats and thanks to ionic team for a wonderful HTML5 framework

Well i am working on an app where i need camera functionality. I have seen many examples and applied them but still my app is getting refreshed when i capture image and click on right button.

This is my code

 .factory('Camera', ['$q', function($q) {
 return {
 getPicture: function(options) {
  var q = $q.defer();

  navigator.camera.getPicture(function(result) {
    // Do any magic you need
    q.resolve(result);
  }, function(err) {
    q.reject(err);
  },  {
  quality:30 ,
  destinationType : Camera.DestinationType.FILE_URI,
  sourceType : Camera.PictureSourceType.CAMERA,
  targetWidth: 320,
  targetHeight: 320,
  saveToPhotoAlbum: false
});

  return q.promise;
 }
 }
}])

and in controller:

$scope.takePicture = function() {
Camera.getPicture().then(function(imageURI) {
  console.log(imageURI);
  $scope.mypicture = imageURI;
}, function(err) {
  console.err(err);
});

From my html i am calling it in as :

 <a class="issue_btn blue" ng-click="takePicture()"><span data-tags="photo" data-pack="default" class="ion-camera"></span></a>

This is all i am doing .

Also i have included following cordova plugins:

 camera
 file
 file-transfer

I am testing it on android 4.4.4
Ram is 1GB. I don’t think memory would be an issue here.

Kindly notify me if i am doing something wrong there or help me with some solution there.

2

A promise only takes 2 functions:
success and error case.

You are trying to pass the camera options to the promise. I think you should pass the options to your getPicture method ;).

Greetz, bengtler

3

I tried your approach too. See my updated code.

Things does not change. My app still gets restarts when camera capture photo and i click on ok.

Take a look.

Cheers.

4

It was not an approach from my side.

But you asked:

And your usage of the promise and your function was wrong.
Did you tried remote debugging?

5

Indeed . You put me on right track. Yes i am trying remote debugging in chrome browser.

Sometime i get camera access and captured image but sometime app again get starts. What can be the issue . Is their some memory allocation issue ? if it is how can i resolve it. Any idea.

6

Jailtas - any luck with this yet? I’m also getting a similar error where my controller is reset when interacting with the camera.

7

No luck till Now. Looking for support :wink:

8

I am using this solution. Sometime it works , sometime app gets restarts

 // take picture
$scope.takePicture = function() {

pictureSource=navigator.camera.PictureSourceType.CAMERA;
destinationType=navigator.camera.DestinationType.FILE_URI;
//console.log("got camera button click");
var options =   {
  quality: 100,
  destinationType: destinationType,
  sourceType: pictureSource,
  encodingType: navigator.camera.EncodingType.JPEG,
  };
if (!navigator.camera)
  {
  // error handling
  return;
  }
navigator.camera.getPicture(
  function (imageURI) {
    alert("got camera success ", imageURI);
    $scope.mypicture = imageURI;
    },
  function (err) {
    alert("got camera error ", err);
    // error handling camera plugin
    },
  options);

};

Take a look if it can help you.

9

My code is very similar to yours. I have two buttons, one allowing interaction with the camera itself, and one allowing a user to select a photo from the photo library. Both of these cause a full app refresh. I added alerts throughout the app to test if the full app was restarting and it appears this is the case. I read before that this can be because of a memory issue where android closes out the background app when opening the camera functions to save memory, but this doesn’t seem to be the case with my app as I am getting this error in the simulator as well as on my android phone.

I have tried using navigator.camera.getPicture directly in the controller, as well as in a factory. Currently I am using the ng-cordova $cordovaCamera. Maybe ng-cordova would help in your case? anyone from the Ionic team want to help out?

10

Finally figured it out on my end. Turns out the anchor tag I was using had a href="*" in it. Changing this to have an empty href as in the following worked for me:

<a href="" ng-click="fetchPhoto()">Select Photo</a>
11

Do not use href attributes in angular apps!

Use ui-sref of ui-router service or only a ng-click.
You do not need the empty href="" on this a-tag.

12

I wonder if you get it? I had that problem and can’t fix it so far. Thank you

13