{"id":267240,"date":"2024-12-21T16:57:38","date_gmt":"2024-12-21T16:57:38","guid":{"rendered":"https:\/\/michigandigitalnews.com\/index.php\/2024\/12\/21\/whats-new-in-camerax-1-4-0-and-a-sneak-peek-of-jetpack-compose-support\/"},"modified":"2025-06-25T17:09:57","modified_gmt":"2025-06-25T17:09:57","slug":"whats-new-in-camerax-1-4-0-and-a-sneak-peek-of-jetpack-compose-support","status":"publish","type":"post","link":"https:\/\/michigandigitalnews.com\/index.php\/2024\/12\/21\/whats-new-in-camerax-1-4-0-and-a-sneak-peek-of-jetpack-compose-support\/","title":{"rendered":"What’s new in CameraX 1.4.0 and a sneak peek of Jetpack Compose support"},"content":{"rendered":"

[ad_1]
\n<\/p>\n

\n
\n<\/p>\n

Posted by Scott Nien \u2013 Software Engineer (scottnien@)<\/em><\/p>\n

Get ready to level up your Android camera apps! CameraX 1.4.0 just dropped with a load of awesome new features and improvements. We’re talking expanded HDR capabilities, preview stabilization and the versatile effect framework, and a whole lot of cool stuff to explore. We will also explore how to seamlessly integrate CameraX with Jetpack Compose! Let’s dive in and see how these enhancements can take your camera app to the next level.<\/p>\n

HDR preview and Ultra HDR<\/span><\/h2>\n

<\/p>\n

\"A<\/div>\n

<\/image><\/p>\n

High Dynamic Range (HDR) is a game-changer for photography, capturing a wider range of light and detail to create stunningly realistic images. With CameraX 1.3.0, we brought you HDR video recording capabilities, and now in 1.4.0, we’re taking it even further! Get ready for HDR Preview<\/b> and Ultra HDR<\/b>. These exciting additions empower you to deliver an even richer visual experience to your users.<\/p>\n

HDR Preview<\/span><\/h3>\n

This new feature allows you to enable HDR on Preview without needing to bind a VideoCapture use case. This is especially useful for apps that use a single preview stream for both showing preview on display and video recording with an OpenGL pipeline.<\/p>\n

To fully enable the HDR, you need to ensure your OpenGL pipeline is capable of processing the specific dynamic range format and then check the camera capability.<\/p>\n

See following code snippet as an example to enable HLG10 which is the baseline HDR standard that device makers must support on cameras with 10-bit output.<\/p>\n

\n
\/\/ Declare your OpenGL pipeline supported dynamic range format. <\/span>\nval<\/span> openGLPipelineSupportedDynamicRange = setOf(\n     DynamicRange.SDR, \n     DynamicRange.HLG_10_BIT\n)\n\/\/ Check camera dynamic range capabilities. <\/span>\nval<\/span> isHlg10Supported =  \n     cameraProvider.getCameraInfo(cameraSelector)\n           .querySupportedDynamicRanges(openGLPipelineSupportedDynamicRange)\n           .contains(DynamicRange.HLG_10_BIT)\n\nval<\/span> preview = Preview.Builder().apply {\n     if<\/span> (isHlg10Supported) {\n        setDynamicRange(DynamicRange.HLG_10_BIT)\n     }\n}\n<\/pre>\n<\/div>\n
Ultra HDR<\/span><\/h3>\n
Introducing Ultra HDR, a new format in Android 14 that lets users capture stunningly realistic photos with incredible dynamic range. And the best part? CameraX 1.4.0 makes it incredibly easy to add Ultra HDR capture to your app with just a few lines of code:<\/p>\n
\n
val<\/span> cameraSelector = CameraSelector.DEFAULT_BACK_CAMERA\nval<\/span> cameraInfo = cameraProvider.getCameraInfo(cameraSelector)\nval<\/span> isUltraHdrSupported = \n      ImageCapture.getImageCaptureCapabilities(cameraInfo)\n                  .supportedOutputFormats\n                  .contains(ImageCapture.OUTPUT_FORMAT_JPEG_ULTRA_HDR)\n\nval<\/span> imageCapture = ImageCapture.Builder().apply {\n    if<\/span> (isUltraHdrSupported) {\n        setOutputFormat(ImageCapture.OUTPUT_FORMAT_JPEG_ULTRA_HDR)\n    }\n}.build()\n<\/pre>\n<\/div>\n
Jetpack Compose support<\/span><\/h3>\n
While this post focuses on 1.4.0, we’re excited to announce the Jetpack Compose support in CameraX 1.5.0 alpha. We\u2019re adding support for a Composable Viewfinder built on top of AndroidExternalSurface<\/a><\/span> and AndroidEmbeddedExternalSurface<\/a><\/span>. The CameraXViewfinder<\/a><\/span> Composable hooks up a display surface to a CameraX Preview use case, handling the complexities of rotation, scaling and Surface lifecycle so you don\u2019t need to.<\/p>\n
<\/p>\n
\n
\/\/ in build.gradle <\/span>\nimplementation (\"androidx.camera:camera-compose:1.5.0-alpha03\"<\/span>)\n\n\nclass<\/span> PreviewViewModel<\/span> : ViewModel() {\n    private<\/span> val<\/span> _surfaceRequests = MutableStateFlow(null<\/span>)\n\n    val<\/span> surfaceRequests: StateFlow\n        get<\/span>() = _surfaceRequests.asStateFlow()\n\n    private<\/span> fun<\/span> produceSurfaceRequests<\/span>(previewUseCase: Preview) {\n        \/\/ Always publish new SurfaceRequests from Preview<\/span>\n        previewUseCase.setSurfaceProvider { newSurfaceRequest ->\n            _surfaceRequests.value = newSurfaceRequest\n        }\n    }\n\n    \/\/ ...<\/span>\n}\n\n@Composable\nfun<\/span> MyCameraViewfinder<\/span>(\n    viewModel: PreviewViewModel,\n    modifier: Modifier = Modifier\n) {\n    val<\/span> currentSurfaceRequest: SurfaceRequest? by\n        viewModel.surfaceRequests.collectAsState()\n\n    currentSurfaceRequest?.let { surfaceRequest ->\n        CameraXViewfinder(\n            surfaceRequest = surfaceRequest,\n            implementationMode = ImplementationMode.EXTERNAL, \/\/ Or EMBEDDED<\/span>\n            modifier = modifier        \n        )\n    }\n}\n<\/surfacerequest><\/surfacerequest><\/pre>\n<\/div>\n
Kotlin-friendly APIs<\/span><\/h3>\n
CameraX is getting even more Kotlin-friendly! In 1.4.0, we’ve introduced two new suspend functions to streamline camera initialization and image capture.<\/p>\n
\n
\/\/ CameraX initialization <\/span>\nval<\/span> cameraProvider = ProcessCameraProvider.awaitInstance()\n\nval<\/span> imageProxy = imageCapture.takePicture() \n\/\/ Processing imageProxy<\/span>\nimageProxy.close()\n<\/pre>\n<\/div>\n
Preview Stabilization and Mirror mode<\/span><\/h2>\n
Preview Stabilization<\/span><\/h3>\n
Preview stabilization mode<\/a> was added in Android 13 to enable the stabilization on all non-RAW streams, including previews and MediaCodec input surfaces. Compared to the previous video stabilization mode<\/a>, which may have inconsistent FoV (Field of View) between the preview and recorded video, this new preview stabilization mode ensures consistency and thus provides a better user experience.  For apps that record the preview directly for video recording, this mode is also the only way to enable stabilization.<\/p>\n
Follow the code below to enable preview stabilization. Please note that once preview stabilization is turned on, it is not only applied to the Preview but also to the VideoCapture if it is bound as well.<\/p>\n
\n
val<\/span> isPreviewStabilizationSupported =  \n    Preview.getPreviewCapabilities(cameraProvider.getCameraInfo(cameraSelector))\n        .isStabilizationSupported\nval<\/span> preview = Preview.Builder().apply {\n    if<\/span> (isPreviewStabilizationSupported) {\n      setPreviewStabilizationEnabled(true<\/span>)\n    }\n}.build()\n<\/pre>\n<\/div>\n
MirrorMode<\/span><\/h3>\n
While CameraX 1.3.0 introduced mirror mode for VideoCapture,  we’ve now brought this handy feature to Preview in 1.4.0. This is especially useful for devices with outer displays, allowing you to create a more natural selfie experience when using the rear camera.<\/p>\n
To enable the mirror mode, simply call Preview.Builder.setMirrorMode<\/a><\/span> APIs. This feature is supported for Android 13 and above.<\/p>\n
Real-time Effect<\/span><\/h2>\n
CameraX 1.3.0 introduced the CameraEffect framework, giving you the power to customize your camera output with OpenGL. Now, in 1.4.0, we’re taking it a step further.  In addition to applying your own custom effects, you can now leverage a set of pre-built effects provided by CameraX and Media3, making it easier than ever to enhance your app’s camera features.<\/p>\n
Overlay Effect<\/span><\/h3>\n
The new camera-effects artifact aims to provide ready-to-use effect implementations, starting with the OverlayEffect. This effect lets you draw overlays on top of camera frames using the familiar Canvas API<\/a>.<\/p>\n
The following sample code shows how to detect the QR code and draw the shape of the QR code once it is detected.<\/p>\n
By default, drawing is performed in surface frame coordinates. But what if you need to use camera sensor coordinates? No problem! OverlayEffect<\/span> provides the Frame#getSensorToBufferTransform<\/a><\/span> function, allowing you to apply the necessary transformation matrix to your overlayCanvas.<\/p>\n
In this example, we use CameraX’s MLKit Vision APIs (MlKitAnalyzer<\/span>) and specify COORDINATE_SYSTEM_SENSOR<\/span> to obtain QR code corner points in sensor coordinates. This ensures accurate overlay placement regardless of device orientation or screen aspect ratio.<\/p>\n
<\/p>\n
\n
\/\/ in build.gradle <\/span>\nimplementation (\"androidx.camera:camera-effects:1.4.1}\"<\/span>)      \nimplementation (\"androidx.camera:camera-mlkit-vision:1.4.1\"<\/span>)\n\nvar<\/span> qrcodePoints: Array? = null<\/span>\nvar<\/span> qrcodeTimestamp = 0L<\/span>\nval<\/span> qrcodeBoxEffect \n    = OverlayEffect(\n        PREVIEW \/* applied on the preview only *\/<\/span>,\n        5<\/span>, \/* hold multiple frames in the queue so we can match analysis result <\/span>\n              with preview frame *\/<\/span>, \n        Handler(Looper.getMainLooper()), {}\n      )\n\nfun<\/span> initCamera<\/span>() {\n    qrcodeBoxEffect.setOnDrawListener { frame ->\n        if<\/span>(frame.timestamp != qrcodeTimestamp) {\n            \/\/ Do not change the drawing if the frame doesn\u2019t match the analysis <\/span>\n            \/\/ result.<\/span>\n            return<\/span>@setOnDrawListener true<\/span>\n        }\n        frame.overlayCanvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR)\n        qrcodePoints?.let {\n            \/\/ Using sensor coordinates to draw.<\/span>\n            frame.overlayCanvas.setMatrix(frame.sensorToBufferTransform)\n            val<\/span> path = android.graphics.Path().apply {\n                it.forEachIndexed { index, point ->\n                    if<\/span> (index == 0<\/span>) {\n                        moveTo(point.x.toFloat(), point.y.toFloat())\n                    } else<\/span> {\n                        lineTo(point.x.toFloat(), point.y.toFloat())\n                    }\n                 }\n                 lineTo(it[0<\/span>].x.toFloat(), it[0<\/span>].y.toFloat())\n            }\n            frame.overlayCanvas.drawPath(path, paint)\n        }\n        true<\/span>\n    }\n\n    val<\/span> imageAnalysis = ImageAnalysis.Builder()\n        .build()\n        .apply {\n            setAnalyzer(executor,\n                MlKitAnalyzer(\n                    listOf(barcodeScanner!!),\n                    COORDINATE_SYSTEM_SENSOR,\n                    executor\n                ) { result ->\n                    val<\/span> barcodes = result.getValue(barcodeScanner!!)\n                    qrcodePoints = \n                        barcodes?.takeIf { it.size > 0<\/span>}?.get<\/span>(0<\/span>)?.cornerPoints\n                    \/\/ track the timestamp of the analysis result and release the <\/span>\n                    \/\/ preview frame.<\/span>\n                    qrcodeTimestamp = result.timestamp\n                    qrcodeBoxEffect.drawFrameAsync(qrcodeTimestamp)\n                }\n            )\n        }\n\n    val<\/span> useCaseGroup = UseCaseGroup.Builder()\n          .addUseCase(preview)\n          .addUseCase(imageAnalysis)\n          .addEffect(qrcodeBoxEffect)\n          .build()\n\n    cameraProvider.bindToLifecycle(\n        lifecycleOwner, cameraSelector, usecaseGroup)\n  }\n<\/point><\/pre>\n<\/div>\n
Here is what the effect looks like:<\/p>\n
<\/p>\n
\"A<\/div>\n
<\/image><\/p>\n
Screen Flash<\/span><\/h2>\n
Taking selfies in low light just got easier with CameraX 1.4.0! This release introduces a powerful new feature: screen flash.  Instead of relying on a traditional LED flash which most selfie cameras don\u2019t have, screen flash cleverly utilizes your phone’s display. By momentarily turning the screen bright white, it provides a burst of illumination that helps capture clear and vibrant selfies even in challenging lighting conditions.<\/p>\n
Integrating screen flash into your CameraX app is flexible and straightforward. You have two main options:<\/p>\n