OpenHarmony 如何选择图片在 Image 组件上显示(eTS)
相信大家都会有这样的一个使用场景,就是将图片选择
那么,我们来看一下如何使用,
导入模块
import mediaLibrary from '@ohos.multimedia.mediaLibrary';
复制代码
mediaLibrary.getMediaLibrary8+
getMediaLibrary(context: Context): MediaLibrary
获取媒体库的实例,用于访问和修改用户等个人媒体数据信息(如音频、视频、图片、文档等)。
系统能力:SystemCapability.Multimedia.MediaLibrary.Core
参数:
startMediaSelect(deprecated)
startMediaSelect(option: MediaSelectOption): Promise<Array<string>>
启动媒体选择界面,以异步方法获取选择的媒体 URI 列表,使用 Promise 形式返回结果。
说明: 从 API Version 9 开始废弃。
系统能力:SystemCapability.Multimedia.MediaLibrary.Core
参数:
返回值:
示例:
let option = {
type : "image",
count : 2
};
mediaLibrary.getMediaLibrary().startMediaSelect(option).then((value) => {
console.log("Media resources selected.");
// Obtain the media selection value.
}).catch((err) => {
console.log("An error occurred when selecting media resources.");
});
复制代码
最后附上完整代码
// @ts-nocheck
/*
* Copyright (c) 2022 JianGuo Device Co., Ltd.
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/**
* @ProjectName : nutsStudy
* @FileName : file
* @Author : 坚果
* @Time : 2022/8/9 15:57
* @Description : 文件描述
*/
import mediaLibrary from '@ohos.multimedia.mediaLibrary';
@Entry
@Component
struct FileSample {
@State imgList: Array<string> = [];
build() {
Column() {
Text("测试").fontSize(80).onClick(() => {
let option = {
type: "image",
count: 2
};
mediaLibrary.getMediaLibrary().startMediaSelect(option, (err, value) => {
if (err) {
console.log("An error occurred when selecting media resources." + err);
return;
}
console.log("图片路径是:" + value);
this.imgList = value;
});
})
ForEach(this.imgList, (item: any, index?: number) => { // 循环数组创建每一个Item
Image(item) // 可以生成一个或多个子组件
.width("20%").height("20%")
})
}.width("100%").height("100%")
}
}
复制代码
参考文档
媒体库管理
Image
评论 (2 条评论)