diff --git a/en/application-dev/application-models/enterprise-extensionAbility.md b/en/application-dev/application-models/enterprise-extensionAbility.md index da8054e54284cc3a32af5ea6acaafc9eabc01561..4f84ec3f63382d64ca824d60f04ce6c691ed2e47 100644 --- a/en/application-dev/application-models/enterprise-extensionAbility.md +++ b/en/application-dev/application-models/enterprise-extensionAbility.md @@ -1,4 +1,4 @@ -# EnterpriseAdminExtensionAbility Development +# EnterpriseAdminExtensionAbility ## Introduction to EnterpriseAdminExtensionAbility @@ -8,34 +8,35 @@ EnterpriseAdminExtensionAbility is a mandatory component for Mobile Device Manag EnterpriseAdminExtensionAbility is applicable only to enterprise administrator applications. -## Observing Activation/Deactivation of a Device Administrator Application and Installation/Removal of an Application + +## Observing Activation/Deactivation of a Device Administrator Application and Installation/Uninstallation of an Application ### Overview -**onAdminEnabled**: When an enterprise administrator or employee deploys an MDM application and activates the device administrator application, this callback is invoked to notify the MDM application that the DeviceAdmin permission is activated. The initialization policy of the MDM application can set in **onAdminEnabled**. +**onAdminEnabled**: called when an enterprise administrator or employee deploys an MDM application and enables the DeviceAdmin permission for the application. The MDM application can set the initialization policy in the **onAdminEnabled** callback. -**onAdminDisabled**: When the device administrator application is deactivated, the callback is invoked to notify the MDM application that the DeviceAdmin permission is deactivated. +**onAdminDisabled**: called when the system or employee disables the DeviceAdmin permission to notify the enterprise administrator that the device is no longer managed. -**onBundleAdded**: The enterprise administrator can subscribe to application installation and uninstallation events. When an application is installed on an enterprise device, the MDM application reports the event in this callback to notify the enterprise administrator. +**onBundleAdded**: The enterprise administrator can subscribe to application installation events. When an application is installed on an enterprise device, the MDM application reports the event in this callback to notify the enterprise administrator. -**onBundleRemoved**: When an application is removed from an enterprise device, the MDM application reports the event in this callback to notify the enterprise administrator. +**onBundleRemoved**: The enterprise administrator can subscribe to application uninstallation events. When an application is uninstalled on an enterprise device, the MDM application reports the event in this callback to notify the enterprise administrator. ### Available APIs | Class | API | Description | | ------------------------------ | ----------------------------------------- | ---------------------------- | -| EnterpriseAdminExtensionAbility | onAdminEnabled(): void | Called when a device administrator application is activated. | -| EnterpriseAdminExtensionAbility | onAdminDisabled(): void | Called when a device administrator application is deactivated.| -| EnterpriseAdminExtensionAbility | onBundleAdded(bundleName: string): void | Called when an application is installed on a device. | -| EnterpriseAdminExtensionAbility | onBundleRemoved(bundleName: string): void | Called when an application is removed from a device. | +| EnterpriseAdminExtensionAbility | onAdminEnabled(): void | Called when the device administrator application is disabled. | +| EnterpriseAdminExtensionAbility | onAdminDisabled(): void | Called when the device administrator application is enabled.| +| EnterpriseAdminExtensionAbility | onBundleAdded(bundleName: string): void | Called when the MDM application is installed. | +| EnterpriseAdminExtensionAbility | onBundleRemoved(bundleName: string): void | Called when the MDM application is uninstalled. | ### How to Develop To implement EnterpriseAdminExtensionAbility, you need to activate the device administrator application and create **ExtensionAbility** in the code directory of the device administrator application. The procedure is as follows: 1. In the **ets** directory of the target module, right-click and choose **New > Directory** to create a directory named **EnterpriseExtAbility**. -2. Right-click the **EnterpriseExtAbility** directory, and choose **New > TypeScript File** to create a file named **EnterpriseExtAbility.ts**. -3. Open the **EnterpriseExtAbility.ts** file and import the **EnterpriseAdminExtensionAbility** module. Inherit the **EnterpriseAdminExtensionAbility** module to the custom class and add application notification callbacks, such as **onAdminEnabled()** and **onAdminDisabled()**. When the device administrator application is activated or deactivated, the device administrator can receive notifications. +2. Right-click the **EnterpriseExtAbility** directory and choose **New > TypeScript File** to create a file named **EnterpriseExtAbility.ts**. +3. Open the **EnterpriseExtAbility.ts** file and import the **EnterpriseAdminExtensionAbility** module. Customize a class that inherits from **EnterpriseAdminExtensionAbility** and add the required callbacks, such as **onAdminEnabled()** and **onAdminDisabled()**, When the device administrator application is activated or deactivated, the device administrator can receive notifications. ```ts import EnterpriseAdminExtensionAbility from '@ohos.enterprise.EnterpriseAdminExtensionAbility'; diff --git a/en/application-dev/reference/apis/js-apis-animator.md b/en/application-dev/reference/apis/js-apis-animator.md index 102acd516e0f7b50ec5f90c00a05150102874c28..4ee805e01e41f3b39a7660d56449a0c082a71131 100644 --- a/en/application-dev/reference/apis/js-apis-animator.md +++ b/en/application-dev/reference/apis/js-apis-animator.md @@ -5,6 +5,8 @@ The **Animator** module provides APIs for applying animation effects, including > **NOTE** > > The initial APIs of this module are supported since API version 6. Newly added APIs will be marked with a superscript to indicate their earliest API version. +> +> This module can be used only after a component instance is created, and it cannot be used in the [UIAbility](./js-apis-app-ability-uiAbility.md). ## Modules to Import diff --git a/en/application-dev/reference/apis/js-apis-mediaquery.md b/en/application-dev/reference/apis/js-apis-mediaquery.md index 7cf762140445fab786d6a5437bf5b97fba64c538..b2b8dfd30eb68510227790c45366de315cbb856b 100644 --- a/en/application-dev/reference/apis/js-apis-mediaquery.md +++ b/en/application-dev/reference/apis/js-apis-mediaquery.md @@ -1,10 +1,12 @@ -# @ohos.mediaquery +# @ohos.mediaquery (Media Query) The **mediaquery** module provides different styles for different media types. > **NOTE** > > The APIs of this module are supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version. +> +> This module can be used only after a component instance is created, and it cannot be used in the [UIAbility](./js-apis-app-ability-uiAbility.md). ## Modules to Import @@ -26,7 +28,7 @@ Sets the media query condition. This API returns the corresponding media query l | Name | Type | Mandatory | Description | | --------- | ------ | ---- | ---------------------------------------- | -| condition | string | Yes | Media query condition. For details, see [Syntax of Media Query Conditions](../../ui/arkts-layout-development-media-query.md#syntax).| +| condition | string | Yes | Media query condition. For details, see [Syntax](../../ui/arkts-layout-development-media-query.md#syntax).| **Return value** @@ -146,7 +148,7 @@ struct MediaQueryExample { } aboutToAppear() { - let portraitFunc = this.onPortrait.bind(this) // Bind the current JS instance. + let portraitFunc = this.onPortrait.bind(this) // Bind the JS instance. this.listener.on('change', portraitFunc) } diff --git a/en/application-dev/reference/apis/js-apis-plugincomponent.md b/en/application-dev/reference/apis/js-apis-plugincomponent.md index 365893915779d1d414b163434a8902fe9ff55363..0ae1baf6eebdadbbdc9d43de1e9c100ac73163db 100644 --- a/en/application-dev/reference/apis/js-apis-plugincomponent.md +++ b/en/application-dev/reference/apis/js-apis-plugincomponent.md @@ -4,7 +4,7 @@ The **PluginComponentManager** module provides APIs for the **PluginComponent** > **NOTE** > -> The initial APIs of this module are supported since API version 8. Newly added APIs will be marked with a superscript to indicate their earliest API version. +> The initial APIs of this module are supported since API version 8. Newly added APIs will be marked with a superscript to indicate their earliest API version. ## Modules to Import @@ -18,10 +18,10 @@ Describes the **PluginComponent** template parameters. **System capability**: SystemCapability.ArkUI.ArkUI.Full -| Name | Type | Mandatory| Description | -| ---------- | ------ | ---- | --------------------------- | -| source | string | Yes | Component template name. | -| bundleName | string | Yes | Bundle name of the provider ability.| +| Name | Type | Mandatory | Description | +| ---------- | ------ | ---- | ---------------------- | +| source | string | Yes | Component template name. | +| bundleName | string | Yes | Bundle name of the provider ability.| ## PluginComponentManager @@ -33,14 +33,14 @@ Stores information in key-value pairs in JSON format. **System capability**: SystemCapability.ArkUI.ArkUI.Full -| Value Range | Description | -| --------------------- | ---------------------------------------- | +| Value Range | Description | +| --------------------- | -------------------- | | [key: string] | Keyword. The value is a string and can be an empty string.| -| number | Key value of the number type. | +| number | Key value of the number type. | | string | Key value of the string type. The value can be an empty string.| -| boolean | Key value of the Boolean type. | -| [] | Key value. The value can be []. | -| [KVObject](#kvobject) | Key value of the KVObject type. | +| boolean | Key value of the Boolean type. | +| [] | Key value. The value can be []. | +| [KVObject](#kvobject) | Key value of the KVObject type. | ### PushParameters @@ -51,13 +51,13 @@ Sets the parameters to be passed in the **PluginManager.Push** API in the FA mod **System capability**: SystemCapability.ArkUI.ArkUI.Full -| Name | Type | Mandatory| Description | -| --------- | ----------------------------------- | ---- | -------------------------------------------------------------- | -| want | [Want](js-apis-application-want.md) | Yes | Ability information of the component user. | -| name | string | Yes | Component name. | -| data | [KVObject](#kvobject) | Yes | Component data value. | -| extraData | [KVObject](#kvobject) | Yes | Additional data value. | -| jsonPath | string | No | Path to the [external.json](#about-the-externaljson-file) file that stores the template path.| +| Name | Type | Mandatory | Description | +| --------- | ----------------------------------- | ---- | ---------------------------------------- | +| want | [Want](js-apis-application-want.md) | Yes | Ability information of the component user. | +| name | string | Yes | Component name. | +| data | [KVObject](#kvobject) | Yes | Component data value. | +| extraData | [KVObject](#kvobject) | Yes | Additional data value. | +| jsonPath | string | No | Path to the [external.json](#about-the-externaljson-file) file that stores the template path.| ### PushParameterForStage @@ -69,14 +69,14 @@ Sets the parameters to be passed in the **PluginManager.Push** API in the stage **System capability**: SystemCapability.ArkUI.ArkUI.Full -| Name | Type | Mandatory| Description | -| --------- | ----------------------------------- | ---- | ---------------------------------------------------------------- | -| owner | [Want](js-apis-application-want.md) | Yes | Ability information of the component provider. | -| target | [Want](js-apis-application-want.md) | Yes | Ability information of the component user. | -| name | string | Yes | Component name. | -| data | [KVObject](#kvobject) | Yes | Component data value. | -| extraData | [KVObject](#kvobject) | Yes | Additional data value. | -| jsonPath | string | No | Path to the [external.json](#about-the-externaljson-file) file that stores the template path.| +| Name | Type | Mandatory | Description | +| --------- | ----------------------------------- | ---- | ---------------------------------------- | +| owner | [Want](js-apis-application-want.md) | Yes | Ability information of the component provider. | +| target | [Want](js-apis-application-want.md) | Yes | Ability information of the component user. | +| name | string | Yes | Component name. | +| data | [KVObject](#kvobject) | Yes | Component data value. | +| extraData | [KVObject](#kvobject) | Yes | Additional data value. | +| jsonPath | string | No | Path to the [external.json](#about-the-externaljson-file) file that stores the template path.| ### RequestParameters @@ -86,12 +86,12 @@ Sets the parameters to be passed in the **PluginManager.Request** API in the FA **System capability**: SystemCapability.ArkUI.ArkUI.Full -| Name | Type | Mandatory| Description | -| -------- | ----------------------------------- | ---- | --------------------------------------------------------------------------------------------------------------------- | -| want | [Want](js-apis-application-want.md) | Yes | Ability information of the component provider. | -| name | string | Yes | Name of the requested component. | -| data | [KVObject](#kvobject) | Yes | Additional data. | -| jsonPath | string | No | Path to the [external.json](#about-the-externaljson-file) file that stores the template path. Request communication is not triggered when **jsonPath** is not empty or not set.| +| Name | Type | Mandatory | Description | +| -------- | ----------------------------------- | ---- | ---------------------------------------- | +| want | [Want](js-apis-application-want.md) | Yes | Ability information of the component provider. | +| name | string | Yes | Name of the requested component. | +| data | [KVObject](#kvobject) | Yes | Additional data. | +| jsonPath | string | No | Path to the [external.json](#about-the-externaljson-file) file that stores the template path. Request communication is not triggered when **jsonPath** is not empty or not set.| ### RequestParameterForStage @@ -103,13 +103,13 @@ Sets the parameters to be passed in the **PluginManager.Request** API in the sta **System capability**: SystemCapability.ArkUI.ArkUI.Full -| Name | Type | Mandatory| Description | -| -------- | ----------------------------------- | ---- | --------------------------------------------------------------------------------------------------------------------- | -| owner | [Want](js-apis-application-want.md) | Yes | Ability information of the component user. | -| target | [Want](js-apis-application-want.md) | Yes | Ability information of the component provider. | -| name | string | Yes | Name of the requested component. | -| data | [KVObject](#kvobject) | Yes | Additional data. | -| jsonPath | string | No | Path to the [external.json](#about-the-externaljson-file) file that stores the template path. Request communication is not triggered when **jsonPath** is not empty or not set.| +| Name | Type | Mandatory | Description | +| -------- | ----------------------------------- | ---- | ---------------------------------------- | +| owner | [Want](js-apis-application-want.md) | Yes | Ability information of the component user. | +| target | [Want](js-apis-application-want.md) | Yes | Ability information of the component provider. | +| name | string | Yes | Name of the requested component. | +| data | [KVObject](#kvobject) | Yes | Additional data. | +| jsonPath | string | No | Path to the [external.json](#about-the-externaljson-file) file that stores the template path. Request communication is not triggered when **jsonPath** is not empty or not set.| ### RequestCallbackParameters @@ -117,11 +117,11 @@ Provides the result returned after the **PluginManager.Request** API is called. **System capability**: SystemCapability.ArkUI.ArkUI.Full -| Name | Type | Mandatory| Description | -| ----------------- | --------------------------------------------------- | ---- | ---------- | -| componentTemplate | [PluginComponentTemplate](#plugincomponenttemplate) | Yes | Component template.| -| data | [KVObject](#kvobject) | Yes | Component data.| -| extraData | [KVObject](#kvobject) | Yes | Additional data.| +| Name | Type | Mandatory | Description | +| ----------------- | ---------------------------------------- | ---- | ----- | +| componentTemplate | [PluginComponentTemplate](#plugincomponenttemplate) | Yes | Component template.| +| data | [KVObject](#kvobject) | Yes | Component data.| +| extraData | [KVObject](#kvobject) | Yes | Additional data.| ### RequestEventResult @@ -129,11 +129,11 @@ Provides the result returned after the request listener is registered and the re **System capability**: SystemCapability.ArkUI.ArkUI.Full -| Name | Type | Mandatory| Description | -| --------- | --------------------- | ---- | ---------- | -| template | string | No | Component template.| -| data | [KVObject](#kvobject) | No | Component data.| -| extraData | [KVObject](#kvobject) | No | Additional data.| +| Name | Type | Mandatory | Description | +| --------- | --------------------- | ---- | ----- | +| template | string | No | Component template.| +| data | [KVObject](#kvobject) | No | Component data.| +| extraData | [KVObject](#kvobject) | No | Additional data.| ### OnPushEventCallback @@ -144,12 +144,12 @@ Registers the listener for the push event. **Parameters** -| Name | Type | Mandatory| Description | -| --------- | --------------------------------------------------- | ---- | ---------------------------------------- | -| source | [Want](js-apis-application-want.md) | Yes | Information about the push request sender. | -| template | [PluginComponentTemplate](#plugincomponenttemplate) | Yes | Name of the request component template for the push request sender.| -| data | [KVObject](#kvobject) | Yes | Data. | -| extraData | [KVObject](#kvobject) | Yes | Additional data. | +| Name | Type | Mandatory | Description | +| --------- | ---------------------------------------- | ---- | ---------------------- | +| source | [Want](js-apis-application-want.md) | Yes | Information about the push request sender. | +| template | [PluginComponentTemplate](#plugincomponenttemplate) | Yes | Name of the request component template for the push request sender.| +| data | [KVObject](#kvobject) | Yes | Data. | +| extraData | [KVObject](#kvobject) | Yes | Additional data. | **Example** @@ -172,11 +172,11 @@ Registers the listener for the request event. **Parameters** -| Name | Type | Mandatory| Description | -| --------- | ----------------------------------- | ---- | --------------------------- | -| source | [Want](js-apis-application-want.md) | Yes | Information about the request sender.| -| name | string | Yes | Template name. | -| extraData | [KVObject](#kvobject) | Yes | Additional data. | +| Name | Type | Mandatory | Description | +| --------- | ----------------------------------- | ---- | ----------------- | +| source | [Want](js-apis-application-want.md) | Yes | Information about the request sender.| +| name | string | Yes | Template name. | +| extraData | [KVObject](#kvobject) | Yes | Additional data. | **Example** @@ -200,10 +200,10 @@ Pushes the component and data to the component user. **Model restriction**: This API can be used only in the FA model. **Parameters** -| Name | Type | Mandatory| Description | -| -------- | --------------------------------- | ---- | ------------------------ | -| param | [PushParameters](#pushparameters) | Yes | Information about the component user. | -| callback | AsyncCallback<void> | Yes | Asynchronous callback used to return the result.| +| Name | Type | Mandatory | Description | +| -------- | --------------------------------- | ---- | ------------ | +| param | [PushParameters](#pushparameters) | Yes | Information about the component user. | +| callback | AsyncCallback<void> | Yes | Asynchronous callback used to return the result.| **Example** @@ -241,10 +241,10 @@ Pushes the component and data to the component user. **Model restriction**: This API can be used only in the stage model. **Parameters** -| Name | Type | Mandatory| Description | -| -------- | ----------------------------------------------- | ---- | ------------------------ | -| param | [PushParameterForStage](#pushparameterforstage) | Yes | Information about the component user. | -| callback | AsyncCallback<void> | Yes | Asynchronous callback used to return the result.| +| Name | Type | Mandatory | Description | +| -------- | ---------------------------------------- | ---- | ------------ | +| param | [PushParameterForStage](#pushparameterforstage) | Yes | Information about the component user. | +| callback | AsyncCallback<void> | Yes | Asynchronous callback used to return the result.| **Example** @@ -289,10 +289,10 @@ Requests the component from the component provider. **Parameters** -| Name | Type | Mandatory| Description | -| -------- | ---------------------------------------------------------------------------------------------- | ---- | ---------------------------------------------------------------- | -| param | [RequestParameters](#requestparameters) | Yes | Information about the component request. | -| callback | AsyncCallback<[RequestCallbackParameters](#requestcallbackparameters) \| void> | Yes | Asynchronous callback used to return the requested data.| +| Name | Type | Mandatory | Description | +| -------- | ---------------------------------------- | ---- | ----------------------------------- | +| param | [RequestParameters](#requestparameters) | Yes | Information about the component request. | +| callback | AsyncCallback<[RequestCallbackParameters](#requestcallbackparameters) \| void> | Yes | Asynchronous callback used to return the requested data.| **Example** @@ -332,10 +332,10 @@ Requests the component from the component provider. **Parameters** -| Name | Type | Mandatory| Description | -| -------- | ---------------------------------------------------------------------------------------------- | ---- | ---------------------------------------------------------------- | -| param | [RequestParameterForStage](#requestparameterforstage) | Yes | Information about the component request. | -| callback | AsyncCallback<[RequestCallbackParameters](#requestcallbackparameters) \| void> | Yes | Asynchronous callback used to return the requested data.| +| Name | Type | Mandatory | Description | +| -------- | ---------------------------------------- | ---- | ----------------------------------- | +| param | [RequestParameterForStage](#requestparameterforstage) | Yes | Information about the component request. | +| callback | AsyncCallback<[RequestCallbackParameters](#requestcallbackparameters) \| void> | Yes | Asynchronous callback used to return the requested data.| **Example** @@ -371,10 +371,10 @@ Listens for events of the request type and returns the requested data, or listen **Parameters** -| Name | Type | Mandatory| Description | -| --------- | ---------------------------------------------------------------------------------------------------------- | ---- | -------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| eventType | string | Yes | Type of the event to listen for. The options are as follows:
**"push"**: The component provider pushes data to the component consumer.
**"request"**: The component consumer proactively requests data from the component provider. | -| callback | [OnPushEventCallback](#onpusheventcallback) \| [OnRequestEventCallback](#onrequesteventcallback) | Yes | Callback used to return the result. The type is [OnPushEventCallback](#onpusheventcallback) for the push event and [OnRequestEventCallback](#onrequesteventcallback) for the request event.| +| Name | Type | Mandatory | Description | +| --------- | ---------------------------------------- | ---- | ---------------------------------------- | +| eventType | string | Yes | Type of the event to listen for. The options are as follows:
**"push"**: The component provider pushes data to the component consumer.
**"request"**: The component consumer proactively requests data from the component provider.| +| callback | [OnPushEventCallback](#onpusheventcallback) \| [OnRequestEventCallback](#onrequesteventcallback) | Yes | Callback used to return the result. The type is [OnPushEventCallback](#onpusheventcallback) for the push event and [OnRequestEventCallback](#onrequesteventcallback) for the request event.| **Example** @@ -396,4 +396,4 @@ The **external.json** file is created by developers. It stores component names a "plugintemplate2": "ets/pages/plugintemplate2.js" } -``` \ No newline at end of file +``` diff --git a/en/application-dev/reference/apis/js-apis-promptAction.md b/en/application-dev/reference/apis/js-apis-promptAction.md index cfff9e3b3d9b719ae1e00348f72ba603ef218398..ca6175a203351e0aeeee4c0fe1c8f617f087f87f 100644 --- a/en/application-dev/reference/apis/js-apis-promptAction.md +++ b/en/application-dev/reference/apis/js-apis-promptAction.md @@ -5,6 +5,8 @@ The **PromptAction** module provides APIs for creating and showing toasts, dialo > **NOTE** > > The initial APIs of this module are supported since API version 9. Newly added APIs will be marked with a superscript to indicate their earliest API version. +> +> This module can be used only after a component instance is created, and it cannot be used in the [UIAbility](./js-apis-app-ability-uiAbility.md). ## Modules to Import diff --git a/en/application-dev/reference/arkui-ts/Readme-EN.md b/en/application-dev/reference/arkui-ts/Readme-EN.md index e94a5832f701d6a44b0ba6252e6011a2711fd403..c886d22cc739bcbc3462da7c70be338496308cd7 100644 --- a/en/application-dev/reference/arkui-ts/Readme-EN.md +++ b/en/application-dev/reference/arkui-ts/Readme-EN.md @@ -42,7 +42,7 @@ - [Hit Test Control](ts-universal-attributes-hit-test-behavior.md) - [Background Blur](ts-universal-attributes-backgroundBlurStyle.md) - [restoreId](ts-universal-attributes-restoreId.md) - - Gesture Processing + - Gesture Handling - [Gesture Binding Methods](ts-gesture-settings.md) - Basic Gestures - [TapGesture](ts-basic-gestures-tapgesture.md) @@ -61,7 +61,7 @@ - [DataPanel](ts-basic-components-datapanel.md) - [DatePicker](ts-basic-components-datepicker.md) - [Divider](ts-basic-components-divider.md) - - [Formcomponent](ts-basic-components-formcomponent.md) + - [FormComponent](ts-basic-components-formcomponent.md) - [Gauge](ts-basic-components-gauge.md) - [Image](ts-basic-components-image.md) - [ImageAnimator](ts-basic-components-imageanimator.md) @@ -144,7 +144,6 @@ - [ImageData](ts-components-canvas-imagedata.md) - [OffscreenCanvasRenderingContext2D](ts-offscreencanvasrenderingcontext2d.md) - [Path2D](ts-components-canvas-path2d.md) - - [Lottie](ts-components-canvas-lottie.md) - Animation - [AnimatorProperty](ts-animatorproperty.md) - [Explicit Animatio](ts-explicit-animation.md) diff --git a/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001194352468.gif b/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001194352468.gif deleted file mode 100644 index 58feeb2988e8d9a643234691ae4d5cf5ccef6d4f..0000000000000000000000000000000000000000 Binary files a/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001194352468.gif and /dev/null differ diff --git a/en/application-dev/reference/arkui-ts/ts-components-canvas-lottie.md b/en/application-dev/reference/arkui-ts/ts-components-canvas-lottie.md deleted file mode 100644 index 58cefdf784cd120789a842d5ec794258dd89ed2a..0000000000000000000000000000000000000000 --- a/en/application-dev/reference/arkui-ts/ts-components-canvas-lottie.md +++ /dev/null @@ -1,611 +0,0 @@ -# Lottie - -**Lottie** allows you to implement animation-specific operations. - -> **NOTE** -> -> The APIs of this module are supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version. - - - -## Modules to Import - -``` -import lottie from '@ohos/lottieETS' -``` - -> **NOTE** -> -> To use **Lottie**, download it first by running the **ohpm install @ohos/lottieETS** command in the Terminal window. - - -## lottie.loadAnimation - -loadAnimation( - -path: string, container: object, render: string, loop: boolean, autoplay: boolean, name: string ): AnimationItem - -Loads an animation. Before calling this API, declare the **Animator('__lottie_ets')** object and make sure the canvas layout is complete. This API can be used together with the lifecycle callback **onReady()** of the **Canvas** component. - -**Parameters** - -| Name | Type | Mandatory | Description | -| -------------- | --------------------------- | ---- | ---------------------------------------- | -| path | string | Yes | Path of the animation resource file in the HAP file. The resource file must be in JSON format. Example: **path: "common/lottie/data.json"**| -| container | object | Yes | Canvas drawing context. A **CanvasRenderingContext2D** object must be declared in advance.| -| render | string | Yes | Rendering type. The value can only be **"canvas"**. | -| loop | boolean \| number | No | If the value is of the Boolean type, this parameter indicates whether to repeat the animation cyclically after the animation ends. If the value is of the number type and is greater than or equal to 1, this parameter indicates the number of times the animation plays.
Default value: **true**| -| autoplay | boolean | No | Whether to automatically play the animation
Default value: **true** | -| name | string | No | Custom animation name. In later versions, the name can be used to reference and control the animation.
Default value: **""** | -| initialSegment | [number, number] | No | Start frame and end frame of the animation, respectively. | - - -## lottie.destroy - -destroy(name: string): void - -Destroys the animation. This API must be called when a page exits. This API can be used together with a lifecycle callback of the **Canvas** component, for example, **onDisappear()** and **onPageHide()**. - -**Parameters** - -| Name | Type | Mandatory | Description | -| ---- | ------ | ---- | ---------------------------------------- | -| name | string | Yes | Name of the animation to destroy, which is the same as the **name** in the **loadAnimation** API. By default, all animations are destroyed.| - -**Example** - ```ts - // xxx.ets - import lottie from '@ohos/lottieETS' - - @Entry - @Component - struct Index { - private controller: CanvasRenderingContext2D = new CanvasRenderingContext2D() - private animateName: string = "animate" - private animatePath: string = "common/lottie/data.json" - private animateItem: any = null - - onPageHide(): void { - console.log('onPageHide') - lottie.destroy() - } - - build() { - Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { - Canvas(this.controller) - .width('30%') - .height('20%') - .backgroundColor('#0D9FFB') - .onReady(() => { - console.log('canvas onAppear'); - this.animateItem = lottie.loadAnimation({ - container: this.controller, - renderer: 'canvas', - loop: true, - autoplay: true, - name: this.animateName, - path: this.animatePath, - }) - }) - - Animator('__lottie_ets') // declare Animator('__lottie_ets') when use lottie - Button('load animation') - .onClick(() => { - if (this.animateItem != null) { - this.animateItem.destroy() - this.animateItem = null - } - this.animateItem = lottie.loadAnimation({ - container: this.controller, - renderer: 'canvas', - loop: true, - autoplay: true, - name: this.animateName, - path: this.animatePath, - initialSegment: [10, 50], - }) - }) - - Button('destroy animation') - .onClick(() => { - lottie.destroy(this.animateName) - this.animateItem = null - }) - } - .width('100%') - .height('100%') - } - } - ``` - - ![en-us_image_0000001194352468](figures/en-us_image_0000001194352468.gif) - - -## lottie.play - -play(name: string): void - -Plays a specified animation. - -**Parameters** - -| Name | Type | Mandatory | Description | -| ---- | ------ | ---- | ---------------------------------------- | -| name | string | Yes | Name of the animation to play, which is the same as the **name** in the **loadAnimation** API. By default, all animations are played.| - -**Example** - - ```ts - lottie.play(this.animateName) - ``` - - -## lottie.pause - -pause(name: string): void - -Pauses a specified animation. The next time **lottie.play()** is called, the animation starts from the current frame. - -**Parameters** - -| Name | Type | Mandatory | Description | -| ---- | ------ | ---- | ---------------------------------------- | -| name | string | Yes | Name of the animation to pause, which is the same as the **name** in the **loadAnimation** API. By default, all animations are paused.| - -**Example** - - ```ts - lottie.pause(this.animateName) - ``` - - -## lottie.togglePause - -togglePause(name: string): void - -Pauses or plays a specified animation. This API is equivalent to the switching between **lottie.play()** and **lottie.pause()**. - -**Parameters** - -| Name | Type | Mandatory | Description | -| ---- | ------ | ---- | ---------------------------------------- | -| name | string | Yes | Name of the target animation, which is the same as the **name** in the **loadAnimation** API. By default, all animations are paused or played.| - -**Example** - - ```ts - lottie.togglePause(this.animateName) - ``` - - -## lottie.stop - -stop(name: string): void - -Stops the specified animation. The next time **lottie.play()** is called, the animation starts from the first frame. - -**Parameters** - -| Name | Type | Mandatory | Description | -| ---- | ------ | ---- | ---------------------------------------- | -| name | string | Yes | Name of the target animation, which is the same as the **name** in the **loadAnimation** API. By default, all animations are stopped.| - -**Example** - - ```ts - lottie.stop(this.animateName) - ``` - - -## lottie.setSpeed - -setSpeed(speed: number, name: string): void - -Sets the playback speed of the specified animation. - -**Parameters** - -| Name | Type | Mandatory | Description | -| ----- | ------ | ---- | ---------------------------------------- | -| speed | number | Yes | Playback speed. The value is a floating-point number. If the value is greater than 0, the animation plays in forward direction. If the value is less than 0, the animation plays in reversed direction. If the value is **0**, the animation is paused. If the value is **1.0** or **-1.0**, the animation plays at the normal speed.| -| name | string | Yes | Name of the target animation, which is the same as the **name** in the **loadAnimation** API. By default, all animations are set.| - -**Example** - - ```ts - lottie.setSpeed(5, this.animateName) - ``` - - -## lottie.setDirection - -setDirection(direction: AnimationDirection, name: string): void - -Sets the direction in which the specified animation plays. - -**Parameters** - -| Name | Type | Mandatory | Description | -| --------- | ------------------ | ---- | ---------------------------------------- | -| direction | AnimationDirection | Yes | Direction in which the animation plays. **1**: forwards; **-1**: backwards. When set to play backwards, the animation plays from the current playback progress to the first frame. When this setting is combined with **loop** being set to **true**, the animation plays backwards continuously. When the value of **speed** is less than 0, the animation also plays backwards.
AnimationDirection: 1 \| -1 | -| name | string | Yes | Name of the target animation, which is the same as the **name** in the **loadAnimation** API. By default, all animations are set.| - -**Example** - - ```ts - lottie.setDirection(-1, this.animateName) - ``` - - -## AnimationItem - -Defines an **AnimationItem** object, which is returned by the **loadAnimation** API and has attributes and APIs. The attributes are described as follows: - -| Name | Type | Description | -| ----------------- | ---------------------------------------- | ---------------------------------------- | -| name | string | Animation name. | -| isLoaded | boolean | Whether the animation is loaded. | -| currentFrame | number | Frame that is being played. The default precision is a floating-point number greater than or equal to 0.0. After **setSubframe(false)** is called, the value is a positive integer without decimal points.| -| currentRawFrame | number | Number of frames that are being played. The precision is a floating point number greater than or equal to 0.0. | -| firstFrame | number | First frame of the animation segment that is being played. | -| totalFrames | number | Total number of frames in the animation segment that is being played. | -| frameRate | number | Frame rate (frame/s). | -| frameMult | number | Frame rate (frame/ms). | -| playSpeed | number | Playback speed. The value is a floating-point number. If the value is greater than 0, the animation plays forward. If the value is less than 0, the animation plays backward. If the value is **0**, the animation is paused. If the value is **1.0** or **-1.0**, the animation plays at the normal speed.| -| playDirection | number | Playback direction.
**1**: forward.
**-1**: backward. | -| playCount | number | Number of times the animation plays. | -| isPaused | boolean | Whether the current animation is paused. The value **true** means that the animation is paused. | -| autoplay | boolean | Whether to automatically play the animation upon completion of the loading. The value **false** means that the **play()** API needs to be called to start playing.| -| loop | boolean \| number | If the value is of the Boolean type, this parameter indicates whether to repeat the animation cyclically after the animation ends. If the value is of the number type and is greater than or equal to 1, this parameter indicates the number of times the animation plays. | -| renderer | any | Animation rendering object, which depends on the rendering type. | -| animationID | string | Animation ID. | -| timeCompleted | number | Number of frames that are played for an animation sequence. The value is affected by the setting of **AnimationSegment** and is the same as the value of **totalFrames**.| -| segmentPos | number | ID of the current animation segment. The value is a positive integer greater than or equal to 0. | -| isSubframeEnabled | boolean | Whether the precision of **currentFrame** is a floating point number. | -| segments | AnimationSegment \| AnimationSegment[] | Current segment of the animation. | - - -## AnimationItem.play - -play(name?: string): void - -Plays an animation. - -**Parameters** - -| Name | Type | Mandatory | Description | -| ---- | ------ | ---- | --------------- | -| name | string | No | Name of the target animation.
Default value: **""** | - -**Example** - - ```ts - this.animateItem.play() - ``` - - -## AnimationItem.destroy - -destroy(name?: string): void - -Destroys an animation. - -**Parameters** - -| Name | Type | Mandatory | Description | -| ---- | ------ | ---- | --------------- | -| name | string | No | Name of the target animation. By default, the value is null.| - -**Example** - - ```ts - this.animateItem.destroy() - ``` - - -## AnimationItem.pause - -pause(name?: string): void - -Pauses an animation. When the **play** API is called next time, the animation is played from the current frame. - -**Parameters** - -| Name | Type | Mandatory | Description | -| ---- | ------ | ---- | --------------- | -| name | string | No | Name of the target animation. By default, the value is null.| - -**Example** - - ```ts - this.animateItem.pause() - ``` - - -## AnimationItem.togglePause - -togglePause(name?: string): void - -Pauses or plays an animation. This API is equivalent to the switching between **play** and **pause**. - -**Parameters** - -| Name | Type | Mandatory | Description | -| ---- | ------ | ---- | --------------- | -| name | string | No | Name of the target animation. By default, the value is null.| - -**Example** - - ```ts - this.animateItem.togglePause() - ``` - - -## AnimationItem.stop - -stop(name?: string): void - -Stops an animation. When the **play** API is called next time, the animation is played from the first frame. - -**Parameters** - -| Name | Type | Mandatory | Description | -| ---- | ------ | ---- | --------------- | -| name | string | No | Name of the target animation. By default, the value is null.| - -**Example** - - ```ts - this.animateItem.stop() - ``` - - -## AnimationItem.setSpeed - -setSpeed(speed: number): void - -Sets the playback speed of an animation. - -**Parameters** - -| Name | Type | Mandatory | Description | -| ----- | ------ | ---- | ---------------------------------------- | -| speed | number | Yes | Playback speed. The value is a floating-point number. If the value is greater than 0, the animation plays forward. If the value is less than 0, the animation plays backward. If the value is 0, the animation is paused. If the value is **1.0** or **-1.0**, the animation plays at the normal speed.| - -**Example** - - ```ts - this.animateItem.setSpeed(5); - ``` - - -## AnimationItem.setDirection - -setDirection(direction: AnimationDirection): void - -Sets the playback direction of an animation. - -**Parameters** - -| Name | Type | Mandatory | Description | -| --------- | ------------------ | ---- | ---------------------------------------- | -| direction | AnimationDirection | Yes | Direction in which the animation plays. **1**: forwards; **-1**: backwards. When set to play backwards, the animation plays from the current playback progress to the first frame. When this setting is combined with **loop** being set to **true**, the animation plays backwards continuously. When the value of **speed** is less than 0, the animation also plays backwards.
AnimationDirection: 1 \| -1.| - -**Example** - - ```ts - this.animateItem.setDirection(-1) - ``` - - -## AnimationItem.goToAndStop - -goToAndStop(value: number, isFrame?: boolean): void - -Sets the animation to stop at the specified frame or time. - -**Parameters** - -| Name | Type | Mandatory | Description | -| ------- | ------- | ---- | ---------------------------------------- | -| value | number | Yes | Frame ID (greater than or equal to 0) or time progress (ms) at which the animation will stop. | -| isFrame | boolean | No | Whether to set the animation to stop at the specified frame. The value **true** means to set the animation to stop at the specified frame, and **false** means to set the animation to stop at the specified time progress.
Default value: **false**| -| name | string | No | Name of the target animation. By default, the value is null. | - -**Example** - - ```ts - // Set the animation to stop at the specified frame. - this.animateItem.goToAndStop(25, true) - // Set the animation to stop at the specified time progress. - this.animateItem.goToAndStop(300, false, this.animateName) - ``` - - -## AnimationItem.goToAndPlay - -goToAndPlay(value: number, isFrame: boolean, name?: string): void - -Sets the animation to start from the specified frame or time progress. - -**Parameters** - -| Name | Type | Mandatory | Description | -| ------- | ------- | ---- | ---------------------------------------- | -| value | number | Yes | Frame ID (greater than or equal to 0) or time progress (ms) at which the animation will start. | -| isFrame | boolean | Yes | Whether to set the animation to start from the specified frame. The value **true** means to set the animation to start from the specified frame, and **false** means to set the animation to start from the specified time progress.
Default value: **false**| -| name | string | No | Name of the target animation.
Default value: **""** | - -**Example** - - ```ts - // Set the animation to stop at the specified frame. - this.animateItem.goToAndPlay(25, true) - // Set the animation to stop at the specified time progress. - this.animateItem.goToAndPlay(300, false, this.animateName) - ``` - - -## AnimationItem.playSegments - -playSegments(segments: AnimationSegment | AnimationSegment[], forceFlag: boolean): void - -Sets the animation to play only the specified segment. - -**Parameters** - -| Name | Type | Mandatory | Description | -| --------- | ---------------------------------------- | ---- | ---------------------------------------- | -| segments | AnimationSegment = [number, number] \| AnimationSegment[] | Yes | Segment or segment list.
If all segments in the segment list are played, only the last segment is played in the next cycle.| -| forceFlag | boolean | Yes | Whether the settings take effect immediately. The value **true** means the settings take effect immediately, and **false** means the settings take effect until the current cycle of playback is completed. | - -**Example** - - ```ts - // Set the animation to play the specified segment. - this.animateItem.playSegments([10, 20], false) - // Set the animation to play the specified segment list. - this.animateItem.playSegments([[0, 5], [20, 30]], true) - ``` - - -## AnimationItem.resetSegments - -resetSegments(forceFlag: boolean): void - -Resets the settings configured by the **playSegments** API to play all the frames. - -**Parameters** - -| Name | Type | Mandatory | Description | -| --------- | ------- | ---- | ------------------------------ | -| forceFlag | boolean | Yes | Whether the settings take effect immediately. The value **true** means the settings take effect immediately, and **false** means the settings take effect until the current cycle of playback is completed.| - -**Example** - - ```ts - this.animateItem.resetSegments(true) - ``` - - -## AnimationItem.resize - -resize(): void - -Resizes the animation layout. - -**Example** - - ```ts - this.animateItem.resize() - ``` - - -## AnimationItem.setSubframe - -setSubframe(useSubFrame: boolean): void - -Sets the precision of the **currentFrame** attribute to display floating-point numbers. - -**Parameters** - -| Name | Type | Mandatory | Description | -| ------------ | ------- | ---- | ---------------------------------------- | -| useSubFrames | boolean | Yes | Whether the **currentFrame** attribute displays floating-point numbers. By default, the attribute displays floating-point numbers.
**true**: The **currentFrame** attribute displays floating-point numbers.
**false**: The **currentFrame** attribute displays an integer and does not display floating-point numbers.| - -**Example** - - ```ts - this.animateItem.setSubframe(false) - ``` - - -## AnimationItem.getDuration - -getDuration(inFrames?: boolean): void - -Obtains the duration (irrelevant to the playback speed) or number of frames for playing an animation sequence. The settings are related to the input parameter **initialSegment** of the **Lottie.loadAnimation** API. - -**Parameters** - -| Name | Type | Mandatory | Description | -| -------- | ------- | ---- | ---------------------------------------- | -| inFrames | boolean | No | Whether to obtain the duration or number of frames.
**true**: number of frames.
**false**: duration, in ms.
Default value: **false**| - -**Example** - - ```ts - this.animateItem.getDuration(true) - ``` - - -## AnimationItem.addEventListener - -addEventListener<T = any>(name: AnimationEventName, callback: AnimationEventCallback<T>): () => void - -Adds an event listener. After the event is complete, the specified callback is triggered. This API returns the function object that can delete the event listener. - -**Parameters** - -| Name | Type | Mandatory | Description | -| -------- | ------------------------------- | ---- | ---------------------------------------- | -| name | AnimationEventName | Yes | Animation event type. The available options are as follows:
'enterFrame', 'loopComplete', 'complete', 'segmentStart', 'destroy', 'config_ready', 'data_ready', 'DOMLoaded', 'error', 'data_failed', 'loaded_images'| -| callback | AnimationEventCallback<T> | Yes | Custom callback. | - -**Example** - - ```ts - private callbackItem: any = function() { - console.log("grunt loopComplete") - } - let delFunction = this.animateItem.addEventListener('loopComplete', this.animateName) - - // Delete the event listener. - delFunction() - ``` - - -## AnimationItem.removeEventListener - -removeEventListener<T = any>(name: AnimationEventName, callback?: AnimationEventCallback<T>): void - -Removes an event listener. - -**Parameters** - -| Name | Type | Mandatory | Description | -| -------- | ------------------------------- | ---- | ---------------------------------------- | -| name | AnimationEventName | Yes | Animation event type. The available options are as follows:
'enterFrame', 'loopComplete', 'complete', 'segmentStart', 'destroy', 'config_ready', 'data_ready', 'DOMLoaded', 'error', 'data_failed', 'loaded_images'| -| callback | AnimationEventCallback<T> | No | Custom callback. By default, the value is null, meaning that all callbacks of the event will be removed. | - -**Example** - - ```ts - this.animateItem.removeEventListener('loopComplete', this.animateName) - ``` - - -## AnimationItem.triggerEvent - -triggerEvent<T = any>(name: AnimationEventName, args: T): void - -Directly triggers all configured callbacks of a specified event. - -**Parameters** - -| Name | Type | Mandatory | Description | -| ---- | ------------------ | ---- | --------- | -| name | AnimationEventName | Yes | Animation event type. | -| args | any | Yes | Custom callback parameters.| - -**Example** - - ```ts - private triggerCallBack: any = function(item) { - console.log("trigger loopComplete, name:" + item.name) - } - - this.animateItem.addEventListener('loopComplete', this.triggerCallBack) - this.animateItem.triggerEvent('loopComplete', this.animateItem) - this.animateItem.removeEventListener('loopComplete', this.triggerCallBack) - ``` diff --git a/en/application-dev/reference/arkui-ts/ts-methods-custom-dialog-box.md b/en/application-dev/reference/arkui-ts/ts-methods-custom-dialog-box.md index 4b326869620b8db4032f7e37345da899c2d52bf7..263bbb9810f4f919a20030aa064251f9a7746a34 100644 --- a/en/application-dev/reference/arkui-ts/ts-methods-custom-dialog-box.md +++ b/en/application-dev/reference/arkui-ts/ts-methods-custom-dialog-box.md @@ -11,7 +11,7 @@ A custom dialog box is a dialog box you customize by using APIs of the **CustomD ## APIs -CustomDialogController(value:{builder: CustomDialog, cancel?: () => void, autoCancel?: boolean, alignment?: DialogAlignment, offset?: Offset, customStyle?: boolean, gridCount?: number, maskColor?: ResourceColor, openAnimation?: AnimateParam, closeAniamtion?: AnimateParam, showInSubWindow?: boolean}) +CustomDialogController(value:{builder: CustomDialog, cancel?: () => void, autoCancel?: boolean, alignment?: DialogAlignment, offset?: Offset, customStyle?: boolean, gridCount?: number, maskColor?: ResourceColor, openAnimation?: AnimateParam, closeAniamtion?: AnimateParam}) **Parameters** @@ -108,9 +108,10 @@ struct CustomDialogUser { customStyle: false }) + // Delete the dialogController instance and set it to undefined when the custom component is about to be destroyed. aboutToDisappear() { - delete this.dialogController, - this.dialogController = undefined + delete this.dialogController, // Delete the dialogController instance. + this.dialogController = undefined // Set dialogController to undefined. } onCancel() { diff --git a/en/application-dev/ui/arkts-common-events-touch-screen-event.md b/en/application-dev/ui/arkts-common-events-touch-screen-event.md index 714632ca346c2c4c2af4a534ef74b87d70b9272c..8ea799215eba028933a83a571e0d45d22c113ca7 100644 --- a/en/application-dev/ui/arkts-common-events-touch-screen-event.md +++ b/en/application-dev/ui/arkts-common-events-touch-screen-event.md @@ -12,7 +12,7 @@ Touchscreen events are events triggered when a finger or stylus is placed on, mo ## Click Event -A click event is triggered when a complete press and lift action performed by using a finger or a stylus. When a click event occurs, the following callback is triggered: +A click event is triggered when a complete press and lift action is performed by using a finger or a stylus. When a click event occurs, the following callback is triggered: ```ts onClick(event: (event?: ClickEvent) => void) diff --git a/en/application-dev/ui/arkts-drawing-customization-on-canvas.md b/en/application-dev/ui/arkts-drawing-customization-on-canvas.md index 7e0e1f79da9c0f26c210a939a54586a09f083832..93b8e8f114dc32163bbf2859710b85c0e681bf2c 100644 --- a/en/application-dev/ui/arkts-drawing-customization-on-canvas.md +++ b/en/application-dev/ui/arkts-drawing-customization-on-canvas.md @@ -89,11 +89,7 @@ You can draw custom graphics on the canvas in any of the following ways: import lottie from '@ohos/lottie' ``` - For details about the APIs, see [Lottie](../reference/arkui-ts/ts-components-canvas-lottie.md). - - >**NOTE** - > - >Before using Lottie for the first time, run the **ohpm install \@ohos/lottieETS** command in the Terminal window to download Lottie. + For details about the APIs, see [Lottie](https://gitee.com/openharmony-tpc/lottieETS). ## Initializing the Canvas Component @@ -117,7 +113,7 @@ Canvas(this.context) ## Canvas Component Drawing Modes -Two modes are available for drawing with the **Canvas** component: +Two modes are available for drawing with the **Canvas** component: - After the **onReady()** callback of the **Canvas** component is invoked, use the **CanvasRenderingContext2D** and **OffscreenCanvasRenderingContext2D** objects to call related APIs for drawing. @@ -159,9 +155,8 @@ Two modes are available for drawing with the **Canvas** component: - Draw a basic shape. - -You can draw a basic shape by calling APIs such as [arc](../reference/arkui-ts/ts-canvasrenderingcontext2d.md#arc), [ellipse](../reference/arkui-ts/ts-canvasrenderingcontext2d.md#ellipse), and [rect](../reference/arkui-ts/ts-canvasrenderingcontext2d.md#rect). - + You can draw a basic shape by calling APIs such as [arc](../reference/arkui-ts/ts-canvasrenderingcontext2d.md#arc), [ellipse](../reference/arkui-ts/ts-canvasrenderingcontext2d.md#ellipse), and [rect](../reference/arkui-ts/ts-canvasrenderingcontext2d.md#rect). + ```ts Canvas(this.context) .width('100%') @@ -183,9 +178,9 @@ You can draw a basic shape by calling APIs such as [arc](../reference/arkui-ts/t }) ``` - + ![2023022794521(1)](figures/2023022794521(1).jpg) - + - Draw text. You can use APIs such as [fillText](../reference/arkui-ts/ts-canvasrenderingcontext2d.md#filltext) and [strokeText](../reference/arkui-ts/ts-canvasrenderingcontext2d.md#stroketext) to draw text. @@ -345,4 +340,3 @@ You can draw a basic shape by calling APIs such as [arc](../reference/arkui-ts/t ``` ![2023032422159](figures/2023032422159.jpg) - diff --git a/en/application-dev/ui/arkts-event-overview.md b/en/application-dev/ui/arkts-event-overview.md index 44a241effc7b524a24faf2f823fee574857115cb..621bb32a1cf96eaf90dea0bd2f1b01dd1aa1e89f 100644 --- a/en/application-dev/ui/arkts-event-overview.md +++ b/en/application-dev/ui/arkts-event-overview.md @@ -1,23 +1,23 @@ # Interaction Event Overview -Interaction events are classified into touchscreen events, keyboard and mouse events, and focus events based on trigger types. +Interaction events are classified based on trigger types into touchscreen events, keyboard and mouse events, and focus events. -- [Touchscreen event](arkts-common-events-touch-screen-event.md): single-finger or single-stroke operation performed by a finger or stylus on the touchscreen. +- [Touchscreen event](arkts-common-events-touch-screen-event.md): an event triggered by the operation performed a finger or stylus on the touchscreen. -- [Keyboard and mouse event](arkts-common-events-device-input-event.md): includes operation events of the peripheral mouse or touchpad and key events of the peripheral keyboard. - - The mouse event refers to an event responded to when an operation is performed with a peripheral mouse/touchpad. - - The key event refer to an event responded to when an operation is performed with a peripheral keyboard. +- [Keyboard and mouse event](arkts-common-events-device-input-event.md): an event triggered by an operation performed on a peripheral mouse, touchpad, or keyboard. + - The mouse event refers to an event responded to when an operation is performed with a peripheral mouse or touchpad. + - The keyboard event refera to an event responded to when an operation is performed with a peripheral keyboard. -- [Focus event](arkts-common-events-focus-event.md): controls the focusability and response events of the component in the preceding ways. +- [Focus event](arkts-common-events-focus-event.md): an event triggered when a component receives or loses focus. -The gesture event includes the gesture binding method and the bound gesture. The bound gesture may be classified into two types: a single gesture and a combined gesture, and is distinguished according to complexity of the gesture. +The gesture event includes the gesture binding method and the bound gesture – a single or combined gesture. -- [Gesture binding](arkts-gesture-events-binding.md): binds a single gesture or a combination of gestures to a component and declares the response priority of the bound gesture. +- [Gesture binding method](arkts-gesture-events-binding.md): a method that binds a single or combined gesture to a component and declares the response priority of the bound gesture. -- [Single gesture](arkts-gesture-events-single-gesture.md): basic unit of a gesture, which is a part of all complex gestures. +- [Single gesture](arkts-gesture-events-single-gesture.md): basic unit of gestures, which is a part of all complex gestures. -- [Combined gesture](arkts-gesture-events-combined-gestures.md): a combination of multiple single gestures. Multiple single gestures can be combined into a combined gesture according to a declared type and a certain rule, and the combined gesture can be used. +- [Combined gesture](arkts-gesture-events-combined-gestures.md): a combination of single gestures brought together according to a declared type and a certain rule.