如何在Jetpack Compose中实现点击切换相机预览的开启与关闭

要实现点击预览框开启/关闭相机预览，你可以借助Compose的状态驱动特性，结合CameraX的生命周期绑定机制来完成，具体实现如下：

核心思路 #

通过一个布尔状态变量控制相机预览的启用状态，当状态变化时，动态绑定或解绑CameraX的预览用例；同时给预览视图添加点击事件来切换这个状态。

完整代码实现 #

@Composable
fun CameraPreviewScreen(lifecycleOwner: LifecycleOwner) {
    // 状态变量：控制相机预览是否开启，默认开启
    val isCameraPreviewEnabled = remember { mutableStateOf(true) }
    // 提前获取CameraProviderFuture，避免重复创建
    val cameraProviderFuture = remember { ProcessCameraProvider.getInstance(LocalContext.current) }

    AndroidView(
        factory = { context ->
            val previewView = PreviewView(context).apply {
                // 给预览视图添加点击事件，切换状态
                setOnClickListener {
                    isCameraPreviewEnabled.value = !isCameraPreviewEnabled.value
                }
            }
            // 创建CameraX所需的核心用例
            val preview = Preview.Builder().build()
            val selector = CameraSelector.Builder()
                .requireLensFacing(CameraSelector.LENS_FACING_BACK)
                .build()
            val imageAnalysis = ImageAnalysis.Builder()
                .setBackpressureStrategy(ImageAnalysis.STRATEGY_KEEP_ONLY_LATEST)
                .build()
            // 这里可以补充你的ImageAnalysis分析逻辑
            imageAnalysis.setAnalyzer(ContextCompat.getMainExecutor(context)) { imageProxy ->
                // 处理图像分析
                imageProxy.close()
            }

            // 将这些用例和PreviewView关联，方便后续update时使用
            previewView.tag = Triple(preview, selector, imageAnalysis)
            previewView
        },
        update = { previewView ->
            val (preview, selector, imageAnalysis) = previewView.tag as Triple<Preview, CameraSelector, ImageAnalysis>
            preview.setSurfaceProvider(previewView.surfaceProvider)
            
            try {
                val cameraProvider = cameraProviderFuture.get()
                // 根据状态绑定或解绑相机
                if (isCameraPreviewEnabled.value) {
                    cameraProvider.bindToLifecycle(
                        lifecycleOwner,
                        selector,
                        preview,
                        imageAnalysis
                    )
                } else {
                    cameraProvider.unbindAll()
                }
            } catch (e: Exception) {
                e.printStackTrace()
            }
        },
        modifier = Modifier.weight(1f)
    )
}

关键说明 #

• 状态控制：使用mutableStateOf创建isCameraPreviewEnabled，状态变化会触发Compose重组，进而执行update块的逻辑。
• 点击事件：在factory中给PreviewView设置点击监听器，直接切换状态变量的值。
• 动态绑定/解绑：update块会在状态变化时执行，这里根据状态判断是绑定相机用例到生命周期，还是解绑所有用例（关闭预览）。
• 用例复用：通过previewView.tag保存CameraX的核心用例实例，避免每次重组都重新创建，提升性能。

内容的提问来源于stack exchange，提问作者srituts