diff --git a/en/application-dev/reference/apis/js-apis-accessibility-config.md b/en/application-dev/reference/apis/js-apis-accessibility-config.md index 71517bfb32ca3880637b565c85c02e53acbad8e6..c33230f7181ce92a50cee6c1417eb5d71a124f68 100644 --- a/en/application-dev/reference/apis/js-apis-accessibility-config.md +++ b/en/application-dev/reference/apis/js-apis-accessibility-config.md @@ -22,7 +22,7 @@ import config from "@ohos.accessibility.config"; | -------- | -------- | -------- | -------- | -------- | | highContrastText | [Config](#config)\| Yes| Yes| Whether to enable high-contrast text.| | invertColor | [Config](#config)\| Yes| Yes| Whether to enable color inversion.| -| daltonizationColorFilter | [Config](#config)<[DaltonizationColorFilter](#daltonizationcolorfilter)>| Yes| Yes| Configuration of the daltonization filter.| +| daltonizationColorFilter | [Config](#config)\<[DaltonizationColorFilter](#daltonizationcolorfilter)>| Yes| Yes| Daltonization filter. | | contentTimeout | [Config](#config)\| Yes| Yes| Recommended duration for content display. The value ranges from 0 to 5000, in milliseconds.| | animationOff | [Config](#config)\| Yes| Yes| Whether to enable animation.| | brightnessDiscount | [Config](#config)\| Yes| Yes| Brightness discount. The value ranges from 0 to 1.0.| @@ -163,7 +163,7 @@ Adds a listener for changes in the list of enabled accessibility extension abili | Name| Type| Mandatory| Description| | -------- | -------- | -------- | -------- | -| type | string | Yes| Listening type. The value is fixed at **'enableAbilityListsStateChanged'**, indicating that the changes in the list of enabled accessibility extension abilities.| +| type | string | Yes| Listening type. The value is fixed at **'enableAbilityListsStateChanged'**, indicating the changes in the list of enabled accessibility extension abilities. | | callback | Callback<void> | Yes| Callback invoked when the list of enabled accessibility extension abilities changes.| **Example** @@ -186,7 +186,7 @@ Cancels the listener for changes in the list of enabled accessibility extension | Name| Type| Mandatory| Description| | -------- | -------- | -------- | -------- | -| type | string | No| Listening type. The value is fixed at **'enableAbilityListsStateChanged'**, indicating that the changes in the list of enabled accessibility extension abilities.| +| type | string | No| Listening type. The value is fixed at **'enableAbilityListsStateChanged'**, indicating the changes in the list of enabled accessibility extension abilities. | | callback | Callback<void> | No| Callback invoked when the list of enabled accessibility extension abilities changes.| **Example** diff --git a/en/application-dev/reference/apis/js-apis-accessibility-extension-context.md b/en/application-dev/reference/apis/js-apis-accessibility-extension-context.md index 6a592ba663ec3723884fd0f44fef90a733230fa7..9fee7500eae2ec8435f0c3bdc2b48c986b14686a 100644 --- a/en/application-dev/reference/apis/js-apis-accessibility-extension-context.md +++ b/en/application-dev/reference/apis/js-apis-accessibility-extension-context.md @@ -34,13 +34,13 @@ Enumerates the focus directions. | up | Search for the next focusable item above the current item in focus.| | down | Search for the next focusable item below the current item in focus.| | left | Search for the next focusable item on the left of the current item in focus.| -| right | Search for the next focusable item on the right the current item in focus.| +| right | Search for the next focusable item on the right of the current item in focus.| | forward | Search for the next focusable item before the current item in focus.| | backward | Search for the next focusable item after the current item in focus.| ## FocusType -Enumerates of the focus types. +Enumerates the focus types. **System capability**: SystemCapability.BarrierFree.Accessibility.Core @@ -55,8 +55,6 @@ Defines a rectangle. **System capability**: SystemCapability.BarrierFree.Accessibility.Core -**Parameters** - | Name | Type | Readable | Writable | Description | | ------ | ------ | ---- | ---- | --------- | | left | number | Yes | No | Left boundary of the rectangle.| @@ -75,35 +73,9 @@ Enumerates the window types. | application | Application window.| | system | System window.| -## AccessibilityExtensionContext.setEventTypeFilter - -setEventTypeFilter(type: Array): Promise\; - -Sets the concerned event type. - -**System capability**: SystemCapability.BarrierFree.Accessibility.Core - -**Parameters** - -| Name | Type | Mandatory | Description | -| ---- | ---------------------------------------- | ---- | -------- | -| type | Array<[EventType](js-apis-accessibility.md#EventType)> | Yes | Event type.| - -**Return value** - -| Type | Description | -| ---------------------- | --------------------- | -| Promise<boolean> | Promise used to return the result.| - -**Example** - -```ts -this.context.setEventTypeFilter(['click', 'longClick']); -``` - ## AccessibilityExtensionContext.setTargetBundleName -setTargetBundleName(targetNames: Array\): Promise\; +setTargetBundleName(targetNames: Array\): Promise\; Sets the concerned target bundle. @@ -139,7 +111,7 @@ Obtains the focus element. | Name | Type | Mandatory | Description | | -------------------- | ------- | ---- | ------------------- | -| isAccessibilityFocus | boolean | No | Whether the obtained focus element is an accessibility focus. The default value is false.| +| isAccessibilityFocus | boolean | No | Whether the obtained focus element is an accessibility focus. The default value is **false**.| **Return value** @@ -213,7 +185,7 @@ this.context.getWindows().then(windows => { ## AccessibilityExtensionContext.injectGesture -injectGesture(gesturePath: GesturePath, listener: Callback\): Promise\): void Injects a gesture. @@ -224,13 +196,7 @@ Injects a gesture. | Name | Type | Mandatory | Description | | ----------- | ---------------------------------------- | ---- | -------------- | | gesturePath | [GesturePath](js-apis-application-AccessibilityExtensionAbility.md#GesturePath) | Yes | Path of the gesture to inject. | -| listener | Callback<boolean> | Yes | Callback used to return the result.| - -**Return value** - -| Type | Description | -| ---------------------- | ---------------------- | -| Promise<boolean> | Promise used to return the result.| +| callback | AsyncCallback<void> | Yes | Callback used to return the result.| **Example** @@ -244,3 +210,170 @@ this.context.gestureInject(gesturePath, (result) => { console.info('gestureInject result: ' + result); }) ``` +## AccessibilityElement.attributeNames + +attributeNames\(): Promise\>; + +Obtains all attribute names of this element. + +**System capability**: SystemCapability.BarrierFree.Accessibility.Core + +**Return value** + +| Type | Description | +| ---------------------------------------- | ------------------------ | +| Promise<Array<T>> | Promise used to return all attribute names of the element.| + +**Example** + +```ts +let accessibilityElement; +try { + accessibilityElement.attributeNames().then((values) => { + console.log("get attribute names success"); + }).catch((err) => { + console.log("get attribute names err: " + JSON.stringify(err)); + }); +} catch (e) { + console.log("An unexpected error occurred. Error:" + e); +} +``` + +## AccessibilityElement.attributeValue + +attributeValue\(attributeName: T): Promise\; + +Obtains the attribute value based on an attribute name. + +**System capability**: SystemCapability.BarrierFree.Accessibility.Core + +**Parameters** + +| Name | Type | Mandatory | Description | +| ----------- | ---------------------------------------- | ---- | -------------- | +| attributeName | T | Yes | Attribute name. | + +**Return value** + +| Type | Description | +| ---------------------------------------- | ------------------------ | +| Promise<Array<ElementAttributeValues[T]>> | Promise used to return the attribute value.| + +**Example** + +```ts +let accessibilityElement; +try { + let attributeName = 'name'; + accessibilityElement.attributeValue(attributeName).then((value) => { + console.log("get attribute value by name success"); + }).catch((err) => { + console.log("get attribute value by name err: " + JSON.stringify(err)); + }); +} catch (e) { + console.log("An unexpected error occurred. Error:" + e); +} +``` + +## AccessibilityElement.actionNames + +actionNames(): Promise\>; + +Obtains the names of all actions supported by this element. + +**System capability**: SystemCapability.BarrierFree.Accessibility.Core + +**Return value** + +| Type | Description | +| ---------------------------------------- | ------------------------ | +| Promise<Array<string>> | Promise used to return the names of all actions supported by the element.| + +**Example** + +```ts +let accessibilityElement; +try { + accessibilityElement.actionNames().then((values) => { + console.log("get action names success"); + }).catch((err) => { + console.log("get action names err: " + JSON.stringify(err)); + }); +} catch (e) { + console.log("An unexpected error occurred. Error:" + e); +} +``` + +## AccessibilityElement.performAction + +performAction(actionName: string, parameters?: object): Promise\; + +Performs an action based on the specified action name. + +**System capability**: SystemCapability.BarrierFree.Accessibility.Core + +**Parameters** + +| Name | Type | Mandatory | Description | +| ----------- | ---------------------------------------- | ---- | -------------- | +| actionName | string | Yes | Action name. | +| parameters | object | No | Parameter required for performing the target action. | + +**Return value** + +| Type | Description | +| ---------------------------------------- | ------------------------ | +| Promise<Array<boolean>> | Promise used to return the result.| + +**Example** + +```ts +let accessibilityElement; +try { + + accessibilityElement.performAction('action').then((result) => { + console.info('perform action result: ' + result); + }).catch((err) => { + console.log("perform action err: " + JSON.stringify(err)); + }); +} catch (e) { + console.log("An unexpected error occurred. Error:" + e); +} +``` + +## AccessibilityElement.findElement + +findElement(type: 'content', condition: string): Promise\>; + +Queries the information about this element based on the specified information type and condition. + +**System capability**: SystemCapability.BarrierFree.Accessibility.Core + +**Parameters** + +| Name | Type | Mandatory | Description | +| ----------- | ---------------------------------------- | ---- | -------------- | +| type | string | Yes | Information type. The value is fixed at **'content'**. | +| condition | string | Yes | Search criteria. | + +**Return value** + +| Type | Description | +| ---------------------------------------- | ------------------------ | +| Promise<Array<T>> | Promise used to return the result.| + +**Example** + +```ts +let accessibilityElement; +try { + let condition = 'keyword'; + accessibilityElement.findElement('content', condition).then((values) => { + console.log("find element success"); + }).catch((err) => { + console.log("find element err: " + JSON.stringify(err)); + }); +} catch (e) { + console.log("An unexpected error occurred. Error:" + e); +} +``` diff --git a/en/application-dev/reference/apis/js-apis-device-info.md b/en/application-dev/reference/apis/js-apis-device-info.md index a1e16d5e0b970a82d9b4e866eb053cb014ced89f..46a110814dc474f66393135a91313ab5df03b98e 100644 --- a/en/application-dev/reference/apis/js-apis-device-info.md +++ b/en/application-dev/reference/apis/js-apis-device-info.md @@ -1,5 +1,7 @@ # Device Information +The **deviceInfo** module provides product information. + > **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. diff --git a/en/application-dev/ui/ts-component-based-builder.md b/en/application-dev/ui/ts-component-based-builder.md index d626bde6074c5e3db373a00f3a78bf6e554cf46f..318f248e6272400a035e01ca804965f0ca42738c 100644 --- a/en/application-dev/ui/ts-component-based-builder.md +++ b/en/application-dev/ui/ts-component-based-builder.md @@ -1,15 +1,43 @@ # @Builder -The **@Builder** decorated method is used to define the declarative UI description of a component and quickly generate multiple layouts in a custom component. The functionality and syntax of the **@Builder** decorator are the same as those of the [build Function](ts-function-build.md). +The **@Builder** decorated method is used to define the declarative UI description of a component and quickly generate multiple layouts in a custom component. If a custom component is used in the **@Builder** decorated method, this component will be re-created each time the method is invoked. The functionality and syntax of the **@Builder** decorator are the same as those of the **build** function. ```ts // xxx.ets + +@Component +struct CompB { + @State CompValue: string = ''; + + aboutToAppear() { + console.info('CompB aboutToAppear.'); + } + + aboutToDisappear() { + console.info('CompB aboutToDisappear.'); + } + + build() { + Column() { + Button(this.CompValue); + } + } +} + @Entry @Component struct CompA { - size1 : number = 100; + size1: number = 100; + @State CompValue1: string = "Hello,CompValue1"; + @State CompValue2: string = "Hello,CompValue2"; + @State CompValue3: string = "Hello,CompValue3"; + + // Use a custom component in the @Builder decorated method. + @Builder CompC(value: string) { + CompB({ CompValue: value }); + } @Builder SquareText(label: string) { Text(label) @@ -35,7 +63,16 @@ struct CompA { } .width(2 * this.size1) .height(1 * this.size1) + this.RowOfSquareTexts("C", "D") + Column() { + // Use the custom component in the @Builder decorated method three times. + this.CompC(this.CompValue1); + this.CompC(this.CompValue2); + this.CompC(this.CompValue3); + } + .width(2 * this.size1) + .height(2 * this.size1) } .width(2 * this.size1) .height(2 * this.size1) @@ -99,7 +136,7 @@ struct CustomContainerUser { } ``` ### Component Initialization Through Trailing Closure -In a custom component, use the **@BuilderParam** decorated attribute to receive a trailing closure. When the custom component is initialized, the component name is followed by a pair of braces ({}) to form a trailing closure (`CustomComponent(){}`). You can consider a trailing closure as a container and add content to it. For example, you can add a component (`{Column(){Text("content")}`) to a trailing closure. The syntax of the closure is the same as that of [build](../ui/ts-function-build.md). In this scenario, the custom component has one and only one **@BuilderParam** decorated attribute. +In a custom component, use the **@BuilderParam** decorated attribute to receive a trailing closure. When the custom component is initialized, the component name is followed by a pair of braces ({}) to form a trailing closure (`CustomComponent(){}`). You can consider a trailing closure as a container and add content to it. For example, you can add a component (`{Column(){Text("content")}`) to a trailing closure. The syntax of the closure is the same as that of the **build** function. In this scenario, the custom component has one and only one **@BuilderParam** decorated attribute. Example: Add a **\** component and a click event to the closure, and call the **specificParam** method decorated by **@Builder** in the new **\** component. After the **\** component is clicked, the value of the component's `header` attribute will change to `changeHeader`. In addition, when the component is initialized, the content of the trailing closure will be assigned to the `closer` attribute decorated by **@BuilderParam**. ```ts