Skip to content

D
Docs

OpenHarmony / Docs
大约 2 年 前同步成功

通知 161
Star 293
Fork 28
D
Docs
未验证 提交 528ea754 编写于 作者: O openharmony_ci 提交者： Gitee
浏览文件
操作

!20605 【4.0-Beta1】翻译完成 19442+20062+20080+20479+19504+19535+19634+19652 

Merge pull request !20605 from ester.zhou/C4-20080
上级 d5bf6f44 f43b38d6
展开全部 隐藏空白更改
内联 并排
Showing with 532 addition and 214 deletion
en/application-dev/application-models/js-ui-widget-development.md
浏览文件 @ 528ea754
...@@ -16,13 +16,13 @@ The widget host consists of the following modules: ...@@ -16,13 +16,13 @@ The widget host consists of the following modules:
- Widget usage: provides operations such as creating, deleting, or updating a widget. - Widget usage: provides operations such as creating, deleting, or updating a widget.
- Communication adapter: provided by the OpenHarmony SDK for communication with the Widget Manager. It sends widget-related operations to the Widget Manager. - Communication adapter: provided by the SDK for communication with the Widget Manager. It sends widget-related operations to the Widget Manager.
The Widget Manager consists of the following modules: The Widget Manager consists of the following modules:
- Periodic updater: starts a scheduled task based on the update policy to periodically update a widget after it is added to the Widget Manager. - Periodic updater: starts a scheduled task based on the update policy to periodically update a widget after it is added to the Widget Manager.
- Cache manager: caches view information of a widget after it is added to the Widget Manager to directly return the cached data when the widget is obtained next time. This reduces the latency greatly. - Cache manager: caches view information of a widget after it is added to the Widget Manager. This enables the cached data to be directly returned when the widget is obtained next time, greatly reducing the latency.
- Lifecycle manager: suspends update when a widget is switched to the background or is blocked, and updates and/or clears widget data during upgrade and deletion. - Lifecycle manager: suspends update when a widget is switched to the background or is blocked, and updates and/or clears widget data during upgrade and deletion.
...@@ -36,9 +36,10 @@ The widget provider consists of the following modules: ...@@ -36,9 +36,10 @@ The widget provider consists of the following modules:
- Instance manager: implemented by the widget provider developer for persistent management of widget instances allocated by the Widget Manager. - Instance manager: implemented by the widget provider developer for persistent management of widget instances allocated by the Widget Manager.
- Communication adapter: provided by the OpenHarmony SDK for communication with the Widget Manager. It pushes update data to the Widget Manager. - Communication adapter: provided by the SDK for communication with the Widget Manager. It pushes update data to the Widget Manager.
> **NOTE** > **NOTE**
>
> You only need to develop the widget provider. The system automatically handles the work of the widget host and Widget Manager. > You only need to develop the widget provider. The system automatically handles the work of the widget host and Widget Manager.
...@@ -48,14 +49,14 @@ The **FormExtensionAbility** class has the following APIs. For details, see [For ...@@ -48,14 +49,14 @@ The **FormExtensionAbility** class has the following APIs. For details, see [For
| Name| Description| | Name| Description|
| -------- | -------- | | -------- | -------- |
| onAddForm(want: Want): formBindingData.FormBindingData | Called to notify the widget provider that a widget has been created.| | onAddForm(want: Want): formBindingData.FormBindingData | Called to notify the widget provider that a widget is being created.|
| onCastToNormalForm(formId: string): void | Called to notify the widget provider that a temporary widget has been converted to a normal one.| | onCastToNormalForm(formId: string): void | Called to notify the widget provider that a temporary widget is being converted to a normal one.|
| onUpdateForm(formId: string): void | Called to notify the widget provider that a widget has been updated.| | onUpdateForm(formId: string): void | Called to notify the widget provider that a widget is being updated.|
| onChangeFormVisibility(newStatus: { [key: string]: number }): void | Called to notify the widget provider of the change in widget visibility.| | onChangeFormVisibility(newStatus: { [key: string]: number }): void | Called to notify the widget provider that the widget visibility status is being changed.|
| onFormEvent(formId: string, message: string): void | Called to instruct the widget provider to receive and process a widget event.| | onFormEvent(formId: string, message: string): void | Called to instruct the widget provider to process a widget event.|
| onRemoveForm(formId: string): void | Called to notify the widget provider that a widget has been destroyed.| | onRemoveForm(formId: string): void | Called to notify the widget provider that a widget is being destroyed.|
| onConfigurationUpdate(config: Configuration): void | Called when the configuration of the environment where the widget is running is updated.| | onConfigurationUpdate(config: Configuration): void | Called when the configuration of the environment where the widget is running is being updated.|
| onShareForm?(formId: string): { [key: string]: any } | Called by the widget provider to receive shared widget data.| | onShareForm?(formId: string): { [key: string]: any } | Called to notify the widget provider that the widget host is sharing the widget data.|
The **FormProvider** class has the following APIs. For details, see [FormProvider](../reference/apis/js-apis-app-form-formProvider.md). The **FormProvider** class has the following APIs. For details, see [FormProvider](../reference/apis/js-apis-app-form-formProvider.md).
...@@ -81,9 +82,9 @@ The widget provider development based on the [stage model](stage-model-developme ...@@ -81,9 +82,9 @@ The widget provider development based on the [stage model](stage-model-developme
- [Configuring the Widget Configuration Files](#configuring-the-widget-configuration-files): Configure the application configuration file **module.json5** and profile configuration file. - [Configuring the Widget Configuration Files](#configuring-the-widget-configuration-files): Configure the application configuration file **module.json5** and profile configuration file.
- [Persistently Storing Widget Data](#persistently-storing-widget-data): This operation is a form of widget data exchange. - [Persistently Storing Widget Data](#persistently-storing-widget-data): Manage widget data persistence.
- [Updating Widget Data](#updating-widget-data): Call **updateForm()** to update the information displayed on a widget. - [Updating Widget Data](#updating-widget-data): Call **updateForm()** to update the information displayed in a widget.
- [Developing the Widget UI Page](#developing-the-widget-ui-page): Use HML+CSS+JSON to develop a JS widget UI page. - [Developing the Widget UI Page](#developing-the-widget-ui-page): Use HML+CSS+JSON to develop a JS widget UI page.
...@@ -92,7 +93,7 @@ The widget provider development based on the [stage model](stage-model-developme ...@@ -92,7 +93,7 @@ The widget provider development based on the [stage model](stage-model-developme
### Creating a FormExtensionAbility Instance ### Creating a FormExtensionAbility Instance
To create a widget in the stage model, implement the lifecycle callbacks of **FormExtensionAbility**. Generate a widget template by referring to [Developing a Service Widget](https://developer.harmonyos.com/en/docs/documentation/doc-guides/ohos-development-service-widget-0000001263280425). To create a widget in the stage model, you need to implement the lifecycle callbacks of FormExtensionAbility. Generate a widget template and then perform the following:
1. Import related modules to **EntryFormAbility.ts**. 1. Import related modules to **EntryFormAbility.ts**.
...@@ -102,7 +103,7 @@ To create a widget in the stage model, implement the lifecycle callbacks of **Fo ...@@ -102,7 +103,7 @@ To create a widget in the stage model, implement the lifecycle callbacks of **Fo
import formBindingData from '@ohos.app.form.formBindingData'; import formBindingData from '@ohos.app.form.formBindingData';
import formInfo from '@ohos.app.form.formInfo'; import formInfo from '@ohos.app.form.formInfo';
import formProvider from '@ohos.app.form.formProvider'; import formProvider from '@ohos.app.form.formProvider';
import dataStorage from '@ohos.data.storage'; import dataPreferences from '@ohos.data.preferences';
``` ```
2. Implement the FormExtension lifecycle callbacks in **EntryFormAbility.ts**. 2. Implement the FormExtension lifecycle callbacks in **EntryFormAbility.ts**.
...@@ -121,7 +122,7 @@ To create a widget in the stage model, implement the lifecycle callbacks of **Fo ...@@ -121,7 +122,7 @@ To create a widget in the stage model, implement the lifecycle callbacks of **Fo
return formData; return formData;
} }
onCastToNormalForm(formId) { onCastToNormalForm(formId) {
// Called when the widget host converts the temporary widget into a normal one. The widget provider should do something to respond to the conversion. // Called when a temporary widget is being converted into a normal one. The widget provider should respond to the conversion.
console.info('[EntryFormAbility] onCastToNormalForm'); console.info('[EntryFormAbility] onCastToNormalForm');
} }
onUpdateForm(formId) { onUpdateForm(formId) {
...@@ -158,6 +159,7 @@ To create a widget in the stage model, implement the lifecycle callbacks of **Fo ...@@ -158,6 +159,7 @@ To create a widget in the stage model, implement the lifecycle callbacks of **Fo
``` ```
> **NOTE** > **NOTE**
>
> FormExtensionAbility cannot reside in the background. Therefore, continuous tasks cannot be processed in the widget lifecycle callbacks. > FormExtensionAbility cannot reside in the background. Therefore, continuous tasks cannot be processed in the widget lifecycle callbacks.
...@@ -190,7 +192,7 @@ To create a widget in the stage model, implement the lifecycle callbacks of **Fo ...@@ -190,7 +192,7 @@ To create a widget in the stage model, implement the lifecycle callbacks of **Fo
} }
``` ```
2. Configure the widget configuration information. In the **metadata** configuration item of FormExtensionAbility, you can specify the resource index of specific configuration information of the widget. For example, if resource is set to **$profile:form_config**, **form_config.json** in the **resources/base/profile/** directory of the development view is used as the profile configuration file of the widget. The following table describes the internal field structure. 2. Configure the widget configuration information. In the **metadata** configuration item of FormExtensionAbility, you can specify the resource index of specific configuration information of the widget. For example, if **resource** is set to **$profile:form_config**, **form_config.json** in the **resources/base/profile/** directory of the development view is used as the profile configuration file of the widget. The following table describes the internal structure of the profile configuration file.
**Table 1** Widget profile configuration file **Table 1** Widget profile configuration file
...@@ -204,7 +206,7 @@ To create a widget in the stage model, implement the lifecycle callbacks of **Fo ...@@ -204,7 +206,7 @@ To create a widget in the stage model, implement the lifecycle callbacks of **Fo
| colorMode | Color mode of the widget.<br>- **auto**: auto-adaptive color mode<br>- **dark**: dark color mode<br>- **light**: light color mode| String| Yes (initial value: **auto**)| | colorMode | Color mode of the widget.<br>- **auto**: auto-adaptive color mode<br>- **dark**: dark color mode<br>- **light**: light color mode| String| Yes (initial value: **auto**)|
| supportDimensions | Grid styles supported by the widget.<br>- **1 * 2**: indicates a grid with one row and two columns.<br>- **2 * 2**: indicates a grid with two rows and two columns.<br>- **2 * 4**: indicates a grid with two rows and four columns.<br>- **4 * 4**: indicates a grid with four rows and four columns.| String array| No| | supportDimensions | Grid styles supported by the widget.<br>- **1 * 2**: indicates a grid with one row and two columns.<br>- **2 * 2**: indicates a grid with two rows and two columns.<br>- **2 * 4**: indicates a grid with two rows and four columns.<br>- **4 * 4**: indicates a grid with four rows and four columns.| String array| No|
| defaultDimension | Default grid style of the widget. The value must be available in the **supportDimensions** array of the widget.| String| No| | defaultDimension | Default grid style of the widget. The value must be available in the **supportDimensions** array of the widget.| String| No|
| updateEnabled | Whether the widget can be updated periodically.<br>- **true**: The widget can be updated at a specified interval (**updateDuration**) or at the scheduled time (**scheduledUpdateTime**). **updateDuration** takes precedence over **scheduledUpdateTime**.<br>- **false**: The widget cannot be updated periodically.| Boolean| No| | updateEnabled | Whether the widget can be updated periodically.<br>- **true**: The widget can be updated at a specified interval (**updateDuration**) or at the scheduled time (**scheduledUpdateTime**). **updateDuration** takes precedence over **scheduledUpdateTime**. If both are specified, the value specified by **updateDuration** is used.<br>- **false**: The widget cannot be updated periodically.| Boolean| No|
| scheduledUpdateTime | Scheduled time to update the widget. The value is in 24-hour format and accurate to minute.<br>**updateDuration** takes precedence over **scheduledUpdateTime**. If both are specified, the value specified by **updateDuration** is used.| String| Yes (initial value: **0:0**)| | scheduledUpdateTime | Scheduled time to update the widget. The value is in 24-hour format and accurate to minute.<br>**updateDuration** takes precedence over **scheduledUpdateTime**. If both are specified, the value specified by **updateDuration** is used.| String| Yes (initial value: **0:0**)|
| updateDuration | Interval to update the widget. The value is a natural number, in the unit of 30 minutes.<br>If the value is **0**, this field does not take effect.<br>If the value is a positive integer *N*, the interval is calculated by multiplying *N* and 30 minutes.<br>**updateDuration** takes precedence over **scheduledUpdateTime**. If both are specified, the value specified by **updateDuration** is used.| Number| Yes (initial value: **0**)| | updateDuration | Interval to update the widget. The value is a natural number, in the unit of 30 minutes.<br>If the value is **0**, this field does not take effect.<br>If the value is a positive integer *N*, the interval is calculated by multiplying *N* and 30 minutes.<br>**updateDuration** takes precedence over **scheduledUpdateTime**. If both are specified, the value specified by **updateDuration** is used.| Number| Yes (initial value: **0**)|
| formConfigAbility | Link to a specific page of the application. The value is a URI.| String| Yes (initial value: left empty)| | formConfigAbility | Link to a specific page of the application. The value is a URI.| String| Yes (initial value: left empty)|
...@@ -255,7 +257,7 @@ async function storeFormInfo(formId: string, formName: string, tempFlag: boolean ...@@ -255,7 +257,7 @@ async function storeFormInfo(formId: string, formName: string, tempFlag: boolean
"updateCount": 0 "updateCount": 0
}; };
try { try {
const storage = await dataStorage.getStorage(DATA_STORAGE_PATH); const storage = await dataPreferences.getPreferences(this.context, DATA_STORAGE_PATH);
// put form info // put form info
await storage.put(formId, JSON.stringify(formInfo)); await storage.put(formId, JSON.stringify(formInfo));
console.info(`[EntryFormAbility] storeFormInfo, put form info successfully, formId: ${formId}`); console.info(`[EntryFormAbility] storeFormInfo, put form info successfully, formId: ${formId}`);
...@@ -294,8 +296,8 @@ You should override **onRemoveForm** to implement widget data deletion. ...@@ -294,8 +296,8 @@ You should override **onRemoveForm** to implement widget data deletion.
const DATA_STORAGE_PATH = "/data/storage/el2/base/haps/form_store"; const DATA_STORAGE_PATH = "/data/storage/el2/base/haps/form_store";
async function deleteFormInfo(formId: string) { async function deleteFormInfo(formId: string) {
try { try {
const storage = await dataStorage.getStorage(DATA_STORAGE_PATH); const storage = await dataPreferences.getPreferences(this.context, DATA_STORAGE_PATH);
// del form info // Delete the widget information.
await storage.delete(formId); await storage.delete(formId);
console.info(`[EntryFormAbility] deleteFormInfo, del form info successfully, formId: ${formId}`); console.info(`[EntryFormAbility] deleteFormInfo, del form info successfully, formId: ${formId}`);
await storage.flush(); await storage.flush();
...@@ -317,7 +319,7 @@ export default class EntryFormAbility extends FormExtension { ...@@ -317,7 +319,7 @@ export default class EntryFormAbility extends FormExtension {
} }
``` ```
For details about how to implement persistent data storage, see [Persisting Preferences Data](../database/data-persistence-by-preferences.md). For details about how to implement persistent data storage, see [Application Data Persistence](../database/app-data-persistence-overview.md).
The **Want** object passed in by the widget host to the widget provider contains a flag that specifies whether the requested widget is normal or temporary. The **Want** object passed in by the widget host to the widget provider contains a flag that specifies whether the requested widget is normal or temporary.
...@@ -449,14 +451,14 @@ The key steps are as follows: ...@@ -449,14 +451,14 @@ The key steps are as follows:
- **action**: **"router"**, which indicates a router event. - **action**: **"router"**, which indicates a router event.
- **abilityName**: name of the UIAbility to redirect to (PageAbility component in the FA model and UIAbility component in the stage model). For example, the default UIAbility name of the stage model created by DevEco Studio is EntryAbility. - **abilityName**: name of the UIAbility to redirect to (PageAbility component in the FA model and UIAbility component in the stage model). For example, the default UIAbility name of the stage model created by DevEco Studio is EntryAbility.
- **params**: custom parameters passed to the target UIAbility. Set them as required. The value can be obtained from **parameters** in **want** used for starting the target UIAbility. For example, in the lifecycle function **onCreate** of the main ability in the stage model, you can obtain **want** and its **parameters** field. - **params**: custom parameters passed to the target UIAbility. Set them as required. The value can be obtained from **parameters** in **want** used for starting the target UIAbility. For example, in the lifecycle function **onCreate** of the MainAbility in the stage model, you can obtain **want** and its **parameters** field.
3. Set the message event. 3. Set the message event.
- **action**: **"message"**, which indicates a message event. - **action**: **"message"**, which indicates a message event.
- **params**: custom parameters of the message event. Set them as required. The value can be obtained from **message** in the widget lifecycle function **onFormEvent()**. - **params**: custom parameters of the message event. Set them as required. The value can be obtained from **message** in the widget lifecycle function **onFormEvent()**.
The following is an example: The following are examples:
- HML file: - HML file:
...@@ -545,7 +547,7 @@ The following is an example: ...@@ -545,7 +547,7 @@ The following is an example:
} }
``` ```
- Receive the router event and obtain parameters in UIAbility. - Receive the router event in UIAbility and obtain parameters.
```ts ```ts
......
en/application-dev/reference/apis/js-apis-arkui-componentSnapshot.md
浏览文件 @ 528ea754
...@@ -34,6 +34,12 @@ Obtains the snapshot of a component that has been loaded. This API uses an async ...@@ -34,6 +34,12 @@ Obtains the snapshot of a component that has been loaded. This API uses an async
| id | string | Yes | [ID](../arkui-ts/ts-universal-attributes-component-id.md) of the target component.| | id | string | Yes | [ID](../arkui-ts/ts-universal-attributes-component-id.md) of the target component.|
| callback | AsyncCallback&lt;image.PixelMap&gt; | Yes | Callback used to return the result. | | callback | AsyncCallback&lt;image.PixelMap&gt; | Yes | Callback used to return the result. |
**Error codes**
| ID| Error Message |
| -------- | ------------------- |
| 100001 | if id is not valid. |
**Example** **Example**
```js ```js
...@@ -159,6 +165,12 @@ Renders a custom component in the application background and outputs its snapsho ...@@ -159,6 +165,12 @@ Renders a custom component in the application background and outputs its snapsho
| builder | [CustomBuilder](../arkui-ts/ts-types.md#custombuilder8) | Yes | Builder of the custom component.| | builder | [CustomBuilder](../arkui-ts/ts-types.md#custombuilder8) | Yes | Builder of the custom component.|
| callback | AsyncCallback&lt;image.PixelMap&gt; | Yes | Callback used to return the result.| | callback | AsyncCallback&lt;image.PixelMap&gt; | Yes | Callback used to return the result.|
**Error codes**
| ID| Error Message |
| -------- | ----------------------------------------- |
| 100001 | if builder is not a valid build function. |
**Example** **Example**
```ts ```ts
......
en/application-dev/reference/apis/js-apis-font.md
浏览文件 @ 528ea754
...@@ -6,7 +6,6 @@ The **font** module provides APIs for registering custom fonts. ...@@ -6,7 +6,6 @@ The **font** module provides APIs for registering custom fonts.
> >
> 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. > 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.
> >
> The APIs provided by this module are system APIs.
## Modules to Import ## Modules to Import
...@@ -30,12 +29,14 @@ Registers a custom font with the font manager. ...@@ -30,12 +29,14 @@ Registers a custom font with the font manager.
## FontOptions ## FontOptions
**System capability**: SystemCapability.ArkUI.ArkUI.Full
| Name | Type | Mandatory | Description | | Name | Type | Mandatory | Description |
| ---------- | ------ | ---- | ------------ | | ---------- | ------ | ---- | ------------ |
| familyName | string | Yes | Name of the custom font to register. | | familyName | string | Yes | Name of the custom font to register. |
| familySrc | string | Yes | Path of the custom font to register.| | familySrc | string | Yes | Path of the custom font to register.|
## Example **Example**
```ts ```ts
// xxx.ets // xxx.ets
......
en/application-dev/reference/apis/js-apis-matrix4.md
浏览文件 @ 528ea754
...@@ -16,7 +16,7 @@ import matrix4 from '@ohos.matrix4' ...@@ -16,7 +16,7 @@ import matrix4 from '@ohos.matrix4'
## matrix4.init ## matrix4.init
init(option: [number,number,number,number,number,number,number,number,number,number,number,number,number,number,number,number]): Matrix4Transit init(options: [number,number,number,number,number,number,number,number,number,number,number,number,number,number,number,number]): Matrix4Transit
Matrix constructor, which is used to create a 4 x 4 matrix by using the input parameter. Column-major order is used. Matrix constructor, which is used to create a 4 x 4 matrix by using the input parameter. Column-major order is used.
...@@ -27,7 +27,7 @@ Matrix constructor, which is used to create a 4 x 4 matrix by using the input pa ...@@ -27,7 +27,7 @@ Matrix constructor, which is used to create a 4 x 4 matrix by using the input pa
| Name| Type | Mandatory| Description | | Name| Type | Mandatory| Description |
| ------ | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | | ------ | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ |
| option | [number,number,number,number,number,number,number,number,number,number,number,number,number,number,number,number] | Yes | A number array whose length is 16 (4 x 4). For details, see **Description of a 4 x 4 matrix**.<br>Default value:<br>[1, 0, 0, 0,<br>0, 1, 0, 0,<br>0, 0, 1, 0,<br>0, 0, 0, 1] | | option | [number,number,number,number,number,number,number,number,number,number,number,number,number,number,number,number] | Yes | A number array whose length is 16 (4 x 4). For details, see **Description of a 4 x 4 matrix**.<br>Default value:<br>[1,&nbsp;0,&nbsp;0,&nbsp;0,<br>0,&nbsp;1,&nbsp;0,&nbsp;0,<br>0,&nbsp;0,&nbsp;1,&nbsp;0,<br>0,&nbsp;0,&nbsp;0,&nbsp;1] |
**Return value** **Return value**
...@@ -176,7 +176,7 @@ struct Test { ...@@ -176,7 +176,7 @@ struct Test {
### combine ### combine
combine(option: Matrix4Transit): Matrix4Transit combine(options: Matrix4Transit): Matrix4Transit
Combines the effects of two matrices to generate a new matrix object. Combines the effects of two matrices to generate a new matrix object.
...@@ -273,7 +273,7 @@ struct Tests { ...@@ -273,7 +273,7 @@ struct Tests {
### translate ### translate
translate(option: TranslateOption): Matrix4Transit translate(options: TranslateOption): Matrix4Transit
Translates this matrix object along the x, y, and z axes. Translates this matrix object along the x, y, and z axes.
...@@ -317,7 +317,7 @@ struct Test { ...@@ -317,7 +317,7 @@ struct Test {
### scale ### scale
scale(option: ScaleOption): Matrix4Transit scale(options: ScaleOption): Matrix4Transit
Scales this matrix object along the x, y, and z axes. Scales this matrix object along the x, y, and z axes.
...@@ -362,7 +362,7 @@ struct Test { ...@@ -362,7 +362,7 @@ struct Test {
### rotate ### rotate
rotate(option: RotateOption): Matrix4Transit rotate(options: RotateOption): Matrix4Transit
Rotates this matrix object along the x, y, and z axes. Rotates this matrix object along the x, y, and z axes.
...@@ -408,7 +408,7 @@ struct Test { ...@@ -408,7 +408,7 @@ struct Test {
### transformPoint ### transformPoint
transformPoint(option: [number, number]): [number, number] transformPoint(options: [number, number]): [number, number]
Applies the current transformation effect to a coordinate point. Applies the current transformation effect to a coordinate point.
...@@ -466,15 +466,19 @@ struct Test { ...@@ -466,15 +466,19 @@ struct Test {
## TranslateOption ## TranslateOption
**System capability**: SystemCapability.ArkUI.ArkUI.Full
| Name| Type | Mandatory| Description | | Name| Type | Mandatory| Description |
| ------ | ------ | ---- | ----------------------------------------------------------- | | ---- | ------ | ---- | ----------------------------------------------------------- |
| x | number | No | Translation distance along the x-axis, in px.<br>Default value: **0**<br>Value range: (-∞, +∞)| | x | number | No | Translation distance along the x-axis, in px.<br>Default value: **0**<br>Value range: (-∞, +∞)|
| y | number | No | Translation distance along the y-axis, in px.<br>Default value: **0**<br>Value range: (-∞, +∞)| | y | number | No | Translation distance along the y-axis, in px.<br>Default value: **0**<br>Value range: (-∞, +∞)|
| z | number | No | Translation distance along the z-axis, in px.<br>Default value: **0**<br>Value range: (-∞, +∞)| | z | number | No | Translation distance along the z-axis, in px.<br>Default value: **0**<br>Value range: (-∞, +∞)|
## ScaleOption ## ScaleOption
| Name | Type | Mandatory| Description | **System capability**: SystemCapability.ArkUI.ArkUI.Full
| Name | Type | Mandatory| Description |
| ------- | ------ | ---- | ------------------------------------------------------------ | | ------- | ------ | ---- | ------------------------------------------------------------ |
| x | number | No | Scaling multiple along the x-axis. If the value is greater than 1, the image is scaled up along the x-axis. If the value is less than 1, the image is scaled down along the x-axis.<br>Default value: **1**<br>Value range: [0, +∞)<br>**NOTE**<br>A value less than 0 evaluates to the default value.| | x | number | No | Scaling multiple along the x-axis. If the value is greater than 1, the image is scaled up along the x-axis. If the value is less than 1, the image is scaled down along the x-axis.<br>Default value: **1**<br>Value range: [0, +∞)<br>**NOTE**<br>A value less than 0 evaluates to the default value.|
| y | number | No | Scaling multiple along the y-axis. If the value is greater than 1, the image is scaled up along the y-axis. If the value is less than 1, the image is scaled down along the y-axis.<br>Default value: **1**<br>Value range: [0, +∞)<br>**NOTE**<br>A value less than 0 evaluates to the default value.| | y | number | No | Scaling multiple along the y-axis. If the value is greater than 1, the image is scaled up along the y-axis. If the value is less than 1, the image is scaled down along the y-axis.<br>Default value: **1**<br>Value range: [0, +∞)<br>**NOTE**<br>A value less than 0 evaluates to the default value.|
...@@ -484,7 +488,9 @@ struct Test { ...@@ -484,7 +488,9 @@ struct Test {
## RotateOption ## RotateOption
| Name | Type | Mandatory| Description | **System capability**: SystemCapability.ArkUI.ArkUI.Full
| Name | Type | Mandatory| Description |
| ------- | ------ | ---- | ------------------------------------------------------- | | ------- | ------ | ---- | ------------------------------------------------------- |
| x | number | No | X coordinate of the rotation axis vector.<br>Default value: **1**<br>Value range: (-∞, +∞)| | x | number | No | X coordinate of the rotation axis vector.<br>Default value: **1**<br>Value range: (-∞, +∞)|
| y | number | No | Y coordinate of the rotation axis vector.<br>Default value: **1**<br>Value range: (-∞, +∞)| | y | number | No | Y coordinate of the rotation axis vector.<br>Default value: **1**<br>Value range: (-∞, +∞)|
......
en/application-dev/reference/apis/js-apis-plugincomponent.md
浏览文件 @ 528ea754
...@@ -262,7 +262,7 @@ pluginComponentManager.push( ...@@ -262,7 +262,7 @@ pluginComponentManager.push(
name: "ets/pages/plugin2.js", name: "ets/pages/plugin2.js",
data: { data: {
"js": "ets/pages/plugin.js", "js": "ets/pages/plugin.js",
"key_1": 1111, , "key_1": 1111,
}, },
extraData: { extraData: {
"extra_str": "this is push event" "extra_str": "this is push event"
...@@ -376,10 +376,24 @@ Listens for events of the request type and returns the requested data, or listen ...@@ -376,10 +376,24 @@ Listens for events of the request type and returns the requested data, or listen
| eventType | string | Yes | Type of the event to listen for. The options are as follows:<br>**"push"**: The component provider pushes data to the component consumer.<br>**"request"**: The component consumer proactively requests data from the component provider.| | eventType | string | Yes | Type of the event to listen for. The options are as follows:<br>**"push"**: The component provider pushes data to the component consumer.<br>**"request"**: The component consumer proactively requests data from the component provider.|
| callback | [OnPushEventCallback](#onpusheventcallback)&nbsp;\|&nbsp;[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.| | callback | [OnPushEventCallback](#onpusheventcallback)&nbsp;\|&nbsp;[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** **Example**
```js ```js
function onPushListener(source, template, data, extraData) {
console.log("onPushListener template.source=" + template.source)
console.log("onPushListener source=" + JSON.stringify(source))
console.log("onPushListener template=" + JSON.stringify(template))
console.log("onPushListener data=" + JSON.stringify(data))
console.log("onPushListener extraData=" + JSON.stringify(extraData))
}
function onRequestListener(source, name, data) {
console.error("onRequestListener");
console.log("onRequestListener source=" + JSON.stringify(source));
console.log("onRequestListener name=" + name);
console.log("onRequestListener data=" + JSON.stringify(data));
return { template: "ets/pages/plugin.js", data: data };
}
pluginComponentManager.on("push", onPushListener) pluginComponentManager.on("push", onPushListener)
pluginComponentManager.on("request", onRequestListener) pluginComponentManager.on("request", onRequestListener)
``` ```
......
en/application-dev/reference/apis/js-apis-router.md
浏览文件 @ 528ea754
...@@ -671,7 +671,7 @@ struct Second { ...@@ -671,7 +671,7 @@ struct Second {
Text(this.text) Text(this.text)
.fontSize(30) .fontSize(30)
.onClick(() => { .onClick(() => {
this.secondData = (this.data.['array'][1]).toString() this.secondData = (this.data['array'][1]).toString()
}) })
.margin({ top: 20 }) .margin({ top: 20 })
Text(`This is the data passed from the first page: ${this.secondData}`) Text(`This is the data passed from the first page: ${this.secondData}`)
......
en/application-dev/reference/apis/js-apis-uitest.md
浏览文件 @ 528ea754
...@@ -8,9 +8,9 @@ This module provides the following functions: ...@@ -8,9 +8,9 @@ This module provides the following functions:
- [Component<sup>9+</sup>](#component9): represents a component on the UI and provides APIs for obtaining component attributes, clicking a component, scrolling to search for a component, and text injection. - [Component<sup>9+</sup>](#component9): represents a component on the UI and provides APIs for obtaining component attributes, clicking a component, scrolling to search for a component, and text injection.
- [Driver<sup>9+</sup>](#driver9): works as the entry class and provides APIs for features such as component matching/search, key injection, coordinate clicking/sliding, and screenshot. - [Driver<sup>9+</sup>](#driver9): works as the entry class and provides APIs for features such as component matching/search, key injection, coordinate clicking/sliding, and screenshot.
- [UiWindow<sup>9+</sup>](#uiwindow9): works as the entry class and provides APIs for obtaining window attributes, dragging windows, and adjusting window sizes. - [UiWindow<sup>9+</sup>](#uiwindow9): works as the entry class and provides APIs for obtaining window attributes, dragging windows, and adjusting window sizes.
- [By<sup>(deprecated)</sup>](#bydeprecated): provides UI component feature description APIs for component filtering and matching. This API is deprecated since API version 9. You are advised to use [On<sup>9+</sup>](#on9) instead. - [By<sup>(deprecated)</sup>](#bydeprecated): provides UI component feature description APIs for component filtering and matching. This class is deprecated since API version 9. You are advised to use [On<sup>9+</sup>](#on9) instead.
- [UiComponent<sup>(deprecated)</sup>](#uicomponentdeprecated): represents a component on the UI and provides APIs for obtaining component attributes, clicking a component, scrolling to search for a component, and text injection. This API is deprecated since API version 9. You are advised to use [Component<sup>9+</sup>](#component9) instead. - [UiComponent<sup>(deprecated)</sup>](#uicomponentdeprecated): represents a component on the UI and provides APIs for obtaining component attributes, clicking a component, scrolling to search for a component, and text injection. This class is deprecated since API version 9. You are advised to use [Component<sup>9+</sup>](#component9) instead.
- [UiDriver<sup>(deprecated)</sup>](#uidriverdeprecated): works as the entry class and provides APIs for features such as component matching/search, key injection, coordinate clicking/sliding, and screenshot. This API is deprecated since API version 9. You are advised to use [Driver<sup>9+</sup>](#driver9) instead. - [UiDriver<sup>(deprecated)</sup>](#uidriverdeprecated): works as the entry class and provides APIs for features such as component matching/search, key injection, coordinate clicking/sliding, and screenshot. This class is deprecated since API version 9. You are advised to use [Driver<sup>9+</sup>](#driver9) instead.
>**NOTE** >**NOTE**
> >
...@@ -160,10 +160,8 @@ Since API version 9, the UiTest framework provides a wide range of UI component ...@@ -160,10 +160,8 @@ Since API version 9, the UiTest framework provides a wide range of UI component
The API capabilities provided by the **On** class exhibit the following features: The API capabilities provided by the **On** class exhibit the following features:
- Allow one or more attributes as the match conditions. For example, you can specify both the **text** and **id** attributes to find the target component. - Allow one or more attributes as the match conditions. For example, you can specify both the **text** and **id** attributes to find the target component.
- Provide multiple match patterns for component attributes. - Provide multiple match patterns for component attributes.
- Support absolute positioning and relative positioning for components. APIs such as [ON.isBefore](#isbefore9) and [ON.isAfter](#isafter9) can be used to specify the features of adjacent components to assist positioning.
- Support absolute positioning and relative positioning for components. APIs such as [ON.isBefore](#isbefore9) and [ON.isAfter](#isafter9) can be used to specify the features of adjacent components to assist positioning.
All APIs provided in the **On** class are synchronous. You are advised to use the static constructor **ON** to create an **On** object in chain mode. All APIs provided in the **On** class are synchronous. You are advised to use the static constructor **ON** to create an **On** object in chain mode.
...@@ -1208,7 +1206,7 @@ For details about the error codes, see [UiTest Error Codes](../errorcodes/errorc ...@@ -1208,7 +1206,7 @@ For details about the error codes, see [UiTest Error Codes](../errorcodes/errorc
```js ```js
async function demo() { async function demo() {
let driver = Driver.create(); let driver = Driver.create();
let button = await driver.findComponent(ON.type('Scroll')); let scrollBar = await driver.findComponent(ON.type('Scroll'));
let button = await scrollBar.scrollSearch(ON.text('next page')); let button = await scrollBar.scrollSearch(ON.text('next page'));
} }
``` ```
...@@ -2439,7 +2437,7 @@ For details about the error codes, see [UiTest Error Codes](../errorcodes/errorc ...@@ -2439,7 +2437,7 @@ For details about the error codes, see [UiTest Error Codes](../errorcodes/errorc
```js ```js
async function demo() { async function demo() {
let driver = Driver.create(); let driver = Driver.create();
let obeserver = await driver.createUiEventObserve(); let observer = await driver.createUIEventObserver()
} }
``` ```
...@@ -2950,7 +2948,7 @@ async function demo() { ...@@ -2950,7 +2948,7 @@ async function demo() {
## UIEventObserver<sup>10+</sup> ## UIEventObserver<sup>10+</sup>
UI event listener. Implements a UI event listener.
### once('toastShow') ### once('toastShow')
...@@ -2971,6 +2969,7 @@ Subscribes to events of the toast component. This API uses a callback to return ...@@ -2971,6 +2969,7 @@ Subscribes to events of the toast component. This API uses a callback to return
```js ```js
async function demo() { async function demo() {
let driver = Driver.create();
let observer = await driver.createUIEventObserver() let observer = await driver.createUIEventObserver()
let callback = (UIElementInfo)=>{ let callback = (UIElementInfo)=>{
console.info(UIElementInfo.bundleName) console.info(UIElementInfo.bundleName)
...@@ -3000,6 +2999,7 @@ Subscribes to events of the dialog component. This API uses a callback to return ...@@ -3000,6 +2999,7 @@ Subscribes to events of the dialog component. This API uses a callback to return
```js ```js
async function demo() { async function demo() {
let driver = Driver.create();
let observer = await driver.createUIEventObserver() let observer = await driver.createUIEventObserver()
let callback = (UIElementInfo)=>{ let callback = (UIElementInfo)=>{
console.info(UIElementInfo.bundleName) console.info(UIElementInfo.bundleName)
...@@ -3013,15 +3013,16 @@ async function demo() { ...@@ -3013,15 +3013,16 @@ async function demo() {
## By<sup>(deprecated)</sup> ## By<sup>(deprecated)</sup>
The UiTest framework provides a wide range of UI component feature description APIs in the **By** class to filter and match components. The UiTest framework provides a wide range of UI component feature description APIs in the **By** class to filter and match components.
The API capabilities provided by the **By** class exhibit the following features:
- Allow one or more attributes as the match conditions. For example, you can specify both the **text** and **id** attributes to find the target component. The API capabilities provided by the **By** class exhibit the following features:
- Allow one or more attributes as the match conditions. For example, you can specify both the **text** and **id** attributes to find the target component.
- Provide multiple match patterns for component attributes. - Provide multiple match patterns for component attributes.
- Support absolute positioning and relative positioning for components. APIs such as [By.isBefore<sup>(deprecated)</sup>](#isbeforedeprecated) and [By.isAfter<sup>(deprecated)</sup>](#isafterdeprecated) can be used to specify the features of adjacent components to assist positioning. - Support absolute positioning and relative positioning for components. APIs such as [By.isBefore<sup>(deprecated)</sup>](#isbeforedeprecated) and [By.isAfter<sup>(deprecated)</sup>](#isafterdeprecated) can be used to specify the features of adjacent components to assist positioning.
All APIs provided in the **By** class are synchronous. You are advised to use the static constructor **BY** to create a **By** object in chain mode. All APIs provided in the **By** class are synchronous. You are advised to use the static constructor **BY** to create a **By** object in chain mode.
This API is deprecated since API version 9. You are advised to use [On<sup>9+</sup>](#on9) instead. This class is deprecated since API version 9. You are advised to use [On<sup>9+</sup>](#on9) instead.
```js ```js
BY.text('123').type('button'); BY.text('123').type('button');
...@@ -3347,7 +3348,7 @@ In **UiTest**, the **UiComponent** class represents a component on the UI and pr ...@@ -3347,7 +3348,7 @@ In **UiTest**, the **UiComponent** class represents a component on the UI and pr
All APIs provided in this class use a promise to return the result and must be invoked using **await**. All APIs provided in this class use a promise to return the result and must be invoked using **await**.
This API is deprecated since API version 9. You are advised to use [Component<sup>9+</sup>](#component9) instead. This class is deprecated since API version 9. You are advised to use [Component<sup>9+</sup>](#component9) instead.
### click<sup>(deprecated)</sup> ### click<sup>(deprecated)</sup>
...@@ -3729,7 +3730,7 @@ The **UiDriver** class is the main entry to the UiTest framework. It provides AP ...@@ -3729,7 +3730,7 @@ The **UiDriver** class is the main entry to the UiTest framework. It provides AP
All APIs provided by this class, except for **UiDriver.create()**, use a promise to return the result and must be invoked using **await**. All APIs provided by this class, except for **UiDriver.create()**, use a promise to return the result and must be invoked using **await**.
This API is deprecated since API version 9. You are advised to use [Driver<sup>9+</sup>](#driver9) instead. This class is deprecated since API version 9. You are advised to use [Driver<sup>9+</sup>](#driver9) instead.
### create<sup>(deprecated)</sup> ### create<sup>(deprecated)</sup>
......
en/application-dev/reference/arkui-ts/ts-basic-components-text.md
浏览文件 @ 528ea754
...@@ -31,19 +31,19 @@ In addition to the [universal attributes](ts-universal-attributes-size.md) and [ ...@@ -31,19 +31,19 @@ In addition to the [universal attributes](ts-universal-attributes-size.md) and [
| Name | Type | Description | | Name | Type | Description |
| ----------------------- | ----------------------------------- | ------------------------------------------- | | ----------------------- | ----------------------------------- | ------------------------------------------- |
| textAlign | [TextAlign](ts-appendix-enums.md#textalign) | Horizontal alignment mode of the text.<br>Default value: **TextAlign.Start**<br>**NOTE**<br>The text takes up the full width of the **\<Text>** component. To set vertical alignment for the text, use the [align](ts-universal-attributes-location.md) attribute. The **align** attribute alone does not control the horizontal position of the text. In other words, **Alignment.TopStart**, **Alignment.Top**, and **Alignment.TopEnd** produce the same effect, top-aligning the text; **Alignment.Start**, **Alignment.Center**, and **Alignment.End** produce the same effect, centered-aligning the text vertically; **Alignment.BottomStart**, **Alignment.Bottom**, and **Alignment.BottomEnd** produce the same effect, bottom-aligning the text. Yet, it can work with the **textAlign** attribute to jointly determine the horizontal position of the text.<br>Since API version 9, this API is supported in ArkTS widgets.| | textAlign | [TextAlign](ts-appendix-enums.md#textalign) | Horizontal alignment mode of the text.<br>Default value: **TextAlign.Start**<br>**NOTE**<br>The text takes up the full width of the **\<Text>** component. To set vertical alignment for the text, use the [align](ts-universal-attributes-location.md) attribute. The **align** attribute alone does not control the horizontal position of the text. In other words, **Alignment.TopStart**, **Alignment.Top**, and **Alignment.TopEnd** produce the same effect, top-aligning the text; **Alignment.Start**, **Alignment.Center**, and **Alignment.End** produce the same effect, centered-aligning the text vertically; **Alignment.BottomStart**, **Alignment.Bottom**, and **Alignment.BottomEnd** produce the same effect, bottom-aligning the text. Yet, it can work with the **textAlign** attribute to jointly determine the horizontal position of the text.<br>Since API version 9, this API is supported in ArkTS widgets.|
| textOverflow | {overflow: [TextOverflow](ts-appendix-enums.md#textoverflow)} | Display mode when the text is too long.<br>Default value: **{overflow: TextOverflow.Clip}**<br>**NOTE**<br/>Text is clipped at the transition between words. To clip text in the middle of a word, add **\u200B** between characters.<br>If **overflow** is set to **TextOverflow.None**, **TextOverflow.Clip**, or **TextOverflow.Ellipsis**, this attribute must be used with **maxLines**. Otherwise, the setting does not take effect. **TextOverflow.None** produces the same effect as **TextOverflow.Clip**. If **overflow** is set to **TextOverflow.Marquee**, the text scrolls in a line, and neither **maxLines** nor **copyOption** takes effect.<br>Since API version 9, this API is supported in ArkTS widgets.| | textOverflow | {overflow: [TextOverflow](ts-appendix-enums.md#textoverflow)} | Display mode when the text is too long.<br>Default value: **{overflow: TextOverflow.Clip}**<br>**NOTE**<br/>Text is clipped at the transition between words. To clip text in the middle of a word, add **\u200B** between characters.<br>If **overflow** is set to **TextOverflow.None**, **TextOverflow.Clip**, or **TextOverflow.Ellipsis**, this attribute must be used with **maxLines**. Otherwise, the setting does not take effect. **TextOverflow.None** produces the same effect as **TextOverflow.Clip**. If **overflow** is set to **TextOverflow.Marquee**, the text scrolls in a line, and neither **maxLines** nor **copyOption** takes effect.<br>Since API version 9, this API is supported in ArkTS widgets. |
| maxLines | number | Maximum number of lines in the text.<br>Default value: **Infinity**<br>**NOTE**<br/>By default, text is automatically folded. If this attribute is specified, the text will not exceed the specified number of lines. If there is extra text, you can use **textOverflow** to specify how it is displayed.<br>Since API version 9, this API is supported in ArkTS widgets. | | maxLines | number | Maximum number of lines in the text.<br>Default value: **Infinity**<br>**NOTE**<br/>By default, text is automatically folded. If this attribute is specified, the text will not exceed the specified number of lines. If there is extra text, you can use **textOverflow** to specify how it is displayed.<br>Since API version 9, this API is supported in ArkTS widgets. |
| lineHeight | string \| number \| [Resource](ts-types.md#resource) | Text line height. If the value is less than or equal to **0**, the line height is not limited and the font size is adaptive. If the value of the number type, the unit fp is used.<br>Since API version 9, this API is supported in ArkTS widgets.| | lineHeight | string \| number \| [Resource](ts-types.md#resource) | Text line height. If the value is less than or equal to **0**, the line height is not limited and the font size is adaptive. If the value of the number type, the unit fp is used.<br>Since API version 9, this API is supported in ArkTS widgets.|
| decoration | {<br>type: [TextDecorationType](ts-appendix-enums.md#textdecorationtype),<br>color?: [ResourceColor](ts-types.md#resourcecolor)<br>} | Style and color of the text decorative line.<br>Default value: {<br>type: TextDecorationType.None,<br>color: Color.Black<br>} <br>Since API version 9, this API is supported in ArkTS widgets.| | decoration | {<br>type: [TextDecorationType](ts-appendix-enums.md#textdecorationtype),<br>color?: [ResourceColor](ts-types.md#resourcecolor)<br>} | Style and color of the text decorative line.<br>Default value: {<br>type: TextDecorationType.None,<br>color: Color.Black<br>} <br>Since API version 9, this API is supported in ArkTS widgets.|
| baselineOffset | number \| string | Baseline offset of the text. The default value is **0**.<br>Since API version 9, this API is supported in ArkTS widgets.<br>**NOTE**<br/><br>If this attribute is set to a percentage, the default value is used.| | baselineOffset | number \| string | Baseline offset of the text. The default value is **0**.<br>Since API version 9, this API is supported in ArkTS widgets.<br>**NOTE**<br/><br>If this attribute is set to a percentage, the default value is used.|
| letterSpacing | number \| string | Letter spacing.<br>Since API version 9, this API is supported in ArkTS widgets.<br>**NOTE**<br/>If this attribute is set to a percentage, the default value is used.<br> If this attribute is set to a negative value, the letters will overlap each other. | | letterSpacing | number \| string | Letter spacing.<br>Since API version 9, this API is supported in ArkTS widgets.<br>**NOTE**<br/>If this attribute is set to a percentage, the default value is used.<br> If this attribute is set to a negative value, the letters will overlap each other.|
| minFontSize | number \| string \| [Resource](ts-types.md#resource) | Minimum font size.<br>For the setting to take effect, this attribute must be used together with **maxFontSize**, **maxLines**, or layout constraint settings.<br>Since API version 9, this API is supported in ArkTS widgets. | | minFontSize | number \| string \| [Resource](ts-types.md#resource) | Minimum font size.<br>For the setting to take effect, this attribute must be used together with **maxFontSize**, **maxLines**, or layout constraint settings.<br>Since API version 9, this API is supported in ArkTS widgets. |
| maxFontSize | number \| string \| [Resource](ts-types.md#resource) | Maximum font size.<br>For the setting to take effect, this attribute must be used together with **minFontSize**, **maxLines**, or layout constraint settings.<br>Since API version 9, this API is supported in ArkTS widgets. | | maxFontSize | number \| string \| [Resource](ts-types.md#resource) | Maximum font size.<br>For the setting to take effect, this attribute must be used together with **minFontSize**, **maxLines**, or layout constraint settings.<br>Since API version 9, this API is supported in ArkTS widgets. |
| textCase | [TextCase](ts-appendix-enums.md#textcase) | Text case.<br>Default value: **TextCase.Normal**<br>Since API version 9, this API is supported in ArkTS widgets.| | textCase | [TextCase](ts-appendix-enums.md#textcase) | Text case.<br>Default value: **TextCase.Normal**<br>Since API version 9, this API is supported in ArkTS widgets.|
| copyOption<sup>9+</sup> | [CopyOptions](ts-appendix-enums.md#copyoptions9) | Whether copy and paste is allowed.<br>Default value: **CopyOptions.None**<br>This API is supported in ArkTS widgets.| | copyOption<sup>9+</sup> | [CopyOptions](ts-appendix-enums.md#copyoptions9) | Whether copy and paste is allowed.<br>Default value: **CopyOptions.None**<br>This API is supported in ArkTS widgets.|
| draggable<sup>9+</sup> | boolean | Drag effect of the selected text.<br>This attribute cannot be used with the [onDragStart](ts-universal-events-drag-drop.md) event.<br>It must be used with **copyOption** to enable the selected text to be dragged and copied.<br>Default value: **false**| | draggable<sup>(deprecated)</sup> | boolean | Drag effect of the selected text.<br>This attribute cannot be used with the [onDragStart](ts-universal-events-drag-drop.md) event.<br>It must be used with **copyOption** to enable the selected text to be dragged and copied.<br>Default value: **false**<br>**NOTE**<br/>This API is supported since API version 8 and deprecated since API version 10. You are advised to use the universal attribute [draggable](ts-universal-events-drag-drop.md) instead. |
| textShadow<sup>10+</sup> | [ShadowOptions](ts-universal-attributes-image-effect.md#shadowoptions) | Text shadow.| | textShadow<sup>10+</sup> | [ShadowOptions](ts-universal-attributes-image-effect.md#shadowoptions) | Text shadow.|
| heightAdaptivePolicy<sup>10+</sup> | [TextHeightAdaptivePolicy](ts-appendix-enums.md#textheightadaptivepolicy10) | How the adaptive height is determined for the text.<br>Default value: **TextHeightAdaptivePolicy.MAX_LINES_FIRST**<br>**NOTE**<br/>When this attribute is set to **TextHeightAdaptivePolicy.MAX_LINES_FIRST**, the **maxLines** attribute takes precedence for adjusting the text height. If the **maxLines** setting results in a layout beyond the layout constraints, the text will shrink to a font size between `minFontSize` and `maxFontSize` to allow for more content to be shown.<br>When this attribute is set to **TextHeightAdaptivePolicy.MIN_FONT_SIZE_FIRST**, the **minFontSize** attribute takes precedence for adjusting the text height. If the text can fit in one line with the `minFontSize` setting, the text will enlarge to the largest possible font size between `minFontSize` and `maxFontSize`.<br>When this attribute is set to **TextHeightAdaptivePolicy.LAYOUT_CONSTRAINT_FIRST**, the layout constraints take precedence for adjusting the text height. If the resultant layout is beyond the layout constraints, the text will shrink to a font size between `minFontSize` and `maxFontSize` to respect the layout constraints. If the layout still exceeds the layout constraints after the font size is reduced to **minFontSize**, the lines that exceed the layout constraints are deleted. | | heightAdaptivePolicy<sup>10+</sup> | [TextHeightAdaptivePolicy](ts-appendix-enums.md#textheightadaptivepolicy10) | How the adaptive height is determined for the text.<br>Default value: **TextHeightAdaptivePolicy.MAX_LINES_FIRST**<br>**NOTE**<br/>When this attribute is set to **TextHeightAdaptivePolicy.MAX_LINES_FIRST**, the **maxLines** attribute takes precedence for adjusting the text height. If the **maxLines** setting results in a layout beyond the layout constraints, the text will shrink to a font size between `minFontSize` and `maxFontSize` to allow for more content to be shown.<br>When this attribute is set to **TextHeightAdaptivePolicy.MIN_FONT_SIZE_FIRST**, the **minFontSize** attribute takes precedence for adjusting the text height. If the text can fit in one line with the **minFontSize** setting, the text will enlarge to the largest possible font size between **minFontSize** and **maxFontSize**.<br>When this attribute is set to **TextHeightAdaptivePolicy.LAYOUT_CONSTRAINT_FIRST**, the layout constraints take precedence for adjusting the text height. If the resultant layout is beyond the layout constraints, the text will shrink to a font size between **minFontSize** and **maxFontSize** to respect the layout constraints. If the layout still exceeds the layout constraints after the font size is reduced to **minFontSize**, the lines that exceed the layout constraints are deleted. |
| textIndent<sup>10+</sup> | number \| string | Indentation of the first line.<br>Default value: **0**| | textIndent<sup>10+</sup> | number \| string | Indentation of the first line.<br>Default value: **0**|
> **NOTE** > **NOTE**
......
en/application-dev/reference/arkui-ts/ts-basic-components-textarea.md
浏览文件 @ 528ea754
...@@ -27,16 +27,16 @@ TextArea(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: Tex ...@@ -27,16 +27,16 @@ TextArea(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: Tex
## Attributes ## Attributes
In addition to the [universal attributes](ts-universal-attributes-size.md), the following attributes are supported. Among the [universal attributes](ts-universal-attributes-size.md) and [universal text attributes](ts-universal-attributes-text-style.md), **fontColor**, **fontSize**, **fontStyle**, **fontWeight**, and **fontFamily** are supported. In addition, the following attributes are supported.
| Name | Type | Description | | Name | Type | Description |
| ------------------------ | ------------------------------------------------------------ | ------------------------------------------------------------ | | ------------------------- | ------------------------------------------------------------ | ------------------------------------------------------------ |
| placeholderColor | [ResourceColor](ts-types.md#resourcecolor) | Placeholder text color. | | placeholderColor | [ResourceColor](ts-types.md#resourcecolor) | Placeholder text color.<br>The default value follows the theme. |
| placeholderFont | [Font](ts-types.md#font) | Placeholder text style, including the font size, font width, font family, and font style. Currently, only the default font family is supported.| | placeholderFont | [Font](ts-types.md#font) | Placeholder text style, including the font size, font width, font family, and font style. Currently, only the default font family is supported.|
| textAlign | [TextAlign](ts-appendix-enums.md#textalign) | Horizontal alignment of the text.<br>Default value: **TextAlign.Start**| | textAlign | [TextAlign](ts-appendix-enums.md#textalign) | Horizontal alignment of the text.<br>Default value: **TextAlign.Start**<br>**NOTE**<br>Available options are **TextAlign.Start**, **TextAlign.Center**, and **TextAlign.End**.<br>To set vertical alignment for the text, use the [align](ts-universal-attributes-location.md) attribute. The **align** attribute alone does not control the horizontal position of the text. In other words, **Alignment.TopStart**, **Alignment.Top**, and **Alignment.TopEnd** produce the same effect, top-aligning the text; **Alignment.Start**, **Alignment.Center**, and **Alignment.End** produce the same effect, centered-aligning the text vertically; **Alignment.BottomStart**, **Alignment.Bottom**, and **Alignment.BottomEnd** produce the same effect, bottom-aligning the text.|
| caretColor | [ResourceColor](ts-types.md#resourcecolor) | Color of the caret in the text box. | | caretColor | [ResourceColor](ts-types.md#resourcecolor) | Color of the caret in the text box.<br>Default value: **'#007DFF'** |
| inputFilter<sup>8+</sup> | {<br>value: [ResourceStr](ts-types.md#resourcestr),<br>error?: (value: string) => void<br>} | Regular expression for input filtering. Only inputs that comply with the regular expression can be displayed. Other inputs are filtered out. The specified regular expression can match single characters, but not strings.<br>- **value**: regular expression to set.<br>- **error**: filtered-out content to return when regular expression matching fails.| | inputFilter<sup>8+</sup> | {<br>value: [ResourceStr](ts-types.md#resourcestr),<br>error?: (value: string) => void<br>} | Regular expression for input filtering. Only inputs that comply with the regular expression can be displayed. Other inputs are filtered out. The specified regular expression can match single characters, but not strings.<br>- **value**: regular expression to set.<br>- **error**: filtered-out content to return when regular expression matching fails.|
| copyOption<sup>9+</sup> | [CopyOptions](ts-appendix-enums.md#copyoptions9) | Whether copy and paste is allowed.<br>If this attribute is set to **CopyOptions.None**, the paste operation is allowed, but the copy and cut operations are not.| | copyOption<sup>9+</sup> | [CopyOptions](ts-appendix-enums.md#copyoptions9) | Whether copy and paste is allowed.<br>Default value: **CopyOptions.LocalDevice**<br>If this attribute is set to **CopyOptions.None**, the paste operation is allowed, but the copy and cut operations are not.|
> **NOTE** > **NOTE**
> >
......
en/application-dev/reference/arkui-ts/ts-basic-components-textinput.md
浏览文件 @ 528ea754
...@@ -21,27 +21,27 @@ TextInput(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: Te ...@@ -21,27 +21,27 @@ TextInput(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: Te
| Name | Type | Mandatory | Description | | Name | Type | Mandatory | Description |
| ----------------------- | ---------------------------------------- | ---- | --------------- | | ----------------------- | ---------------------------------------- | ---- | --------------- |
| placeholder | [ResourceStr](ts-types.md#resourcestr) | No | Placeholder text displayed when there is no input. | | placeholder | [ResourceStr](ts-types.md#resourcestr) | No | Placeholder text displayed when there is no input. |
| text | [ResourceStr](ts-types.md#resourcestr) | No | Current text input.<br>If the component has [stateStyles](ts-universal-attributes-polymorphic-style.md) or any other attribute that may trigger updating configured, you are advised to bind the state variable to the text in real time through the **onChange** event,<br>so as to prevent display errors when the component is updated.<br>Since API version 10, this parameter supports [$$](../../quick-start/arkts-two-way-sync.md) for two-way binding of variables.| | text | [ResourceStr](ts-types.md#resourcestr) | No | Current text input.<br>If the component has [stateStyles](ts-universal-attributes-polymorphic-style.md) or any other attribute that may trigger updating configured, you are advised to bind the state variable to the text in real time through the **onChange** event, so as to prevent display errors when the component is updated.<br>Since API version 10, this parameter supports [$$](../../quick-start/arkts-two-way-sync.md) for two-way binding of variables.|
| controller<sup>8+</sup> | [TextInputController](#textinputcontroller8) | No | Text input controller.| | controller<sup>8+</sup> | [TextInputController](#textinputcontroller8) | No | Text input controller.|
## Attributes ## Attributes
In addition to the [universal attributes](ts-universal-attributes-size.md), the following attributes are supported. Among the [universal attributes](ts-universal-attributes-size.md) and [universal text attributes](ts-universal-attributes-text-style.md), **fontColor**, **fontSize**, **fontStyle**, **fontWeight**, and **fontFamily** are supported. In addition, the following attributes are supported.
| Name | Type | Description | | Name | Type | Description |
| ------------------------ | ---------------------------------------- | ---------------------------------------- | | ------------------------ | ---------------------------------------- | ---------------------------------------- |
| type | [InputType](#inputtype) | Input box type.<br>Default value: **InputType.Normal** | | type | [InputType](#inputtype) | Input box type.<br>Default value: **InputType.Normal** |
| placeholderColor | [ResourceColor](ts-types.md#resourcecolor) | Placeholder text color.| | placeholderColor | [ResourceColor](ts-types.md#resourcecolor) | Placeholder text color.<br>The default value follows the theme. |
| placeholderFont | [Font](ts-types.md#font) | Placeholder text font.| | placeholderFont | [Font](ts-types.md#font) | Placeholder text font.|
| enterKeyType | [EnterKeyType](#enterkeytype) | Type of the Enter key. Currently, only the default value is supported.<br>Default value: **EnterKeyType.Done**| | enterKeyType | [EnterKeyType](#enterkeytype) | Type of the Enter key. Currently, only the default value is supported.<br>Default value: **EnterKeyType.Done**|
| caretColor | [ResourceColor](ts-types.md#resourcecolor) | Color of the caret in the text box. | | caretColor | [ResourceColor](ts-types.md#resourcecolor) | Color of the caret in the text box.<br>Default value: **'#007DFF'** |
| maxLength | number | Maximum number of characters in the text input. | | maxLength | number | Maximum number of characters in the text input. |
| inputFilter<sup>8+</sup> | {<br>value: [ResourceStr](ts-types.md#resourcestr),<br>error?: (value: string) =&gt; void<br>} | Regular expression for input filtering. Only inputs that comply with the regular expression can be displayed. Other inputs are filtered out. The regular expression can match single characters, but not strings.<br>- **value**: regular expression to set.<br>- **error**: filtered-out content to return when regular expression matching fails.| | inputFilter<sup>8+</sup> | {<br>value: [ResourceStr](ts-types.md#resourcestr),<br>error?: (value: string) =&gt; void<br>} | Regular expression for input filtering. Only inputs that comply with the regular expression can be displayed. Other inputs are filtered out. The regular expression can match single characters, but not strings.<br>- **value**: regular expression to set.<br>- **error**: filtered-out content to return when regular expression matching fails.|
| copyOption<sup>9+</sup> | [CopyOptions](ts-appendix-enums.md#copyoptions9) | Whether copy and paste is allowed.<br>If this attribute is set to **CopyOptions.None**, the paste operation is allowed, but not the copy or cut operation.| | copyOption<sup>9+</sup> | [CopyOptions](ts-appendix-enums.md#copyoptions9) | Whether copy and paste is allowed.<br>Default value: **CopyOptions.LocalDevice**<br>If this attribute is set to **CopyOptions.None**, the paste operation is allowed, but not the copy or cut operation.|
| showPasswordIcon<sup>9+</sup> | boolean | Whether to display the show password icon at the end of the password text box.<br>Default value: **true**| | showPasswordIcon<sup>9+</sup> | boolean | Whether to display the password icon at the end of the password text box.<br>Default value: **true**|
| style<sup>9+</sup> | [TextInputStyle](#textinputstyle9) | Text input style.<br>Default value: **TextInputStyle.Default**| | style<sup>9+</sup> | [TextInputStyle](#textinputstyle9) \| [TextContentStyle](enums.d.ts#TextContentStyle) | Text input style.<br>Default value: **TextInputStyle.Default**|
| textAlign<sup>9+</sup> | [TextAlign](ts-appendix-enums.md#textalign) | Alignment mode of the text in the text box.<br>Default value: **TextAlign.Start** | | textAlign<sup>9+</sup> | [TextAlign](ts-appendix-enums.md#textalign) | Horizontal alignment of the text.<br>Default value: **TextAlign.Start**<br>**NOTE**<br>Available options are **TextAlign.Start**, **TextAlign.Center**, and **TextAlign.End**.<br>To set vertical alignment for the text, use the [align](ts-universal-attributes-location.md) attribute. The **align** attribute alone does not control the horizontal position of the text. In other words, **Alignment.TopStart**, **Alignment.Top**, and **Alignment.TopEnd** produce the same effect, top-aligning the text; **Alignment.Start**, **Alignment.Center**, and **Alignment.End** produce the same effect, centered-aligning the text vertically; **Alignment.BottomStart**, **Alignment.Bottom**, and **Alignment.BottomEnd** produce the same effect, bottom-aligning the text. |
| selectedBackgroundColor<sup>10+</sup> | [ResourceColor](ts-types.md#resourcecolor) | Background color of the selected text.<br>If the opacity is not set, the color is opaque. For example, **0x80000000** indicates black with 50% opacity.| | selectedBackgroundColor<sup>10+</sup> | [ResourceColor](ts-types.md#resourcecolor) | Background color of the selected text.<br>If the opacity is not set, the color is opaque. For example, **0x80000000** indicates black with 50% opacity.|
| caretStyle<sup>10+</sup> | {<br>width: [Length](ts-types.md#length)<br>} | Caret style. | | caretStyle<sup>10+</sup> | {<br>width: [Length](ts-types.md#length)<br>} | Caret style. |
| caretPosition<sup>10+</sup> | number | Caret position.| | caretPosition<sup>10+</sup> | number | Caret position.|
......
en/application-dev/web/web-in-page-app-function-invoking.md
浏览文件 @ 528ea754
...@@ -89,10 +89,10 @@ The following example registers the **test()** function with the frontend page. ...@@ -89,10 +89,10 @@ The following example registers the **test()** function with the frontend page.
> **NOTE** > **NOTE**
> >
> If you use [registerJavaScriptProxy()](../reference/apis/js-apis-webview.md#registerjavascriptproxy) to register a function, call **[refresh()]**(../reference/apis/js-apis-webview.md#refresh) for the function to take effect. > If you use [registerJavaScriptProxy()](../reference/apis/js-apis-webview.md#registerjavascriptproxy) to register a function, call [refresh()](../reference/apis/js-apis-webview.md#refresh) for the function to take effect.
- Sample code for invoking application functions on the **index.htm** frontend page: - Sample code for invoking application functions on the **index.html** frontend page:
```html ```html
<!-- index.html --> <!-- index.html -->
......
en/device-dev/device-test/smartperf-host.md 0 → 100644
浏览文件 @ 528ea754
# Smartperf-Host
## Overview
Smartperf-Host is an intuitive performance and power optimization tool that offers in-depth data mining and fine-grained data visualization. In this tool, you can gain visibility into a multitude of metrics in terms of CPU scheduling, frequency, process and thread time slices, heap memory, frame rate, and more, in swimlanes. Better yet, you can analyze the collected data intuitively on the GUI.
## Architecture
![System Architecture](figures/smartperf_frame.png)
Smartperf-Host consists of the device end and PC end, which exchange data with each other based on gRPC – a high-performance remote procedure call (RPC) framework.
The device end consists of modules such as Native Hook (application-embedded component), hiprofiler_command (command-line tool), hiprofilerd (performance profiler service), a set of performance profiler plug-ins, and some system tools and kernels. The device end provides the plug-in extension capability by exposing plug-in interfaces for external systems. By drawing on this capability, you can integrate custom plug-ins into the framework. For details about the preset plug-ins, see [Performance Profiler Component](https://gitee.com/openharmony/developtools_profiler).
The PC end is accessible from the Smartperf-Host website. It consists of modules such as Trace Streamer, SQLite, HDC device management, data import, UI drawing, and data analysis.
## Project Directory
```
/smartperf_host
├── host # Smartperf-Host related code
│ ├── doc # Smartperf-Host documentation
│ ├── ide # Smartperf-Host IDE module
│ │ └── src # Profiler module
│ │ │ ├── base-ui # Basic components
│ │ │ └── Trace # Service logic
│ ├── trace_streamer # Trace Streamer module
│ │ ├── base # Basic functionality
│ │ ├── cfg # Configuration
│ │ ├── filter # Filter
│ │ ├── include # Header files
│ │ ├── multi_platform # Platform adaptation
│ │ ├── parser # Parsing service logic
│ │ │ ├── bytrace_parser # byTrace service logic
│ │ │ └── htrace_parser # hTrace service logic
│ │ ├── table # Table structure
│ │ ├── trace_data # Trace structure
│ │ ├── trace_streamer # Trace Streamer structure
│ │ │ └── kits # JS APIs and native APIs
```
## Function Description
- Loading Trace Files on Web Pages
Load local trace files (such as htrace and ftrace) and display the data in swimlanes. For details, see [Loading Trace Files on Web Pages](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_systemtrace.md).
- Capturing Traces Online
Use Smartperf_Host to capture traces online, with the content, duration, and save path all customizable. For details, see [Capturing Traces on Web Pages](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_web_record.md).
- Capturing Traces on a Device
Capture traces on the target device, with the content, duration, and save path all customizable. For details, see [Capturing Traces from a Device](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_device_record.md).
- Using Ability Monitor
With Ability Monitor in Smartperf_Host, you can learn the CPU, memory, disk I/O, and network usage of your application. For details, see [Ability Monitor Usage](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_ability_monitor.md).
- Using Native Memory
With Native Memory in Smartperf_Host, you can track the allocation and release of your application's native memory (specific to C and C++). For details, see [Native Memory Usage](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_native_memory.md).
- Using Hiperf
With Hiperf in Smartperf_Host, you can view the CPU usage of your application and the call stack. For details, see [Hiperf Usage](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_hiperf.md).
- Using HiSystemEvent
With HiSystemEvent in Smartperf_Host, you can inspect the power consumption of each category (CPU, network, and location, and more) of your application, resource application and usage records (WorkScheduler, Runninglock, Alarm, and Location Request), power consumption exceptions, and system states associated with the power consumption (battery level and screen status). For details, see [HiSystemEvent Usage](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_hisystemevent.md).
- Collecting FileSystem Records
In Smartperf_Host, you can find out the system invoking information and read/write invoking times of all file systems. For details, see [Usage of FileSystem Recording](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_filesystem.md).
- Collecting Page Fault Records
In Smartperf_Host, you can collect page fault records, covering various aspects such as start time, duration, triggering process, triggering thread, event type, memory address, and memory size of page memory events. For details, see [Usage of Page Fault Recording](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_page_fault.md).
- Collecting BIO Records
In Smartperf_Host, you can collect I/O operation records, which provide the following information: start time, total latency, process, average latency of every 4 KB data, thread, operation (write data, page swap-in, and metadata), access traffic, path, block number, priority, and backtrace call stack. For details, see [Usage of BIO Latency Recording](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_bio.md).
- Collecting Smaps Records
In Smartperf_Host, you can collect the smaps data (type, Pss, Rss, Vss, and more) on a process-by-process basis. The data source is **/proc/$pid/smaps**. For details, see [Smaps Usage](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_smaps.md).
- Using SQL Analysis and Metrics
You can use Query (SQL) and Metrics features to quickly locate the trace data. For details, see [SQL Analysis and Metrics Usage](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_sql_metrics.md).
## Compilation Guidance
Project compilation includes Trace Streamer compilation and Smartperf-Host compilation and deployment.
### Prerequisites
- C++ version: 11 or later
- Node.js version: 16.15.1 or later
- npm version: 8.13.2 or later
- TypeScript version: 4.2.3 or later
- Go version: 1.13.8 or later
### Compiling Trace Streamer
To set up the Smartperf_Host website, you need to compile the WASM version of Trace Streamer for the web page to parse the original trace data. For details about the compilation process, see [Compiling Trace Streamer](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/trace_streamer/doc/compile_trace_streamer.md).
### Compiling and Deploying Smartperf-Host
For details about the compilation and deployment process, see [SmartPerf Compilation and Deployment Guide](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/README_zh.md)). After successful deployment, you can start to use Smartperf_Host by visiting **https://[*IP address of the device where SmartPerf is deployed*]:9000/application/**.
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或