1# 图片显示 2 3### 介绍 4 5本示例展示从相册选择图片展示在商品评价页面。 6 7本示例使用 [TextArea](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-basic-components-textarea.md) 组件实现多文本输入，使用 [@ohos.file.photoAccessHelper](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-media-library-kit/js-apis-photoAccessHelper.md) 实现图片的获取，选择。 8 9### 效果预览 10|主页| 打开相册 | 选中图片 | 发表评价 | 11|--------------------------------|--------------------------------------------|----------------------------------------|--------------------------------------| 12| |  |  |  | 13 14使用说明： 15 161.点击添加图片/照片，页面跳转到图片选择页面。 17 182.进入图片选择页面后，选择需要显示的图片，选择的图片数量会显示在右上方，选择的图片会显示在下方。最多选择6张图片。 19 203.选定图片后点击下一步，页面会跳转回主页面，图片显示在主页。若不确定选择，点击添加图片/照片进行重新选择。 21 224.图片选择后，点击文本输入框，可以对商品进行评价。 23 245.点击返回按钮，退出应用。 25 26### 工程目录 27``` 28entry/src/main/ets/ 29|---Application 30| |---MyAbilityStage.ts 31|---MainAbility 32| |---MainAbility.ts 33|---pages 34| |---Index.ets // 首页 35| |---ChoicePhoto.ets // 添加图片/照片 36``` 37 38### 具体实现 39 40* 本示例分为三个模块： 41 * 发表评价页面模块： 42 * 使用scroll，TextArea，Grid等组件开发发表评价页面 43 * 源码链接：[Index.ets](entry/src/main/ets/pages/Index.ets) 44 * 参考接口：[@ohos.router](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/js-apis-router.md) 45 46 * 选择图片/照片模块 47 * 调用依赖中ChoicePhotos方法打开相册，mediaquery媒体查询相册，getMediaLibrary获取媒体库的实例，访问用户等个人媒体数据信息并选中图片 48 * 源码链接：[ChoicePhotos.ets](imagelibrary/src/main/ets/components/pages/ChoicePhotos.ets)，[MainAbility.ts](entry/src/main/ets/MainAbility/MainAbility.ts) 49 * 参考接口：[@ohos.router](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/js-apis-router.md)，[@ohos.promptAction](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/js-apis-promptAction.md)，[@ohos.mediaquery](https://docs.openharmony.cn/pages/v4.1/zh-cn/application-dev/reference/apis-arkui/js-apis-mediaquery.md)，[@ohos.file.photoAccessHelper](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-media-library-kit/js-apis-photoAccessHelper.md)，[@ohos.abilityAccessCtrl](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-ability-kit/js-apis-abilityAccessCtrl.md) 50 51 * 提交模块 52 * 选中图片后点击下一步按钮，回到发表评价页面，点击提交按钮进行提交 53 * 源码链接：[Index.ets](entry/src/main/ets/pages/Index.ets) 54 * 参考接口：[@ohos.router](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/js-apis-router.md) 55 56### 相关权限 57 58允许应用读取用户外部存储中的媒体文件信息：[ohos.permission.READ_MEDIA](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/security/AccessToken/permissions-for-all.md#ohospermissionread_media) 59 60允许应用读写用户外部存储中的媒体文件信息：[ohos.permission.WRITE_MEDIA](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/security/AccessToken/permissions-for-all.md#ohospermissionwrite_media) 61 62允许应用访问用户媒体文件中的地理位置信息：[ohos.permission.MEDIA_LOCATION](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/security/AccessToken/permissions-for-all.md#ohospermissionmedia_location) 63 64允许读取用户公共目录的图片或视频文件：[ohos.permission.READ_IMAGEVIDEO](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/security/AccessToken/permissions-for-system-apps.md#ohospermissionread_imagevideo) 65 66 67### 依赖 68 69不涉及 70 71### 约束与限制 72 731.本示例仅支持标准系统上运行，支持设备：RK3568。 74 752.本示例为Stage模型，已适配API version 10版本SDK，版本号：4.0Release。 76 773.本示例需要使用DevEco Studio 版本号（4.0Release）及以上版本才可编译运行。 78 79### 下载 80 81如需单独下载本工程，执行如下命令： 82``` 83git init 84git config core.sparsecheckout true 85echo code/BasicFeature/Media/ImageShow/ > .git/info/sparse-checkout 86git remote add origin https://gitee.com/openharmony/applications_app_samples.git 87git pull origin master 88 89```
