Capture and play square video and photos in Codename One

Question

Normally the format of videos and photos is not squared... but how can I make it square both in capture and playback (with Codename One)?

About capturing, can CameraKit cn1lib offer help in this regard? Any other option?

Thank you for your suggestions.

Answer 1

After a few months from my question, I addressed this problem calmly. I am writing here an answer that may be useful both for taking a look at the current situation and for other people who have the same question.

First of all, the only option for Codename One to start from is undoubtedly CameraKit, unless you want to write another cn1lib all over again... But you have to distinguish between previewing the camera, capturing the photo or video, viewing the photo or video.

In the following considerations I'll only explore Android and iOS: in this case I'm not interested in the Simulator and Javascript port, as they are not relevant to the app I'm developing. The fact that in the simulator I don't even see the preview of the camera could be a problem related to the fact that I develop inside a virtual machine.

Focus on build hint

Please note that CameraKit uses android.buildToolsVersion=28, which is a lower level of Android API than the one currently used by Codename One and required by Google (which is 29). For the moment I've left this issue pending, I haven't yet verified the correct functioning with API 29.

Camera preview

The current official version of CameraKit (https://github.com/codenameone/CameraKitCodenameOne) is already good enough to get a square preview of the camera on iOS: the important thing is to place the peerComponent inside a Container whose preferred size is forcibly squared, via the override of calcPreferredSize. Different story on Android: in this case the Java code of the native interface has to be modified in order to get a square preview like on iOS. In short, CameraKit uses GoldenEye and the answer to get a preview of the camera of arbitrary (not necessarily square) dimensions can be found here: https://github.com/infinum/Android-GoldenEye/issues/47. For this purpose, I created my own CameraKit fork that allows you to specify the dimensions for the video: https://github.com/jsfan3/CameraKitCodenameOne. If you want to see quickly the differences between the official CameraKit version and my fork you have to look here: https://github.com/codenameone/CameraKitCodenameOne/compare/master...jsfan3:master I didn't send a Pull Request for the simple reason that my customizations only concern my use case, I'm not even sure that all the changes I made are strictly necessary, moreover to send a correct Pull Request I should also consider the Javascript Port and the Simulator.

Capture of photos and videos

Android acquires the photos at the same size as the camera preview, i.e. square in this case. iOS acquires the photos at the camera's real maximum resolution, i.e. in rectangular format. The videos are captured in rectangular format on both Android and iOS. It follows that, in general, although the camera preview is square, I don't know about the captured photos and videos.

Viewing photos and videos

To view photos and videos in square format by virtually cropping them (but without modifying the files, as especially cropping a video would involve serious complexity and very long execution times), the basic solution is to use a custom Layout (which I called AutoFitVideoLayout). The basic code I wrote some time ago is here: https://stackoverflow.com/a/49852530. Although that code was designed by me for videos, I saw that it also works with photographs. It works, but you have to customize it according to your app. You should also pay attention to logging and note if there are any differences between Android and iOS.

Future improvements

Rarely my CameraKit fork causes a crash on Android: I still haven't understood why, anyway it's a rare problem (I don't know if it's a pre-existing problem or related to my customizations). You should also check the API 29 support, as written at the beginning. I also have trouble with the audio of videos on iOS recorded with CameraKit: I assume, however, that this problem has nothing to do with my customizations. CameraKit documentation should also be improved and all features should be checked again: e.g., the flash setting (on, off, automatic) doesn't seem to work on either Android or iOS.

Answer 2

Camera kit doesn't have that capability as dimensions are fixed. However, you might be able to enhance it to support that assuming the underlying API supports it as well.

Playback of square videos should work fine although I haven't tested that myself. You can check it with a pre-existing square video.