!16476 新增DrawableDescriptor说明文档

Merge pull request !16476 from 王一卉/drawable

zh-cn/application-dev/reference/apis/js-apis-arkui-drawableDescriptor.md

+# @ohos.arkui.drawableDescriptor  (DrawableDescriptor)
+
+本模块提供获取pixelMap的能力，包括前景、背景、蒙版和分层图标。
+
+> **说明：**
+>
+> 本模块首批接口从API version 10开始支持。后续版本的新增接口，采用上角标单独标记接口的起始版本。
+>
+> 示例效果请以真机运行为准，当前IDE预览器不支持。
+
+## 导入模块
+
+```js
+import { DrawableDescriptor, LayeredDrawableDescriptor } from '@ohos.arkui.drawableDescriptor';
+```
+
+## DrawableDescriptor.constructor
+constructor()
+
+创建DrawableDescriptor或LayeredDrawableDescriptor对象。对象构造需要使用全球化接口[getDrawableDescriptor](js-apis-resource-manager.md##getdrawabledescriptor)或[getDrawableDescriptorByName](js-apis-resource-manager.md##getdrawabledescriptorbyname)。
+
+**系统接口：** 此接口为系统接口。
+
+**系统能力：** SystemCapability.ArkUI.ArkUI.Full
+
+### DrawableDescriptor
+
+当传入资源id或name为普通图片时，生成DrawableDescriptor对象。
+
+### LayeredDrawableDescriptor
+
+当传入资源id或name为包含前景和背景资源的json文件时，生成LayeredDrawableDescriptor对象。
+
+**示例：**
+```js
+@Entry
+@Component
+struct Index {
+  private resManager = getContext().resourceManager
+  let drawable1 = resManager.getDrawableDescriptor($r('app.media.icon').id)
+  let drawable2 = resManager.getDrawableDescriptorByName(icon)
+  let layeredDrawable1 = resManager.getDrawableDescriptor($r('app.media.file').id)
+  let layeredDrawable1 = resManager.getDrawableDescriptor(file)
+ }
+```
+
+## DrawableDescriptor.getPixelMap
+getPixelMap(): image.PixelMap;
+
+获取pixelMap。
+
+**系统能力：** SystemCapability.ArkUI.ArkUI.Full
+
+**返回值：**
+
+| 类型                              | 说明              |
+| --------------------------------- | ---------------- |
+| [image.PixelMap](../apis/js-apis-image.md#pixelmap7) | PixelMap |
+
+**示例：**
+  ```js
+  @State pixmap: PixelMap = drawable1.getPixelMap();
+  ```
+
+## LayeredDrawableDescriptor.getPixelMap
+getPixelMap(): image.PixelMap;
+
+获取前景、背景和蒙版融合裁剪后的pixelMap。
+
+**系统能力：** SystemCapability.ArkUI.ArkUI.Full
+
+**返回值：**
+
+| 类型                              | 说明              |
+| --------------------------------- | ---------------- |
+| [image.PixelMap](../apis/js-apis-image.md#pixelmap7) | PixelMap |
+
+**示例：**
+  ```js
+  @State pixmap: PixelMap = layeredDrawable1.getPixelMap();
+  ```
+
+## LayeredDrawableDescriptor.getForeground
+getForeground(): DrawableDescriptor;
+
+获取前景的DrawableDescriptor对象。
+
+**系统能力：** SystemCapability.ArkUI.ArkUI.Full
+
+**返回值：**
+
+| 类型                              | 说明              |
+| --------------------------------- | ---------------- |
+| [DrawableDescriptor](#drawabledescriptor) | DrawableDescriptor对象 |
+
+**示例：**
+  ```js
+  @State drawable: DrawableDescriptor = layeredDrawable1.getForeground();
+  ```
+
+## LayeredDrawableDescriptor.getBackground
+getBackground(): DrawableDescriptor;
+
+获取背景的DrawableDescriptor对象。
+
+**系统能力：** SystemCapability.ArkUI.ArkUI.Full
+
+**返回值：**
+
+| 类型                              | 说明              |
+| --------------------------------- | ---------------- |
+| [DrawableDescriptor](#drawabledescriptor) | DrawableDescriptor对象 |
+
+**示例：**
+  ```js
+  @State drawable: DrawableDescriptor = layeredDrawable1.getBackground();
+  ```
+
+## LayeredDrawableDescriptor.getMask
+getMask(): DrawableDescriptor;
+
+获取蒙版的DrawableDescriptor对象。
+
+**系统能力：** SystemCapability.ArkUI.ArkUI.Full
+
+**返回值：**
+
+| 类型                              | 说明              |
+| --------------------------------- | ---------------- |
+| [DrawableDescriptor](#drawabledescriptor) | DrawableDescriptor对象 |
+
+**示例：**
+  ```js
+  @State drawable: DrawableDescriptor = layeredDrawable1.getMask();
+  ```

zh-cn/application-dev/reference/arkui-ts/ts-basic-components-image.md

@@ -19,7 +19,7 @@
 
 ## 接口
 
-Image(src: string | PixelMap | Resource)
+(src: PixelMap | ResourceStr | DrawableDescriptor)
 
 通过图片数据源获取图片，用于后续渲染展示。
 
@@ -29,7 +29,7 @@ Image(src: string | PixelMap | Resource)
 
 | 参数名 | 参数类型                                                     | 必填 | 参数描述                                                     |
 | ------ | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ |
-| src    | string\|&nbsp;[PixelMap](../apis/js-apis-image.md#pixelmap7)&nbsp;\|&nbsp;[Resource](ts-types.md#resource类型) | 是   | 图片的数据源，支持本地图片和网络图片。<br/>当使用相对路径引用图片资源时，例如`Image("common/test.jpg")`，不支持跨包/跨模块调用该Image组件，建议使用`$r`方式来管理需全局使用的图片资源。<br/>\- 支持的图片格式包括png、jpg、bmp、svg和gif。<br/>\- 支持`Base64`字符串。格式`data:image/[png\|jpeg\|bmp\|webp];base64,[base64 data]`, 其中`[base64 data]`为`Base64`字符串数据。<br/>\- 支持`datashare://`路径前缀的字符串，用于访问通过data&nbsp;ability提供的图片路径。图片加载前需要申请[媒体库功能相关权限](../../file-management/medialibrary-overview.md#申请媒体库功能相关权限)<br/>\- 支持file:///data/storage路径前缀的字符串，用于读取本应用安装目录下files文件夹下的图片资源。需要保证目录包路径下的文件有可读权限。<br/>**说明：**<br/>- ArkTS卡片上支持gif图片格式动效，但仅在显示时播放一次。<br/>- ArkTS卡片上不支持`http://`等网络相关路径前缀、`datashare://`路径前缀以及`file://data/storage`路径前缀的字符串<br/>- ArkTS卡片上不支持&nbsp;[PixelMap](../apis/js-apis-image.md#pixelmap7)类型 |
+| src    | &nbsp;[PixelMap](../apis/js-apis-image.md#pixelmap7)&nbsp;\|ResourceStr\|&nbsp;[DrawableDescriptor](../apis/js-apis-arkui-drawableDescriptor.md#drawabledescriptor) | 是   | 图片的数据源，支持本地图片和网络图片。<br/>当使用相对路径引用图片资源时，例如`Image("common/test.jpg")`，不支持跨包/跨模块调用该Image组件，建议使用`$r`方式来管理需全局使用的图片资源。<br/>\- 支持的图片格式包括png、jpg、bmp、svg和gif。<br/>\- 支持`Base64`字符串。格式`data:image/[png\|jpeg\|bmp\|webp];base64,[base64 data]`, 其中`[base64 data]`为`Base64`字符串数据。<br/>\- 支持`datashare://`路径前缀的字符串，用于访问通过data&nbsp;ability提供的图片路径。图片加载前需要申请[媒体库功能相关权限](../../file-management/medialibrary-overview.md#申请媒体库功能相关权限)<br/>\- 支持file:///data/storage路径前缀的字符串，用于读取本应用安装目录下files文件夹下的图片资源。需要保证目录包路径下的文件有可读权限。<br/>\- 支持[DrawableDescriptor](../apis/js-apis-arkui-drawableDescriptor.md#drawabledescriptor)对象<br/>**说明：**<br/>- ArkTS卡片上支持gif图片格式动效，但仅在显示时播放一次。<br/>- ArkTS卡片上不支持`http://`等网络相关路径前缀、`datashare://`路径前缀以及`file://data/storage`路径前缀的字符串<br/>- ArkTS卡片上不支持&nbsp;[PixelMap](../apis/js-apis-image.md#pixelmap7)类型 |
 
 ## 属性