| src | string\|[PixelMap](../apis/js-apis-image.md#pixelmap7)\|[Resource](../../ui/ts-types.md#resource-type) | Yes | - | Image address, which can be the address of an Internet or a local image.<br/>When using resources referenced using a relative path, for example, `Image("common/test.jpg")`, the **\<Image>** component cannot be called across bundles or modules. Therefore, you are advised to use `$r` to reference image resources that need to be used globally.<br>\- The following image formats are supported: png, jpg, bmp, svg, gif.<br/>\- Base64 strings are supported. The value format is `data:image/[png\|jpeg\|bmp\|webp];base64,[base64 data]`, where `[base64 data]` is a Base64 string. <br/>\- The value can also be a path starting with `dataability://`, which is used to access the image path provided by a Data ability. |
| src | string\|[PixelMap](../apis/js-apis-image.md#pixelmap7)\|[Resource](../../ui/ts-types.md#resource-type) | Yes | - | Image address, which can be the address of an Internet or a local image.<br/>When using resources referenced using a relative path, for example, `Image("common/test.jpg")`, the **\<Image>** component cannot be called across bundles or modules. Therefore, you are advised to use `$r` to reference image resources that need to be used globally.<br>\- The following image formats are supported: png, jpg, bmp, svg, gif.<br/>\- Base64 strings are supported. The value format is `data:image/[png\|jpeg\|bmp\|webp];base64,[base64 data]`, where `[base64 data]` is a Base64 string. <br/>\- The value can also be a path starting with `dataability://`, which is used to access the image path provided by a Data ability. |
## Attributes
| Name | Type | Default Value | Description |
| -------- | -------- | -------- | -------- |
| alt | string | - | Placeholder image displayed during loading. Both local and Internal URIs are supported. |
| alt | string \|[Resource](../../ui/ts-types.md#resource-type)| - | Placeholder image displayed during loading. Both local and Internal URIs are supported. |
| objectRepeat | [ImageRepeat](ts-appendix-enums.md#imagerepeat-enums) | ImageRepeat.NoRepeat | Whether the image is repeated.<br/>**NOTE**<br/>This attribute is not applicable to SVG images. |
| interpolation | ImageInterpolation | None | Interpolation effect of the image. This attribute is valid only when the image is zoomed in.<br/>**NOTE**<br/>- This attribute is not applicable to SVG images.<br/>- This attribute is not applicable to a **PixelMap** object. |
| renderMode | ImageRenderMode | Original | Rendering mode of the image.<br/>**NOTE**<br/>This attribute is not applicable to SVG images. |
> This method is supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version.
You can set the text content and response callback for an alert dialog box.
The **<AlertDialog\>** component is used to display an alert dialog box. You can set the text content and response callback for an alert dialog box as needed.
## Attributes
| Name | Type | Default Value | Description |
| Name | Type | Default Value | Description |
| -------- | -------- | -------- | -------- |
| show | options: { paramObject1\| paramObject2} | - | Defines and displays the **<AlertDialog>** component. |
| show | options: { paramObject1\| paramObject2} | - | Defines and displays the **<AlertDialog\>** component. |
- paramObject1 parameters
| Name | Type | Mandatory | Default Value | Description |
| title | string \|[Resource](../../ui/ts-types.md#resource) | | | Title of a dialog box. |
| message | string \|[Resource](../../ui/ts-types.md#resource) | | | Content of the dialog box. |
| title | string \|[Resource](../../ui/ts-types.md#resource-type) | No | - | Title of a dialog box. |
| message | string \|[Resource](../../ui/ts-types.md#resource-type) | Yes | - | Content of the dialog box. |
| autoCancel | boolean | No | true | Whether to close the dialog box when the overlay is clicked. |
| confirm | {<br/>value: string \|[Resource](../../ui/ts-types.md#resource),<br>fontColor?: Color\|number \|string \|[Resource](../../ui/ts-types.md#resource),<br/>backgroundColor?:Color \|number\|string\|[Resource](../../ui/ts-types.md#resource),<br>action: () => void<br/>} <br/> | | | Text content, text color, background color, and click callback of the confirm button. |
| confirm | {<br/>value: string \|[Resource](../../ui/ts-types.md#resource-type),<br>fontColor?: Color\| number \| string \|[Resource](../../ui/ts-types.md),<br/>backgroundColor?:Color \| number \| string \|[Resource](../../ui/ts-types.md),<br>action: () => void<br/>} <br/> | No | - | Text content, text color, background color, and click callback of the confirm button. |
| cancel | () => void | No | - | Callback invoked when the dialog box is closed after the overlay is clicked. |
| alignment | DialogAlignment | No | DialogAlignment.Default | Alignment mode of the dialog box in the vertical direction. |
| offset | {<br/>dx: Length \|[Resource](../../ui/ts-types.md#resource),<br/>dy: Length \|[Resource](../../ui/ts-types.md#resource)<br/>} | | | Offset of the dialog box relative to the alignment position. |
| alignment | [DialogAlignment](ts-methods-custom-dialog-box.md) | No | DialogAlignment.Default | Alignment mode of the dialog box in the vertical direction. |
| offset | {<br/>dx: Length \|[Resource](../../ui/ts-types.md#resource-type),<br/>dy: Length \|[Resource](../../ui/ts-types.md)<br/>} | No | - | Offset of the dialog box relative to the alignment position. |
| gridCount | number | No | - | Number of grid columns occupied by the width of the dialog box. |
- paramObject2 parameters
| Name | Type | Mandatory | Default Value | Description |
| Name | Type | Mandatory | Default Value | Description |
| title | string \|[Resource](../../ui/ts-types.md#resource) | No | - | Title of a dialog box. |
| message | string \|[Resource](../../ui/ts-types.md#resource) | Yes | - | Content of the dialog box. |
| title | string \|[Resource](../../ui/ts-types.md#resource-type) | No | - | Title of a dialog box. |
| message | string \|[Resource](../../ui/ts-types.md#resource-type) | Yes | - | Content of the dialog box. |
| autoCancel | boolean | No | true | Whether to close the dialog box when the overlay is clicked. |
| primaryButton | {<br/>value: string \|[Resource](../../ui/ts-types.md#resource),<br>fontColor?: Color\|number \|string \|[Resource](../../ui/ts-types.md#resource),<br/>backgroundColor?:Color \|number\|string\|[Resource](../../ui/ts-types.md#resource),<br>action: () => void<br/>} <br/> | | | Text content, text color, background color, and click callback of the primary button. |
| secondaryButton | {<br/>value: string \|[Resource](../../ui/ts-types.md#resource),<br>fontColor?: Color\|number \|string \|[Resource](../../ui/ts-types.md#resource),<br/>backgroundColor?:Color \|number\|string\|[Resource](../../ui/ts-types.md#resource),<br>action: () => void<br/>} <br/> | | | Text content, text color, background color, and click callback of the secondary button. |
| primaryButton | {<br/>value: string \|[Resource](../../ui/ts-types.md#resource-type),<br>fontColor?: Color \| number \| string \|[Resource](../../ui/ts-types.md),<br/>backgroundColor?:Color \| number\| string\|[Resource](../../ui/ts-types.md),<br>action: () => void<br/>} <br/> | No | - | Text content, text color, background color, and click callback of the primary button. |
| secondaryButton | {<br/>value: string \|[Resource](../../ui/ts-types.md#resource-type),<br>fontColor?: Color \| number \| string \|[Resource](../../ui/ts-types.md),<br/>backgroundColor?:Color \| number\| string\|[Resource](../../ui/ts-types.md),<br>action: () => void<br/>} <br/> | No | - | Text content, text color, background color, and click callback of the secondary button. |
| cancel | () => void | No | - | Callback invoked when the dialog box is closed after the overlay is clicked. |
| alignment | DialogAlignment | No | DialogAlignment.Default | Alignment mode of the dialog box in the vertical direction. |
| offset | {<br/>dx: Length \|[Resource](../../ui/ts-types.md#resource),<br/>dy: Length \|[Resource](../../ui/ts-types.md#resource)<br/>} | | | Offset of the dialog box relative to the alignment position. |
| alignment | [DialogAlignment](ts-methods-custom-dialog-box.md) | No | DialogAlignment.Default | Alignment mode of the dialog box in the vertical direction. |
| offset | {<br/>dx: Length \|[Resource](../../ui/ts-types.md#resource-type),<br/>dy: Length \|[Resource](../../ui/ts-types.md#resource-type)<br/>} | No | - | Offset of the dialog box relative to the alignment position. |
| gridCount | number | No | - | Number of grid columns occupied by the width of the dialog box. |
A touch event is triggered when a finger is pressed, slides, or is lifted from a component.
> **NOTE**
>
...
...
@@ -13,49 +14,51 @@ None
## Events
| Name | Bubbling Supported | Description |
| -------- | -------- | -------- |
| onTouch(callback: (event?: TouchEvent) => void) | Yes | Invoked when a touch action is triggered. For details about **event**, see [TouchEvent](#touchevent). |
| onTouch(callback: (event?: TouchEvent) => void) | Yes | Invoked when a touch action is triggered. For details about **event**, see [TouchEvent](#touchevent).|
## TouchEvent
- Attributes
| Name | Type | Description |
| -------- | -------- | -------- |
| type | TouchType | Type of a touch event. |
| touches | Array<[TouchObject](#touchobject)> | All finger information. |
| changedTouches | Array<[TouchObject](#touchobject)> | Finger information changed. |
| timestamp | number | Timestamp of the event. |
| target<sup>8+</sup> | [EventTarget](ts-universal-events-click.md#eventtarget8) | Target of the event. |
