首页 > 其他分享 >Android Compose 使用 照片选择器 Photo Picker

Android Compose 使用 照片选择器 Photo Picker

时间:2024-07-26 18:10:25浏览次数:5  
标签:Picker Compose Photo 照片 activity Android 选择器

从 Android 13(Tiramisu, API 33)开始,官方提供了系统级图片选择器 Photo Picker。而且无需申请权限,只需几行代码即可轻松接入。效果如下图:

image

在不支持 Photo Picker 的低版本机型中,该库会自动调用 ACTION_OPEN_DOCUMENT 打开系统资源管理器进行选择,问题也不大。

官方介绍 and 教程:Photo picker

1. androidx.activity 1.6.0+

首先把 androidx.activity 升级到最新版本:

dependencies {
    implementation 'androidx.activity:activity-compose:1.9.0'
}

如果因为各种原因,不能升级依赖版本,参考该文 浅尝 Android 13 Photo Picker 无惧权限烦恼

2. Compose 使用组件

@Composable
fun  xxxCollectScreen(
    xxxViewModel: xxxViewModel,
    appNavController: NavController,
    modifier: Modifier,
) {
//......
    val pickMultipleMedia = rememberLauncherForActivityResult(
	//设置一个值允许选择照片的,且最多选择5个照片的照片选择器
        ActivityResultContracts.PickMultipleVisualMedia(5)) { uris ->
        if (uris.isNotEmpty()) {
	//逻辑代码,uris是用户选择的媒体文件的Uri( List<Uri> )
	//按照实际场景再处理即可

        }
    }
//......
    Row {
    // begin Photo Picker region
    TextButton(onClick = {
        coroutineScope.launch {
            //只选照片 ActivityResultContracts.PickVisualMedia.ImageOnly
            pickMultipleMedia.launch(PickVisualMediaRequest(ActivityResultContracts.PickVisualMedia.ImageOnly))
        }
    }) {
        Icon(
            Icons.Filled.PhotoLibrary,
            null
        )
        Spacer(Modifier.size(ButtonDefaults.IconSpacing))
        Text("Add photo")
    }
    // end region
}
//......
}

3.各种 Photo Picker介绍

官方介绍 and 教程:Photo picker

标签:Picker,Compose,Photo,照片,activity,Android,选择器
From: https://www.cnblogs.com/kingwz/p/18325967

相关文章

  • Android 将 ViewModel 和 Compose界面的数据 双向绑定
    简介双向绑定说白了就是达到下面的效果:ViewModel能够实时传输从Room数据库查询到的数据到Compose页面。Compose页面能实时传输用户输入的数据到ViewModel类。需要分别在ViewModel和Compose中操作。一、在ViewModel中:1、使用mutableStateOf家族定义一个可变的值(......
  • 颜色选择器react-color
    配合表单使用的颜色选择器:https://www.jianshu.com/p/b7bc59146058,原文reacthooks版本的,我改成的class函数版本的。  1.安装:npminstallreact-color--save  2.封装:colorPicker.js importReact,{FC}from'react';import{SketchPicker}from'react-color'......
  • Jetpack Compose学习(12)——Material Theme的主题色切换
    原文:JetpackCompose学习(12)——MaterialTheme的主题色切换-Stars-One的杂货小窝闲着无事研究了下JetpackComposeM3主题切换效果本系列以往文章请查看此分类链接Jetpackcompose学习如何生成主题首先,我们需要知道的是,M3有提供个在线网站供开发者进行快速生成主题,......
  • 在 Python 中将 Kivy 文件选择器添加到 PopUp
    我一直在尝试通过应用程序的按钮释放创建文件选择器弹出窗口。我分别管理了FileChooser和Popups,但无法将两者一起解决,这里有人可以帮助解决问题吗?我正在尝试用Python而不是Kivy.lang来实现PopUp,因为这是我在弹出窗口方面的经验。我也无法让KivyDoc示例正常工作。我......
  • Docker-compose
    介绍Compose是Docker公司推出的一个工具软件,可以管理多个Docker容器组成一个应用。你需要定义一个YAML格式的配置文件docker-compose.yml,写好多个容器之间的调用关系。然后,只要一个命令,就能同时启动、关闭这些容器。核心组成1、一文件docker-compose.yml2、两要素服......
  • el-select选项自定义日期选择器选项,选中自定义日期,回显具体的日期时间
    需求:指标时点选择具体的时间,即自定义日期选项时,可操作选择具体日期。若选择自定义日期,应回显具体日期,如“2024-07-25”效果图如下:  代码如下:因为此处v-for生成的面板,每个面板都有一个指标时点选项,所以每个指标时点的select对应的ref需要唯一,此处通过遍历的下标i加以区分。......
  • 探索Docker Compose:轻松管理多容器应用的最佳实践 转载
    目录1docker-compose1.6.1简单命令1.6.2build1.6.3depends_on1.6.4deploy1.6.5logging1.6.6network_mode1.6.7secrets1.1compose编排工具简介1.2安装docker-compose1.3编排启动镜像1.4haproxy代理后端docker容器1.5安装soca......
  • 前端必修技能:高手进阶核心知识分享 - CSS 选择器
    前端必修技能:高手进阶核心知识分享-CSS选择器CSS(层叠样式表)提供了多种选择器,用于选择要应用样式的HTML元素。CSS选择器用于选择你想要的元素的样式的模式。看了上面的图,你发现就算你不知道选择器名字叫什么,属于哪一种,但不知不觉的,你其实已经习惯了其中的很多种选择器......
  • docker-compose安装loki
    在Linux上使用Docker安装Loki和Grafana,完成日志采集和分析的步骤如下:步骤1:安装Docker确保你已经安装并配置好Docker。如果还没有,请参考前面的安装步骤。步骤2:安装DockerCompose为了简化Loki和Grafana的安装和配置,建议使用DockerCompose。以下是在Ubuntu......
  • 使用 Python XlsxWriter 将 DatePicker 添加到 Excel 单元格中?
    我正在尝试使用PythonXlsxWriter生成的Excel创建输入表单。我想知道是否可以在Excel单元格中添加一个迷你日历(作为DatePicker)供用户输入日期?我偶然发现了Microsoft支持团队提供的本指南插入日期选择器:|||https://support.microsoft.com/en-us/office/......