鸿蒙(HarmonyOS NEXT)使用Image或HarmonyOSSymbol加载图片资源
项目开发中都会使用图片,有本地,网络图片以及对应的格式。目前Image支持加载string、和类型的数据源,png、jpg、bmp、svg和gif类型的图片格式。以及使用系统图标
·
项目开发中都会使用图片,有本地,网络图片以及对应的格式。
目前Image支持加载string、PixelMap和Resource类型的数据源,png、jpg、bmp、svg和gif类型的图片格式
一.使用本地图片
1.一般我们都会放在assets文件夹中。在ets目录里新建一个assets并且拖动图片到该目录里。

Image('/assets/a.png')
.width(48)
.height(48)
2.也可以放在resource目录下的图片-media

注意:这种方式不需要图片后缀
Image($r('app.media.background'))
.width(48)
.height(48)
3.resource目录下的-rawfile

Image($rawfile('background.png'))
.width(48)
.height(48)
二.使用网络图片
使用网络图片的时候需要开启网络权限
module.json5文件里
"requestPermissions": [{
"name":"ohos.permission.INTERNET"
}],
Image组件中使用
Image("https://profileavatar.csdnimg.cn/a5a14c71d4e247b2b0de5f09d0d4deaf_liang04273.jpg!1")
.width(48)
.height(48)
三.使用系统图标(HarmonyOS Symbol)
系统图标库:HarmonyOS 主题图标库 | icon素材免费下载 | 华为开发者联盟
Column() {
Text("Light")
Text() {
SymbolSpan($r('sys.symbol.ohos_trash'))
.fontWeight(FontWeight.Lighter)
.fontSize(96)
}
}

也可以使用image组件
Image($r('sys.media.ohos_ic_public_sound'))
.width(48)
.height(48)
.fillColor(Color.Blue)
四.使用SVG等字体图标
阿里巴巴矢量图标库 iconfont
下载的格式为SVG,可使用fillColor()更改图标颜色,更改不了的则需要在svg代码里添加fill属性
fill='#ccc'

吧下载好的svg图片放到resources目录下的media。使用频率最高

Image($r('app.media.ic_Wechat'))
.width(48)
.height(48)
.fillColor(Color.Red)
更多推荐



所有评论(0)