Sorry to be new and asking so many questions, I’m slowly getting things done I think…
Camera this time.
I add the camera control and it allows me to choose a file from the storage on my PC or phone if installed.
When installing to the phone, I am not asked any permissions for using the camera, and I’m guessing this is the reason why I can only choose an existing picture and not use the camera for a new one.
Is there an actual detailed step by step tutorial on getting the camera working on both an Android and iOS device that I can study? I can’t find anything at the moment.
Surely I’m not the first person to want to build a native Android in my case, or iOS app that allows the user to take a picture with the camera. The camera example works fine, but it only allows you to choose an existing file, I want the user to be able to take a picture and then show it in a picture box.
I have done a lot more reading, even tried a few other things with the config.xml in project properties but I’m just grasping at straws now.
Thanks for the reply. I’ve tried a couple of things you’ve suggested but I’m obviously missing something.
I’ve added the following line to the config.xml file:
<plugin name=“cordova-plugin-camera” source “npm” version “2.4.1” />
But this results in an error when I try to make a native app with PhoneGap as a manformed config.xml file. Do I have this line correct? Is there anywhere in particular it needs to go in the xml file? I’ve just put in the lower section like this:
As I can’t get it to compile, I’m not sure yet what I’m supposed to be doing with the TakePhoto function you also posted. I take it that I need to ignore the camera icon (since I can’t add code to that control) and create a button or something that will call the TakePhoto() Function when clicked?
Ok, think I’m getting somewhere. That now builds with PhoneGap - first problem solved
When I install the app, it’s still not asking for camera permission, is that normal? My phone is running a rather old version of Android, I know in the newer versions security has become tighter at install time, not runtime, to get camera permission from the user?
Now that I have it at least buidling and installing without problems, what is the story with the TakePhoto function that @mexlum posted. I’ve seen similar to this in the wiki I think.
I’ve created a separate button with this code in the on_click event and it thows an error:
Uncaught TypeError: Cannot read property ‘getPicture’ of undefined. line 57 column 22
Thanks both of you for your help, I feel like I’m at least getting somewhere with this.
I’m still getting nowhere with being able to get a picture directly from the camera, only able to select an existing picture from the phone which is really not what I want to force the user to do.
When I was playing around with Android Studio last month I had a lot of issues resolving the problem, but in the end I think the problem was solved by adding pemission requests to the manifest - is this possibly what I need to do?
Which I’ve now done. When installing the app, I am now told the app wants to access the camera etc. SUCCESS
Now I’m at another problem, I’ve added a button (Button1) which will call the TakePhoto() Function whcih is copied from the same link above…
Function Button1_onclick()
TakePhoto()
End Function
Function TakePhoto()
options={quality : 75, _
destinationType : 1, _
sourceType : 1, _
allowEdit: True}
navigator.camera.getPicture(onPictureReturned, onPictureError, options)
End Function
Function onPictureReturned(ImageURI)
Image1.firstChild.src=ImageURI
End Function
Function onPictureError(message)
MsgBox "Failed because " & message
End Function
This is of course similar to what @mexlum sugggested above.
This throws up an error - Cannot read property ‘getpicture’ of undefined in line 61 coloumn 20
Any ideas?
I’ll keep plugging away and post if I find out what I’m now doing wrong.
I am testing it and running it on both, obviously running in a browser is going to create issues because there is no camera attached - but yeah, I get this error on my phone after making a native Android app with phonegap.
Interestingly - the lines I posted above which are now forcing the app on my phone to ask for camera permissions I actually had in my very first post in this thread, but I had since removed them.
However, adding them back in in conjunction with <plugin name=‘cordova-plugin-camera’ spec=’~4.0.3’ /> is what was needed.
I was googling a bit about not being able to read the property ‘getpicture’ and am wondering if I actually need to install Cordova on my PC along with the Camera library which will then get linked in with my project at compile time? or is this something that phonegap should be taking care of for me?
The camera object is created by the PhoneGap plugin - so it won’t be available on the desktop.
Connect the Chrome Remote Debugger to your app running the PhoneGap apk on your device. You can use the Console tab to see if navigator.camera exists. If not, you need to address that first.
I’ll give that a go. Considering I haven’t installed Cordova and node.js which is a prerequisite for Cordova, is it safe to say that this is why navigator.camera.getPicture() is throwing the error?
Finally got around to hooking up to remote debugging.
This is the error that is reported when I start my app:
Could not find cordova.js script tag. Plugin loading may fail.
And here is the section of code from phonegap.js where it is failing to load if that’s of any help working out what is wrong:
// Tries to load all plugins' js-modules.
// This is an async process, but onDeviceReady is blocked on onPluginsReady.
// onPluginsReady is fired when there are no plugins to load, or they are all done.
exports.load = function(callback) {
var pathPrefix = findCordovaPath();
if (pathPrefix === null) {
console.log('Could not find cordova.js script tag. Plugin loading may fail.');
pathPrefix = '';
}
injectIfNecessary('cordova/plugin_list', pathPrefix + 'cordova_plugins.js', function() {
var moduleList = require("cordova/plugin_list");
handlePluginsObject(pathPrefix, moduleList, callback);
}, callback);
};
EDIT:
So with a little more digging, it seems I am missing this line:
No, that’s not it. Your project needs either phonegap.js or cordova.js (I think they’re the same) and it’s added automatically as part of the build process.
Here is the build log, so looks like I need to change a few things up with Corodova versions in the config.xml and hopefully I should be right. Will report back how it goes, or feel free to post if you can see something obvious:
Build Date: 2018-11-01 23:25:24 +0000
--------------------------------------------------------------------------------
PLUGIN OUTPUT
--------------------------------------------------------------------------------
Fetching plugin "cordova-plugin-camera" via npm
Installing "cordova-plugin-camera" at "4.0.3" for android
Plugin doesn't support this project's cordova-android version. cordova-android: 6.1.2, failed version requirement: >=6.3.0
Skipping 'cordova-plugin-camera' for android
Fetching plugin "cordova-plugin-geolocation" via npm
Installing "cordova-plugin-geolocation" at "4.0.1" for android
Plugin doesn't support this project's cordova-android version. cordova-android: 6.1.2, failed version requirement: >=6.3.0
Skipping 'cordova-plugin-geolocation' for android
Fetching plugin "cordova-plugin-device@2.0.2" via npm
Installing "cordova-plugin-device" at "2.0.2" for android
Fetching plugin "cordova-plugin-splashscreen@5.0.2" via npm
Installing "cordova-plugin-splashscreen" at "5.0.2" for android
Fetching plugin "cordova-plugin-vibration@3.1.0" via npm
Installing "cordova-plugin-vibration" at "3.1.0" for android
Fetching plugin "phonegap-plugin-barcodescanner@5.0.1" via npm
Installing "phonegap-plugin-barcodescanner" at "5.0.1" for android
Fetching plugin "cordova-plugin-compat@^1.0.0" via npm
Installing "cordova-plugin-compat" at "1.2.0" for android
Subproject Path: CordovaLib
Fetching plugin "cordova-plugin-bluetooth-serial@0.4.7" via npm
Installing "cordova-plugin-bluetooth-serial" at "0.4.7" for android
Fetching plugin "cordova-plugin-insomnia@4.3.0" via npm
Installing "cordova-plugin-insomnia" at "4.3.0" for android
Fetching plugin "cordova-plugin-flashlight@3.2.0" via npm
Installing "cordova-plugin-flashlight" at "3.2.0" for android
Plugin dependency "cordova-plugin-compat@1.2.0" already fetched, using that version.
Dependent plugin "cordova-plugin-compat" already installed on android.
Fetching plugin "cordova-plugin-statusbar" via npm
Installing "cordova-plugin-statusbar" at "2.4.2" for android
Fetching plugin "cordova-plugin-whitelist" via npm
Installing "cordova-plugin-whitelist" at "1.3.3" for android
This plugin is only applicable for versions of cordova-android greater than 4.0. If you have a previous platform version, you do *not* need this plugin since the whitelist will be built in.
So I’ve changed my PhoneGap version in my project properties to cli-7.1.0 which according to this page: https://build.phonegap.com/current-support should take me up to Version 6.3.0 for Android Builds.
The built is taking a really long time, and eventually comes up with an error:
error
Error: Source path does not exist: icons/android/ldpi.png
In the PhoneGap Native Build status.
I’ll await some more advice, because I’m really just guessing at solutions for the moment.