1# ImageBitmap
2
3An **ImageBitmap** object stores pixel data rendered on a canvas.
4
5>  **NOTE**
6>
7>  The APIs of this module are supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version.
8
9## APIs
10
11ImageBitmap(src: string, unit?: LengthMetricsUnit)
12
13**Widget capability**: This API can be used in ArkTS widgets since API version 9.
14
15**Atomic service API**: This API can be used in atomic services since API version 11.
16
17**System capability**: SystemCapability.ArkUI.ArkUI.Full
18
19**Parameters**
20
21| Name | Type  | Mandatory | Description                                   |
22| ---- | ------ | ---- | ---------------------------------------- |
23| src  | string | Yes | Image source. Local images are supported.<br>1. The string format is used to load local images, for example, **ImageBitmap("common/images/example.jpg")**. For entry and feature modules, the start point of the image path for loading is the **ets** folder of the module. For HAR and shared modules, the start point is the **ets** folder of the entry or feature module into which they are built.<br>2. Supported image formats: bmp, jpg, png, svg, and webp.<br>**NOTE**<br>- ArkTS widgets do not support the strings with the **http://**, **datashare://**, or **file://data/storage**. |
24| unit<sup>12+</sup>  | [LengthMetricsUnit](../js-apis-arkui-graphics.md#lengthmetricsunit12) | No | Unit mode of the **ImageBitmap** object. The value cannot be dynamically changed once set. The configuration method is the same as that of [CanvasRenderingContext2D](ts-canvasrenderingcontext2d.md#lengthmetricsunit12).<br>Default value: **DEFAULT** |
25
26
27## Attributes
28
29**Widget capability**: This API can be used in ArkTS widgets since API version 9.
30
31**Atomic service API**: This API can be used in atomic services since API version 11.
32
33**System capability**: SystemCapability.ArkUI.ArkUI.Full
34
35| Name    | Type | Read Only | Optional | Description |
36| ------ | ------ | ----- | -------- | --------------------------- |
37| width | number | Yes | No | Pixel width of the **ImageBitmap** object.<br>Default unit: vp |
38| height | number | Yes | No | Pixel height of the **ImageBitmap** object.<br>Default unit: vp |
39
40**Example**
41
42  ```ts
43  // xxx.ets
44  @Entry
45  @Component
46  struct ImageExample {
47    private settings: RenderingContextSettings = new RenderingContextSettings(true)
48    private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
49    private img:ImageBitmap = new ImageBitmap("common/images/example.jpg")
50
51    build() {
52      Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
53        Canvas(this.context)
54          .width('100%')
55          .height('100%')
56          .backgroundColor('#ffff00')
57          .onReady(() => {
58            this.context.drawImage(this.img, 0, 0, 500, 500, 0, 0, 400, 200)
59            this.img.close()
60          })
61      }
62      .width('100%')
63      .height('100%')
64    }
65  }
66  ```
67
68  ![en-us_image_0000001194352442](figures/en-us_image_0000001194352442.png)
69
70
71
72## Methods
73
74### close
75
76close(): void
77
78Releases all graphics resources associated with this **ImageBitmap** object and sets its width and height to **0**. For the sample code, see the code for creating an **ImageBitmap** object.
79
80**Widget capability**: This API can be used in ArkTS widgets since API version 9.
81
82**Atomic service API**: This API can be used in atomic services since API version 11.
83
84**System capability**: SystemCapability.ArkUI.ArkUI.Full
85