Software Archive
Read-only legacy content
17061 Discussions

takepicture method

carmine_n_
Beginner
2,272 Views

i am using the takepicture method but when i display the pic it is huge.

how do you control the size of it when you display it?

thanks.

 

0 Kudos
13 Replies
Anusha_M_Intel1
Employee
2,272 Views

The only way I can think of resizing the image is by using inline CSS rules. But it looks like you are using the deprecated Intel XDK APIs. We strongly encourage our users to switch to their Cordova counterparts because the Intel XDK ones are no longer maintained. Check out the cordova camera plugin instead - https://github.com/apache/cordova-plugin-camera. We also use this plugin in our Image Capture sample that ships with the XDK. 

0 Kudos
carmine_n_
Beginner
2,272 Views

i will try it.

thanks.

 

0 Kudos
carmine_n_
Beginner
2,272 Views

any idea why i am getting a camera is not defined error?

thanks...

 

/*cordova plugin add cordova-plugin-camera*/

 /* button  Camera */

     
   navigator.camera.getPicture(onSuccess, onFail, { quality: 50,
    destinationType: Camera.DestinationType.FILE_URI });

     
function onSuccess(imageURI) {
    var image = document.getElementById('myImage');
    image.src = imageURI;
}

function onFail(message) {
    alert('Failed because: ' + message);
}

      document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
    console.log(navigator.camera);
}
     

 

 

 

 

0 Kudos
John_H_Intel2
Employee
2,272 Views

Did you select the camera plugin in the project settings?

Do you have a javascript error somewhere in your code?

0 Kudos
carmine_n_
Beginner
2,272 Views

i do not see the camera plugin.

i started with the tabview template.

the error is 'camera' is not defined.

do i need to start over?

thanks.

 

0 Kudos
Anusha_M_Intel1
Employee
2,272 Views

@Carmine,

The tabview template is not a cordova template. It is Standard HTML 5. Read this to know the difference - https://software.intel.com/en-us/xdk/docs/using-the-projects-tab#projtypes

It looks like you need a Cordova app. Follow the link above and you will see how you can upgrade your existing HTML5 app to Cordova from the Project tab. Just click on the little Cordova icon next to Upgrade and it will convert it for you. You will then see that you project type has become 'HTML5+Cordova' and it now has a 'Plugin Management' section. Expand it and add plugins. Camera plugin is listed second in the core plugins list. 

0 Kudos
carmine_n_
Beginner
2,272 Views

Thanks.

I did all of that and I can get the camera to take the picture, but it won't display.

I don't see where to specify a location to display the pic.

Am I missing something or is it a bug with my samsung s4 mini?

Thanks again.

 

0 Kudos
Amrita_C_Intel
Employee
2,272 Views

Hello Carmine,

This might help.

Take a photo and retrieve the image's file location:

navigator.camera.getPicture(onSuccess, onFail, { quality: 50,
    destinationType: Camera.DestinationType.FILE_URI });

function onSuccess(imageURI) {
    var image = document.getElementById('myImage');
    image.src = imageURI;
}

function onFail(message) {
    alert('Failed because: ' + message);
}
0 Kudos
carmine_n_
Beginner
2,272 Views

i tried that and when i click the camera button, the camera opens up, i take the pic, hit save, and it just goes back to the screen with the camera button. the pic is gone.

any ideas?

thanks again.

 

0 Kudos
Amrita_C_Intel
Employee
2,272 Views

Adding on that you need to specify html tag for myImage and set to height and width 100% so it will solve the sizing problem too.

For example:

<img src="myImage" height="100" width="100">

0 Kudos
carmine_n_
Beginner
2,272 Views

getting closer, but it still won't display.

pic is attached.

thanks.

 

0 Kudos
carmine_n_
Beginner
2,272 Views

i just noticed a 'camera is not defined' error.

pic is attached.

thanks.

 

0 Kudos
PaulF_IntelCorp
Employee
2,272 Views

Why don't you try the sample we've got, first: https://github.com/gomobile/sample-image-capture it's in the "samples and demos" section of the "start a new project" from the Projects tab

0 Kudos
Reply