← 返回多图选择器组件参考 · 全部使用指导

多图选择器使用指导

• 多图选择器使用指导
  • 工作原理
  • 快速上手
  • 案例一：发帖选图，显示前三张缩略图
  • 案例二：逐张上传多张图片
  • 案例三：选一张图做头像
  • 案例四：处理取消与出错
  • 只选某种格式
  • 常见问题
  • 平台说明
  • 完整 .aia 源码与操作指导
    • 相册单选与多选
  • 第一次测试

多图选择器打开系统相册，让用户选一张或多张图片。和按钮形态的「图像选择器」相比： 它是不可见组件，可以由任何按钮、图片触发；支持一次选多张，还能限制最多选几张。

工作原理

• 调用单选图片（SinglePick）或多选图片（最大数量）（MultiplePick）打开系统选择器， 用户选完触发单选完成时（路径）（AfterSinglePick）或多选完成时（路径列表）（AfterMultiplePick）；
• 选中的图片会复制到本 App 的目录再返回路径，可直接给图像组件显示、交给 Web 上传或图片处理；
• 使用系统自带的选择器，不需要存储权限；
• 用户取消时触发取消选择时（操作）（PickerCancelled），打开失败或保存失败时触发出现错误时（操作，消息）（ErrorOccurred）。

图片保留规则（重要）：这个目录只保留最近选的 10 张（一次多选超过 10 张时保留这一批）， 更早选过的图片会被自动删掉。需要长期保存的图片，请用图片处理处理一下 （结果另存到它自己的目录）或用文件增强复制到别处。

快速上手

when 按钮_选图.Click() {
  多图选择器1.MultiplePick(9)
}

when 多图选择器1.AfterMultiplePick(路径列表) {
  标签1.Text = join("选中 ", length(路径列表), " 张")
  图像1.Picture = select(路径列表, 1)
}

案例一：发帖选图，显示前三张缩略图

最多选 9 张，界面上用三个图像组件预览前三张，其余显示「+N」：

global 已选 = []

when 按钮_加图.Click() {
  多图选择器1.MultiplePick(9)
}

when 多图选择器1.AfterMultiplePick(路径列表) {
  已选 = 路径列表
  图像_1.Picture = select(已选, 1)
  if length(已选) >= 2 {
    图像_2.Picture = select(已选, 2)
  }
  if length(已选) >= 3 {
    图像_3.Picture = select(已选, 3)
  }
  if length(已选) > 3 {
    标签_更多.Text = join("+", length(已选) - 3)
  } else {
    标签_更多.Text = ""
  }
}

案例二：逐张上传多张图片

Web 组件一次只能发一个请求：上传完一张（收到响应）再传下一张，每张先压缩：

global 待传 = []
global 序号 = 0

when 多图选择器1.AfterMultiplePick(路径列表) {
  待传 = 路径列表
  序号 = 1
  上传当前()
}

procedure 上传当前() {
  标签_状态.Text = join("正在上传第 ", 序号, " / ", length(待传), " 张")
  Web1.Url = "https://example.com/upload"
  Web1.PostFile(图片处理1.Compress(select(待传, 序号), 1080, 80))
}

when Web1.GotText(URL网址, 响应代码, 响应类型, 响应内容) {
  if 序号 < length(待传) {
    序号 = 序号 + 1
    上传当前()
  } else {
    标签_状态.Text = "全部上传完成"
  }
}

案例三：选一张图做头像

单选后裁成圆形头像，并记住它的路径（处理后的图片不受上面的保留规则影响）：

when 图像_头像.Click() {
  多图选择器1.SinglePick()
}

when 多图选择器1.AfterSinglePick(路径) {
  图像_头像.Picture = 图片处理1.Resize(图片处理1.CropCircle(路径), 300, 300)
  微数据库1.StoreValue("头像", 图像_头像.Picture)
}

when Screen1.Initialize() {
  图像_头像.Picture = 微数据库1.GetValue("头像", "")
}

案例四：处理取消与出错

when 多图选择器1.PickerCancelled(操作) {
  标签_状态.Text = "没有选择图片"
}

when 多图选择器1.ErrorOccurred(操作, 消息) {
  标签_状态.Text = join("选图失败：", 消息)
}

只选某种格式

MIME过滤（MimeFilter）默认 image/*（所有图片）。只要 PNG 就填 image/png， 只要 JPEG 填 image/jpeg。单选和多选都使用这个过滤条件。

常见问题

平台说明

• 安卓：支持；
• 鸿蒙：使用系统图库选择器（不需要相册权限），单选、多选、取消与出错事件和安卓一致；「图片类型」填 video/* 时选视频，/ 时图片视频都可选。

完整 .aia 源码与操作指导

下载 .aia 源码

相册头像和发帖多选的完整交互：MIME过滤、数量校验、真实路径预览、逐张翻页，以及取消和失败反馈。系统相册需已有照片，本案例不上传数据。

导入 MultiImagePickerAllFeatures.aia，连接最新伴侣，或编译独立安装包。真机／伴侣运行尚未实测。

所有返回值均用于界面反馈，错误由底部错误区展示。设计器采用明确非默认配置，初始化与界面同步。API 覆盖检查按最终 AIA 检查方法、事件、属性读取与设置及设计器配置，不能替代真实设备验证。

相册单选与多选

导入方法：项目 → 导入项目（.aia）→ 选择下载的 .aia 源码文件。 相册头像和发帖多选的完整交互：MIME过滤、数量校验、真实路径预览、逐张翻页，以及取消和失败反馈。系统相册需已有照片，本案例不上传数据。 覆盖检查 9/9。首次载入及保存重开均0个错误，真实后台导入、安装包编译通过；真机／伴侣／硬件联调尚未实测。全部属性读写、方法与事件的操作入口和预期结果见组件指导。

第一次测试

先在手机系统相册拍一张照片或存入JPEG／PNG图片，确认系统相册能看到。伴侣连接后点击“选择一张头像”，在系统界面选择照片；多选完成用前一张、后一张查看每个真实路径对应图片。切换类型后要点击应用过滤。

选图文件位于应用目录，组件只保留最近10张（单批超过10张时保留该批）。本页清空只清空变量，不删除文件；长期使用应另存，不把老路径永久当成有效资源。部分系统界面不支持数量上限，组件截取前面的图片。错误事件只能由真实失败触发，取消使用正常系统返回键验证。