compose中实现拍照和选取相册功能兼容android 13+
效果图
添加引用
//用于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 = {
//权限拒绝的处理
}
)
}