How can I make an image field open my phones camera

Hi

How can we do so that an image field can trigger/give the option to use the phones camera to take a new image and not only giving us the option to select already taken images from the phones storage.

Usecase:
We currently use “File fields” because of this, but file sizes for images cannot be deleted using a file field, since we cannot resize on upload for a file field.

I’m pretty sure that on mobile, an image field will ask the user if they want to take a photo or add one from their camera roll as standard.

Hi

Nope, this is the my phone screen after hitting the “image field”

I can choose between “images” and “Albums” on my phone.

The three dot menu does not provide any option either

And this is my options for the file field, where i clearly can choose the camera:
I’m on a samsung galaxy s24 currently, but previous phones had the same issue.

I think this dates back to as early as 2019, where I first had the need, and choose to use the file field insted

@Simon7 - I’m using an iPhone 13 and have a very different experience. As you’ll see from the below, I can launch the camera or add a photo from the camera roll using an image field. :camera_with_flash:

You may notice that my image file field button is slightly different as it uses some code to provide a drop zone.

I have also checked on my Samsung Galaxy A9 tablet and have similar options. :man_shrugging:

iPhone 13

Samsung Galaxy A9 tablet

Optimising File Uploads for Knack with a Custom Drop Zone

Hi,

So I tried with the default “Internet” app on my phone and there it do show me the camera option. So it seems to be a chrome issue.

What browser did you use on your tablet?

Google Chrome on both iPhone and Samsung Galaxy Tab. :+1:

Hmm,

guess this takes some investigation.

Thanks for the testing

1 Like

We fooled around with some Javascript and the results are very browser dependent as the “capture” attribute for input elements isn’t standardised.

This will force the camera to open directly but without a dialog allowing the user to select a previously taken photo in Edge and Chrome mobile browsers:

$('input#field_XXX_upload').attr('capture','user');

See HTML attribute: capture - HTML: HyperText Markup Language | MDN and How to Use the <input> Element to Access a Mobile Device's Camera

Hi there we have this problem. Our technicians need to take photos of their work. On all of our phones, it opens the camera… Until recently… I bought a pixel 9 pro and it won’t do it. I have looked and I think I’m arriving at a handset security decision by the manufacturer. Very frustrating

I will add I’ve tried edge, chrome, and brave… They all respond identically.

Yes I’m seeing the same here. On Samsung S24 … spinner spins for 30 seconds or so then shows the pick a photo screen. Clearly something is blocking camera access from chrome. Edge does the same.

But i don’t think it’s a permissions thing. I’ve taken away permissions to camera from Chrome and Edge, and I’m not seeing the usual popup asking me to give permission that I would expect to see. Something broken recently in Knack?

I just tried a few random websites that use the phone camera, and on those I do see the permissions request and then it opens the camera without a problem.

My 2c worth: It’s a Knack specific thing … I think Knack may have broken the function. Maybe log a call with the help desk…