compose中实现拍照和选取相册功能兼容android 13+

- 效果图
- 添加引用
- 修改AndroidManifest.xml
- 定义拍照和选取相册的ResultContract
- 调用拍照和选择相册的compose方法
- 使用

效果图

在这里插入图片描述

添加引用

//用于compose权限的使用
implementation("com.google.accompanist:accompanist-permissions:0.31.0-alpha")
//闪光
implementation("com.google.accompanist:accompanist-placeholder-material:0.31.0-alpha")
implementation("io.coil-kt:coil-compose:2.2.2")

修改AndroidManifest.xml

添加权限清单和provider

<uses-permission android:name="android.permission.CAMERA" />

    <uses-permission
        android:name="android.permission.READ_EXTERNAL_STORAGE"
        android:maxSdkVersion="31" />

    <uses-permission android:name="android.permission.READ_MEDIA_IMAGES" />

    <uses-feature
        android:name="android.hardware.camera"
        android:required="false" />

 <provider
            android:name="androidx.core.content.FileProvider"
            android:authorities="${applicationId}.image.provider"
            android:exported="false"
            android:grantUriPermissions="true">
            <meta-data
                android:name="android.support.FILE_PROVIDER_PATHS"
                android:resource="@xml/file_provider_paths" />
        </provider>

添加路径文件file_provider_paths.xml:

<?xml version="1.0" encoding="utf-8"?>

<paths>
    <external-path
        name="img_files"
        path="." />
    <cache-path
        name="cache"
        path="." />

</paths>

定义拍照和选取相册的ResultContract

拍照和选取图片的intent在Android上是通用的，后面写的compose组合方法才是compose里面特有的，所以这里也可以拿来放到非compose里面使用。
添加选取图片intent：

class SelectPicture : ActivityResultContract<Unit?, PictureResult>() {

    private var context: Context? = null

    override fun createIntent(context: Context, input: Unit?): Intent {
        this.context = context
        return Intent(Intent.ACTION_PICK).setType("image/*")
    }

    override fun parseResult(resultCode: Int, intent: Intent?): PictureResult {
        return PictureResult(intent?.data, resultCode == Activity.RESULT_OK)
    }
}
//图片结果
class PictureResult(val uri: Uri?, val isSuccess: Boolean)

添加拍照intent：

class TakePhoto : ActivityResultContract<Unit?, PictureResult>() {

    var outUri: Uri? = null
    private var imageName: String? = null

    companion object {
    //定义单例的原因是因为拍照返回的时候页面会重新实例takePhoto，导致拍照的uri始终为空
        val instance get() = Helper.obj
    }

    private object Helper {
        val obj = TakePhoto()
    }

    override fun createIntent(context: Context, input: Unit?): Intent =
        Intent(MediaStore.ACTION_IMAGE_CAPTURE).also { intent ->
            getFileDirectory(context)?.let {
                outUri = it
                intent.putExtra(MediaStore.EXTRA_OUTPUT, it).apply {
                    addFlags(Intent.FLAG_GRANT_READ_URI_PERMISSION)
                    addFlags(Intent.FLAG_GRANT_WRITE_URI_PERMISSION)
                }
            }

        }

    override fun parseResult(resultCode: Int, intent: Intent?): PictureResult {
        return PictureResult(outUri, resultCode == Activity.RESULT_OK)
    }

    private fun getFileDirectory(context: Context): Uri? {//获取app内部文件夹
        imageName = "img_${UUID.randomUUID().toString().substring(0, 7)}"
        val fileFolder = File(context.cacheDir, "test_imgs")
        if (!fileFolder.exists()) {
            fileFolder.mkdirs()
        }
        val file = File(fileFolder, "${imageName}.jpeg")
        if (!file.exists()) {
            file.createNewFile()
        }
        return FileProvider.getUriForFile(context, "${context.packageName}.image.provider", file)
    }
}

调用拍照和选择相册的compose方法

class PhotoComponent {

    private var openGalleryLauncher: ManagedActivityResultLauncher<Unit?, PictureResult>? = null
    private var takePhotoLauncher: ManagedActivityResultLauncher<Unit?, PictureResult>? = null

    private val scope: CoroutineScope = CoroutineScope(SupervisorJob() + Dispatchers.IO)

    companion object {
        val instance get() = Helper.obj
    }

    private object Helper {
        val obj = PhotoComponent()
    }

    //监听拍照权限flow
    private val checkCameraPermission =
        MutableSharedFlow<Boolean?>(replay = 1, onBufferOverflow = BufferOverflow.DROP_OLDEST)

    private fun setCheckCameraPermissionState(value: Boolean?) {
        scope.launch {
            checkCameraPermission.emit(value)
        }
    }

    //相册权限flow
    private val checkGalleryImagePermission =
        MutableSharedFlow<Boolean?>(replay = 1, onBufferOverflow = BufferOverflow.DROP_OLDEST)

    private fun setCheckGalleryPermissionState(value: Boolean?) {
        scope.launch {
            checkGalleryImagePermission.emit(value)
        }
    }

    /**
     * @param galleryCallback 相册结果回调
     * @param graphCallback 拍照结果回调
     * @param permissionRationale 权限拒绝状态回调
     **/
    @OptIn(ExperimentalPermissionsApi::class)
    @Composable
    fun Register(
        galleryCallback: (selectResult: PictureResult) -> Unit,
        graphCallback: (graphResult: PictureResult) -> Unit,
        permissionRationale: ((gallery: Boolean) -> Unit)? = null,
    ) {
        val rememberGraphCallback = rememberUpdatedState(newValue = graphCallback)
        val rememberGalleryCallback = rememberUpdatedState(newValue = galleryCallback)
        openGalleryLauncher = rememberLauncherForActivityResult(contract = SelectPicture()) {
            rememberGalleryCallback.value.invoke(it)
        }
        takePhotoLauncher = rememberLauncherForActivityResult(contract = TakePhoto.instance) {
            rememberGraphCallback.value.invoke(it)
        }
        val readGalleryPermission = if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.TIRAMISU) {
            //13以上的权限申请
            Manifest.permission.READ_MEDIA_IMAGES
        } else {
            Manifest.permission.READ_EXTERNAL_STORAGE
        }
        var permissionCameraState by rememberSaveable { mutableStateOf(false) }
        var permissionGalleryState by rememberSaveable { mutableStateOf(false) }
        val permissionList = arrayListOf(
            Manifest.permission.CAMERA,
            readGalleryPermission,
        )
        val galleryPermissionState = rememberPermissionState(readGalleryPermission)
        val cameraPermissionState = rememberMultiplePermissionsState(permissionList)
        LaunchedEffect(Unit) {
            checkCameraPermission.collectLatest {
                permissionCameraState = it == true
                if (it == true) {
                    if (cameraPermissionState.allPermissionsGranted) {
                        setCheckCameraPermissionState(null)
                        takePhotoLauncher?.launch(null)
                    } else if (cameraPermissionState.shouldShowRationale) {
                        setCheckCameraPermissionState(null)
                        permissionRationale?.invoke(false)
                    } else {
                        cameraPermissionState.launchMultiplePermissionRequest()
                    }
                }
            }
        }
        LaunchedEffect(Unit) {
            checkGalleryImagePermission.collectLatest {
                permissionGalleryState = it == true
                if (it == true) {
                    if (galleryPermissionState.status.isGranted) {
                        setCheckGalleryPermissionState(null)
                        openGalleryLauncher?.launch(null)
                    } else if (galleryPermissionState.status.shouldShowRationale) {
                        setCheckGalleryPermissionState(null)
                        permissionRationale?.invoke(true)
                    } else {
                        galleryPermissionState.launchPermissionRequest()
                    }
                }
            }
        }
        LaunchedEffect(cameraPermissionState.allPermissionsGranted) {
            if (cameraPermissionState.allPermissionsGranted && permissionCameraState) {
                setCheckCameraPermissionState(null)
                takePhotoLauncher?.launch(null)
            }
        }
        LaunchedEffect(galleryPermissionState.status.isGranted) {
            if (galleryPermissionState.status.isGranted && permissionGalleryState) {
                setCheckGalleryPermissionState(null)
                openGalleryLauncher?.launch(null)
            }
        }
    }

    //调用选择图片功能
    fun selectImage() {
        setCheckGalleryPermissionState(true)
    }
    //调用拍照
    fun takePhoto() {
        setCheckCameraPermissionState(true)
    }

}

使用

通过coil加载获取到的图片的Uri路径，也可以通过三方工具util将uri转换成file文件，这里就不做介绍了。implementation 'com.blankj:utilcodex:1.31.1'可以使用这个库的转换功能进行转换。

@Composable
fun MainScreen() {
    val mediaAction by lazy { PhotoComponent.instance }
    var localImgPath by remember{
        mutableStateOf(Uri.EMPTY)
    }
    Surface(modifier = Modifier.fillMaxSize()) {
        Column(horizontalAlignment = Alignment.CenterHorizontally) {
            Spacer(modifier = Modifier.height(24.dp))
            AsyncImage(
                model = localImgPath, contentDescription = null,
            modifier = Modifier
                .width(48.dp)
                .height(48.dp)
                .clip(CircleShape)
                .placeholder(
                    visible = localImgPath == Uri.EMPTY,
                    color = Color(231, 234, 239, 255),
                    highlight = PlaceholderHighlight.shimmer(),
                ),
                contentScale = ContentScale.Crop,
            )

            Spacer(modifier = Modifier.height(24.dp))

            TextButton(onClick = {
                mediaAction.takePhoto()
            },
            ) {
                Text(text = "拍照")
            }
            Spacer(modifier = Modifier.height(24.dp))
            TextButton(onClick = {
                mediaAction.selectImage()
            },
            ) {
                Text(text = "相册")
            }

        }
    }
    mediaAction.Register(
        galleryCallback = {
            "相册内容${it}".printLog()
            if (it.isSuccess) {
                localImgPath = it.uri
            }
        },
        graphCallback = {
            "拍照内容${it.uri}".printLog()
            if (it.isSuccess) {
                localImgPath = it.uri
            }
        },
        permissionRationale = {
            //权限拒绝的处理
        }
    )
}