鸿蒙开发教学-图片的引用
image通过调用接口来创建，接口调用形式如下：
image(src: string | resource | media.pixelmap)image(src: string | resource | media.pixelmap)image(src: string | resource | media.pixelmap)
该接口通过图片数据源获取图片，支持本地图片和网络图片的渲染展示。其中，src是图片的数据源。
加载图片资源image支持加载存档图（重点）、多媒体像素图（了解即可）两种类型。
存档图类型数据源 存档图类型的数据源可以分为本地资源、网络资源、resource资源、媒体库资源和base64。
本地资源创建文件夹，将本地图片放入ets文件夹下的任意位置。 image组件引入本地图片路径，即可显示图片（根目录为ets文件夹）。
image('images/view.jpg').width(200).width(200).width(200)
网络资源引入网络图片需申请权限ohos.permission.internet，具体申请方式请参考权限申请声明。此时，image组件的src参数为网络图片的链接。
image('https://www.example.com/example.jpg') // 实际使用时请替换为真实地址image('https://www.example.com/example.jpg') // 实际使用时请替换为真实地址image('https://www.example.com/example.jpg') // 实际使用时请替换为真实地址
resource资源使用资源格式可以跨包/跨模块引入图片，resources文件夹下的图片都可以通过$r资源接口读取到并转换到resource格式。
调用方式：
image($r('app.media.icon'))image($r('app.media.icon'))image($r('app.media.icon'))
还可以将图片放在rawfile文件夹下。
还可以将图片放在rawfile文件夹下。
调用方式：
image($rawfile('snap'))image($rawfile('snap'))image($rawfile('snap'))
媒体库file://data/storage 支持file://路径前缀的字符串，用于访问通过媒体库提供的图片路径。 a. 调用接口获取图库的照片url。import picker from '@ohos.file.picker';@entry@componentstruct index { @state imgdatas: string[] = []; // 获取照片url集 getallimg() { let result = new array(); try { let photoselectoptions = new picker.photoselectoptions(); photoselectoptions.mimetype = picker.photoviewmimetypes.image_type; photoselectoptions.maxselectnumber = 5; let photopicker = new picker.photoviewpicker(); photopicker.select(photoselectoptions).then((photoselectresult) = > { this.imgdatas = photoselectresult.photouris; console.info('photoviewpicker.select successfully, photoselectresult uri: ' + json.stringify(photoselectresult)); }).catch((err) = > { console.error(`photoviewpicker.select failed with. code: ${err.code}, message: ${err.message}`); }); } catch (err) { console.error(`photoviewpicker failed with. code: ${err.code}, message: ${err.message}`); } } // abouttoappear中调用上述函数，获取图库的所有图片url，存在imgdatas中 async abouttoappear() { this.getallimg(); } // 使用imgdatas的url加载图片。 build() { column() { grid() { foreach(this.imgdatas, item = > { griditem() { image(item) .width(200) } }, item = > json.stringify(item)) } }.width('100%').height('100%') }}}}
b. 从媒体库获取的url格式通常如下。
image('file://media/photos/5').width(200).width(200).width(200)
3D打印镜片未来或用于提升数据传输速度 具有不同折射率
测距传感器应用在车床生产中的好处有哪些
什么是橄榄石型LiFePO4?
车辆连接的未来
Aledia公司完成了D轮第一阶段融资
鸿蒙开发教学-图片的引用
霍尼韦尔航空航天集团成功完成了波音757测试飞机的飞行测试
PowerVR光线追踪混合渲染效果
用于可穿戴健康设备的新一代产品如何使系统更可靠、更节能
华为实现世界首例5G远程手术
瘦肉精快速检测仪 解决方案
特斯拉线圈作用是什么
PCBA为什么要做检测
IC解密之单片机算术运算指令
2019年最值得关注的几个人形机器人
人工智能企业要着什么改变
直击微信公开课2019：微信支付“不止支付”
详解无锡市半导体行业是如何崛起的
如今的“无线”生活哪有快感可言
线缆测试仪在电动车组电气线路导通测试中的应用
image(src: string | resource | media.pixelmap)image(src: string | resource | media.pixelmap)image(src: string | resource | media.pixelmap)
该接口通过图片数据源获取图片，支持本地图片和网络图片的渲染展示。其中，src是图片的数据源。
加载图片资源image支持加载存档图（重点）、多媒体像素图（了解即可）两种类型。
存档图类型数据源 存档图类型的数据源可以分为本地资源、网络资源、resource资源、媒体库资源和base64。
本地资源创建文件夹，将本地图片放入ets文件夹下的任意位置。 image组件引入本地图片路径，即可显示图片（根目录为ets文件夹）。
image('images/view.jpg').width(200).width(200).width(200)
网络资源引入网络图片需申请权限ohos.permission.internet，具体申请方式请参考权限申请声明。此时，image组件的src参数为网络图片的链接。
image('https://www.example.com/example.jpg') // 实际使用时请替换为真实地址image('https://www.example.com/example.jpg') // 实际使用时请替换为真实地址image('https://www.example.com/example.jpg') // 实际使用时请替换为真实地址
resource资源使用资源格式可以跨包/跨模块引入图片，resources文件夹下的图片都可以通过$r资源接口读取到并转换到resource格式。
调用方式：
image($r('app.media.icon'))image($r('app.media.icon'))image($r('app.media.icon'))
还可以将图片放在rawfile文件夹下。
还可以将图片放在rawfile文件夹下。
调用方式：
image($rawfile('snap'))image($rawfile('snap'))image($rawfile('snap'))
媒体库file://data/storage 支持file://路径前缀的字符串，用于访问通过媒体库提供的图片路径。 a. 调用接口获取图库的照片url。import picker from '@ohos.file.picker';@entry@componentstruct index { @state imgdatas: string[] = []; // 获取照片url集 getallimg() { let result = new array(); try { let photoselectoptions = new picker.photoselectoptions(); photoselectoptions.mimetype = picker.photoviewmimetypes.image_type; photoselectoptions.maxselectnumber = 5; let photopicker = new picker.photoviewpicker(); photopicker.select(photoselectoptions).then((photoselectresult) = > { this.imgdatas = photoselectresult.photouris; console.info('photoviewpicker.select successfully, photoselectresult uri: ' + json.stringify(photoselectresult)); }).catch((err) = > { console.error(`photoviewpicker.select failed with. code: ${err.code}, message: ${err.message}`); }); } catch (err) { console.error(`photoviewpicker failed with. code: ${err.code}, message: ${err.message}`); } } // abouttoappear中调用上述函数，获取图库的所有图片url，存在imgdatas中 async abouttoappear() { this.getallimg(); } // 使用imgdatas的url加载图片。 build() { column() { grid() { foreach(this.imgdatas, item = > { griditem() { image(item) .width(200) } }, item = > json.stringify(item)) } }.width('100%').height('100%') }}}}
b. 从媒体库获取的url格式通常如下。
image('file://media/photos/5').width(200).width(200).width(200)
3D打印镜片未来或用于提升数据传输速度 具有不同折射率
测距传感器应用在车床生产中的好处有哪些
什么是橄榄石型LiFePO4?
车辆连接的未来
Aledia公司完成了D轮第一阶段融资
鸿蒙开发教学-图片的引用
霍尼韦尔航空航天集团成功完成了波音757测试飞机的飞行测试
PowerVR光线追踪混合渲染效果
用于可穿戴健康设备的新一代产品如何使系统更可靠、更节能
华为实现世界首例5G远程手术
瘦肉精快速检测仪 解决方案
特斯拉线圈作用是什么
PCBA为什么要做检测
IC解密之单片机算术运算指令
2019年最值得关注的几个人形机器人
人工智能企业要着什么改变
直击微信公开课2019：微信支付“不止支付”
详解无锡市半导体行业是如何崛起的
如今的“无线”生活哪有快感可言
线缆测试仪在电动车组电气线路导通测试中的应用