学习笔记（十六）：ArkUi-显示图片 (Image)
概述：
Image支持多种图片格式，包括png、jpg、bmp、svg、gif和heif
可支持显示本地图片，网络图片,Resource资源、媒体库资源和base64
一、创建Image
Image(src: PixelMap | ResourceStr | DrawableDescriptor)
1、显示本地资源
创建文件夹，将本地图片放入ets文件夹下的任意位置。
Image组件引入本地图片路径，即可显示图片（根目录为ets文件夹）
如下，自己定义一个文件夹未 icons
2、显示网络资源
3、显示Resource资源
将图片放置media目录下
创建写法：
Image($r('app.media.icon_b'))
二、Image相关属性
1、objectFit，设置缩放类型
ImageFit.Contain: 保持宽高比进行缩小或者放大，使得图片完全显示在显示边界内。
ImageFit.Cover: 保持宽高比进行缩小或者放大，使得图片两边都大于或等于显示边界。
ImageFit.Auto: 自适应显示
ImageFit.Fill: 不保持宽高比进行放大缩小，使得图片充满显示边界。
ImageFit.ScaleDown: 保持宽高比显示，图片缩小或者保持不变
ImageFit.ScaleDown: 保持宽高比显示，图片缩小或者保持不变
官方示例：
三、同步加载图片
一般情况下，图片加载流程会异步进行，以避免阻塞主线程，影响UI交互。
但是特定情况下，图片刷新时会出现闪烁，这时可以使用syncLoad属性，使图片同步加载，从而避免出现闪烁。
不建议图片加载较长时间时使用，会导致页面无法响应。
Image('httpUrl') .width(300) .height(300) .syncLoad(true) // 设置同步加载
作者：听着music睡
Android交流群：38197636
本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。