问题:
在鸿蒙中,是识别不了.9格式的图片资源的,那么如何实现.9图效果呢。?
解决方案:
首先需要将图片资源转为普通的png格式。如果是背景图的,需要换一种方式来处理,目前我所实现的方案是通过Stack+ Image + 具体内容布局来实现的。具体如下:
- 需要使用Image来实现
- Image通过设置resizable属性来设置ResizableOptions,该属性指:图像拉伸时可调整大小的图像选项。
- ResizableOptions:有两个属性:slice,lattice。
- 重点看slice,其类型为 EdgeWidths。表示:边框宽度类型,共有四个值:top、right、bottom、left。用于描述组件边框不同方向的宽度。(只有当bottom和right同时大于0时,该属性生效。)
-
- top
- 说明:图片顶部拉伸时保持不变距离。
- 默认值:0
-
right
- 说明:图片右部拉伸时保持不变距离。
- 默认值:0
-
bottom
- 说明:图片底部拉伸时保持不变距离。
- 默认值:0
-
left
- 说明:图片左部拉伸时保持不变距离。
- 默认值:0
-
Image($r('app.media.bg_test')).width(100).resizable({ slice: { top: 10, left: 10, bottom: 10, right: 10 } })