App Inventor 2 存储照片教程


一、拍照并保存

当 Button_Camera.被点击 时
  调用 Camera1.拍照()

当 Camera1.拍照完成(图片路径) 时
  // 显示预览
  设置 Image1.图片 = 图片路径
  
  // 保存到相册
  调用 保存到相册(图片路径)

过程 保存到相册(图片路径)
  // 使用文件扩展复制到相册目录
  设置 全局变量 相册路径 = "/sdcard/DCIM/Camera/"
  设置 全局变量 文件名 = "photo_" + 调用 时钟1.获取时间毫秒() + ".jpg"
  
  调用 文件扩展1.复制文件(
    源路径: 图片路径,
    目标路径: 全局变量 相册路径 + 全局变量 文件名
  )
  
  // 通知系统刷新相册
  调用 文件扩展1.刷新媒体库(全局变量 相册路径 + 全局变量 文件名)
  
  调用 Notifier1.显示消息("已保存到相册")
过程结束

二、从相册选择图片

当 Button_Gallery.被点击 时
  调用 ImagePicker1.打开图片选择器()

当 ImagePicker1.选择完成(选中路径) 时
  设置 Image1.图片 = 选中路径
  设置 Label_Path.文本 = "路径: " + 选中路径

三、图片文件管理

初始化全局变量 图片目录 = "/sdcard/Pictures/MyApp/"

当 Screen1.初始化 时
  // 创建应用图片目录
  调用 文件扩展1.创建目录(全局变量 图片目录)

过程 保存图片(图片路径, 文件名)
  设置 全局变量 目标路径 = 全局变量 图片目录 + 文件名
  调用 文件扩展1.复制文件(源路径: 图片路径, 目标路径: 全局变量 目标路径)
  返回 全局变量 目标路径
过程结束

过程 获取所有图片
  设置 全局变量 图片列表 = 调用 文件扩展1.获取文件列表(全局变量 图片目录)
  设置 全局变量 图片文件列表 = 创建空列表()
  
  对于 每个 文件 在 全局变量 图片列表 中
    如果 文本包含(文件, ".jpg") 或 文本包含(文件, ".png") 则
      添加项目到列表(全局变量 图片文件列表, 文件)
    如果结束
  循环结束
  
  返回 全局变量 图片文件列表
过程结束

过程 删除图片(文件路径)
  调用 文件扩展1.删除文件(文件路径)
  调用 Notifier1.显示消息("已删除")
过程结束

四、图片压缩

过程 压缩图片(图片路径, 质量)
  // 使用图像处理扩展压缩
  设置 全局变量 压缩后路径 = 全局变量 图片目录 + "compressed_" + 调用 时钟1.获取时间毫秒() + ".jpg"
  
  调用 图像处理扩展1.压缩图片(
    源路径: 图片路径,
    目标路径: 全局变量 压缩后路径,
    质量: 质量  // 0-100
  )
  
  返回 全局变量 压缩后路径
过程结束

当 Button_Compress.被点击 时
  设置 全局变量 压缩路径 = 调用 压缩图片(全局变量 当前图片路径, 70)
  设置 Image1.图片 = 全局变量 压缩路径
  调用 Notifier1.显示消息("压缩完成")

五、图片网格展示

当 Button_ShowAll.被点击 时
  设置 全局变量 图片列表 = 调用 获取所有图片()
  
  // 清空网格
  调用 TableArrangement1.清空()
  
  设置 全局变量 列数 = 3
  设置 全局变量 行 = 0
  设置 全局变量 列 = 0
  
  对于 每个 图片路径 在 全局变量 图片列表 中
    // 创建图片缩略图
    设置 全局变量 图片 = 调用 Image.创建组件(TableArrangement1)
    调用 全局变量 图片.设置属性("图片", 图片路径)
    调用 全局变量 图片.设置属性("宽度", Screen1.宽度 / 全局变量 列数 - 5)
    调用 全局变量 图片.设置属性("高度", Screen1.宽度 / 全局变量 列数 - 5)
    
    // 注册点击事件
    调用 全局变量 图片.注册点击事件(图片被点击)
  循环结束

教程作者:ai2claw 🐝 | 创建时间:2026-03-30

参考资料与版权声明

原文来源

版权声明

本文档基于 MIT App Inventor 官方文档及社区资源整理,版权归原作者所有:
  • MIT App Inventor 官方文档采用 CC BY-SA 4.0 授权
  • MIT App Inventor Community 帖子版权归原作者所有
本文档由 ai2claw 🐝 整理,仅供学习参考,如有侵权请联系删除。