diff --git a/en/application-dev/quick-start/arkts-rendering-control.md b/en/application-dev/quick-start/arkts-rendering-control.md index c59ee04dccef3411c25326851c446dcdd3f7164f..13904097ef69fc988fe3b1ed8d5a98714c38c2aa 100644 --- a/en/application-dev/quick-start/arkts-rendering-control.md +++ b/en/application-dev/quick-start/arkts-rendering-control.md @@ -256,7 +256,7 @@ struct MyComponent { this.data.pushData('/path/image' + this.data.totalCount() + '.png') }) }, item => item) - } + }.height('100%').width('100%') } } ``` diff --git a/en/application-dev/quick-start/arkts-restrictions-and-extensions.md b/en/application-dev/quick-start/arkts-restrictions-and-extensions.md index fa62ed392100f7ff0b60dcc6e8ee66ef465fbb3a..1c1a9a2ed4066f2d55badd2a02e0421a9a01f09b 100644 --- a/en/application-dev/quick-start/arkts-restrictions-and-extensions.md +++ b/en/application-dev/quick-start/arkts-restrictions-and-extensions.md @@ -83,7 +83,7 @@ struct bindPopupPage { } ``` - ![datePicker](../../application-dev/reference/arkui-ts/figures/datePicker.gif) + ![datePicker](figures/restrictions-data-type-declarations.gif) 2. The data type declaration of the **@State**, **@Provide**, **@Link**, or **@Consume** decorated state variables can consist of only one of the primitive data types or reference data types. @@ -232,3 +232,26 @@ struct Child { } } ``` + +## Restrictions on Naming Custom Components, Classes, and Functions + +The name of a custom component, class, or function cannot be the same as any system component name. + +Example: + +``` +// Rect.ets +export class Rect { + constructor(){} +} +// Index.ets +// ERROR: The module name 'Rect' can not be the same as the inner component name. +import { Rect } from './Rect'; +@Entry +@Component +struct Index { + build() { + + } +} +``` diff --git a/en/application-dev/quick-start/figures/restrictions-data-type-declarations.gif b/en/application-dev/quick-start/figures/restrictions-data-type-declarations.gif new file mode 100644 index 0000000000000000000000000000000000000000..52ee9ca7eb42b521cf879e364c95694ca698b834 Binary files /dev/null and b/en/application-dev/quick-start/figures/restrictions-data-type-declarations.gif differ diff --git a/en/application-dev/reference/apis/commonEventManager-definitions.md b/en/application-dev/reference/apis/commonEventManager-definitions.md index c2fafb52cf98e900836e5a583e4cc2ef5172974b..ea6015bbfa79bdc5ee49c00dffce5a9098e2091c 100644 --- a/en/application-dev/reference/apis/commonEventManager-definitions.md +++ b/en/application-dev/reference/apis/commonEventManager-definitions.md @@ -11,7 +11,7 @@ Indicates that the user has finished booting and the system has been loaded. - Required subscriber permissions: ohos.permission.RECEIVER_STARTUP_COMPLETED ## COMMON_EVENT_LOCKED_BOOT_COMPLETED -(Reserved, not supported yet) Indicates that the user has finished booting and the system has been loaded but the screen is still locked. +(Deprecated) Indicates that the user has finished booting and the system has been loaded but the screen is still locked. - Value: **usual.event.LOCKED_BOOT_COMPLETED** - Required subscriber permissions: ohos.permission.RECEIVER_STARTUP_COMPLETED @@ -59,14 +59,14 @@ Indicates that the device screen is on and the device is in interactive state. - Required subscriber permissions: none -## COMMON_EVENT_THERMAL_LEVEL_CHANGED8+ +## COMMON_EVENT_THERMAL_LEVEL_CHANGED Indicates that the device's thermal level has changed. - Value: **usual.event.THERMAL_LEVEL_CHANGED** - Required subscriber permissions: none ## COMMON_EVENT_USER_PRESENT -(Reserved, not supported yet) Indicates that the user unlocks the device. +(Deprecated) Indicates that the user unlocks the device. - Value: **usual.event.USER_PRESENT** - Required subscriber permissions: none @@ -84,7 +84,7 @@ Indicates that the system time is set. ## COMMON_EVENT_DATE_CHANGED -(Reserved, not supported yet) Indicates that the system date has changed. +(Deprecated) Indicates that the system date has changed. - Value: **usual.event.DATE_CHANGED** - Required subscriber permissions: none @@ -96,7 +96,7 @@ Indicates that the system time zone has changed. ## COMMON_EVENT_CLOSE_SYSTEM_DIALOGS -(Reserved, not supported yet) Indicates that the user closes a temporary system dialog box. +(Deprecated) Indicates that the user closes a temporary system dialog box. - Value: **usual.event.CLOSE_SYSTEM_DIALOGS** - Required subscriber permissions: none @@ -108,13 +108,13 @@ Indicates that a new application package has been installed on the device. ## COMMON_EVENT_PACKAGE_REPLACED -(Reserved, not supported yet) Indicates that a later version of an installed application package has replaced the previous one on the device. +(Deprecated) Indicates that a later version of an installed application package has replaced the previous one on the device. - Value: **usual.event.PACKAGE_REPLACED** - Required subscriber permissions: none ## COMMON_EVENT_MY_PACKAGE_REPLACED -(Reserved, not supported yet) Indicates that a later version of your application package has replaced the previous one. +(Deprecated) Indicates that a later version of your application package has replaced the previous one. - Value: **usual.event.MY_PACKAGE_REPLACED** - Required subscriber permissions: none @@ -125,13 +125,13 @@ Indicates that an installed application has been uninstalled from the device wit ## COMMON_EVENT_BUNDLE_REMOVED -(Reserved, not supported yet) Indicates that an installed bundle has been uninstalled from the device with the application data retained. +(Deprecated) Indicates that an installed bundle has been uninstalled from the device with the application data retained. - Value: **usual.event.BUNDLE_REMOVED** - Required subscriber permissions: none ## COMMON_EVENT_PACKAGE_FULLY_REMOVED -(Reserved, not supported yet) Indicates that an installed application, including both the application data and code, has been completely uninstalled from the device. +(Deprecated) Indicates that an installed application, including both the application data and code, has been completely uninstalled from the device. - Value: **usual.event.PACKAGE_FULLY_REMOVED** - Required subscriber permissions: none @@ -161,79 +161,79 @@ Indicates that the user cleared the application package cache. ## COMMON_EVENT_PACKAGES_SUSPENDED -(Reserved, not supported yet) Indicates that application HAP files are suspended. +(Deprecated) Indicates that application HAP files are suspended. - Value: **usual.event.PACKAGES_SUSPENDED** - Required subscriber permissions: none ## COMMON_EVENT_PACKAGES_UNSUSPENDED -(Reserved, not supported yet) Indicates that application HAP files are not suspended (restored from the suspended state). +(Deprecated) Indicates that application HAP files are not suspended (restored from the suspended state). - Value: **usual.event.PACKAGES_UNSUSPENDED** - Required subscriber permissions: none ## COMMON_EVENT_MY_PACKAGE_SUSPENDED -Indicates that an application HAP file is suspended. +(Deprecated) Indicates that an application HAP file is suspended. - Value: **usual.event.MY_PACKAGE_SUSPENDED** - Required subscriber permissions: none ## COMMON_EVENT_MY_PACKAGE_UNSUSPENDED -Indicates that an application HAP file is not suspended. +(Deprecated) Indicates that an application HAP file is not suspended. - Value: **usual.event.MY_PACKAGE_UNSUSPENDED** - Required subscriber permissions: none ## COMMON_EVENT_UID_REMOVED -(Reserved, not supported yet) Indicates that a user ID has been removed from the system. +(Deprecated) Indicates that a user ID has been removed from the system. - Value: **usual.event.UID_REMOVED** - Required subscriber permissions: none ## COMMON_EVENT_PACKAGE_FIRST_LAUNCH -(Reserved, not supported yet) Indicates that an installed application is started for the first time. +(Deprecated) Indicates that an installed application is started for the first time. - Value: **usual.event.PACKAGE_FIRST_LAUNCH** - Required subscriber permissions: none ## COMMON_EVENT_PACKAGE_NEEDS_VERIFICATION -(Reserved, not supported yet) Indicates that an application requires system verification. +(Deprecated) Indicates that an application requires system verification. - Value: **usual.event.PACKAGE_NEEDS_VERIFICATION** - Required subscriber permissions: none ## COMMON_EVENT_PACKAGE_VERIFIED -(Reserved, not supported yet) Indicates that an application has been verified by the system. +(Deprecated) Indicates that an application has been verified by the system. - Value: **usual.event.PACKAGE_VERIFIED** - Required subscriber permissions: none ## COMMON_EVENT_EXTERNAL_APPLICATIONS_AVAILABLE -(Reserved, not supported yet) Indicates that applications installed on the external storage are available for the system. +(Deprecated) Indicates that applications installed on the external storage are available for the system. - Value: **usual.event.EXTERNAL_APPLICATIONS_AVAILABLE** - Required subscriber permissions: none ## COMMON_EVENT_EXTERNAL_APPLICATIONS_UNAVAILABLE -(Reserved, not supported yet) Indicates that applications installed on the external storage are not available for the system. +(Deprecated) Indicates that applications installed on the external storage are not available for the system. - Value: **usual.event.EXTERNAL_APPLICATIONS_UNAVAILABLE** - Required subscriber permissions: none ## COMMON_EVENT_CONFIGURATION_CHANGED -(Reserved, not supported yet) Indicates that the device state (for example, orientation and locale) has changed. +(Deprecated) Indicates that the device state (for example, orientation and locale) has changed. - Value: **usual.event.CONFIGURATION_CHANGED** - Required subscriber permissions: none ## COMMON_EVENT_LOCALE_CHANGED -(Reserved, not supported yet) Indicates that the device locale has changed. +(Deprecated) Indicates that the device locale has changed. - Value: **usual.event.LOCALE_CHANGED** - Required subscriber permissions: none ## COMMON_EVENT_MANAGE_PACKAGE_STORAGE -(Reserved, not supported yet) Indicates that the device storage is insufficient. +(Deprecated) Indicates that the device storage is insufficient. - Value: **usual.event.MANAGE_PACKAGE_STORAGE** - Required subscriber permissions: none @@ -245,31 +245,31 @@ Indicates that an application HAP file is not suspended. ## COMMON_EVENT_HOME_MODE -(Reserved, not supported yet) Indicates that the system is in home mode. +(Deprecated) Indicates that the system is in home mode. - Value: **common.event.HOME_MODE** - Required subscriber permissions: none ## COMMON_EVENT_OFFICE_MODE -(Reserved, not supported yet) Indicates that the system is in office mode. +(Deprecated) Indicates that the system is in office mode. - Value: **common.event.OFFICE_MODE** - Required subscriber permissions: none ## COMMON_EVENT_USER_STARTED -(Reserved, not supported yet) Indicates that the user has been started. +(Deprecated) Indicates that the user has been started. - Value: **usual.event.USER_STARTED** - Required subscriber permissions: none ## COMMON_EVENT_USER_BACKGROUND -(Reserved, not supported yet) Indicates that the user has been brought to the background. +(Deprecated) Indicates that the user has been brought to the background. - Value: **usual.event.USER_BACKGROUND** - Required subscriber permissions: none ## COMMON_EVENT_USER_FOREGROUND -(Reserved, not supported yet) Indicates that the user has been brought to the foreground. +(Deprecated) Indicates that the user has been brought to the foreground. - Value: **usual.event.USER_FOREGROUND** - Required subscriber permissions: none @@ -281,7 +281,7 @@ Indicates that user switching is in progress. ## COMMON_EVENT_USER_STARTING -(Reserved, not supported yet) Indicates that the user is being started. +(Deprecated) Indicates that the user is being started. - Value: **usual.event.USER_STARTING** - Required subscriber permissions: ohos.permission.INTERACT_ACROSS_LOCAL_ACCOUNTS @@ -293,13 +293,13 @@ Indicates that user switching is in progress. ## COMMON_EVENT_USER_STOPPING -(Reserved, not supported yet) Indicates that the user is going to be stopped. +(Deprecated) Indicates that the user is going to be stopped. - Value: **usual.event.USER_STOPPING** - Required subscriber permissions: ohos.permission.INTERACT_ACROSS_LOCAL_ACCOUNTS ## COMMON_EVENT_USER_STOPPED -(Reserved, not supported yet) Indicates that the user has been stopped. +(Deprecated) Indicates that the user has been stopped. - Value: **usual.event.USER_STOPPED** - Required subscriber permissions: none @@ -474,7 +474,7 @@ Indicates that the Wi-Fi P2P group information has changed. ## COMMON_EVENT_BLUETOOTH_REMOTEDEVICE_ACL_DISCONNECTED -(Reserved, not supported yet) Indicates that the low-ACL connection with a remote Bluetooth device has been terminated. +(Deprecated) Indicates that the low-ACL connection with a remote Bluetooth device has been terminated. - Value: **usual.event.bluetooth.remotedevice.ACL_DISCONNECTED** - Required subscriber permissions: ohos.permission.USE_BLUETOOTH @@ -618,19 +618,19 @@ Indicates that the Wi-Fi P2P group information has changed. ## COMMON_EVENT_BLUETOOTH_A2DPSINK_PLAYING_STATE_UPDATE -(Reserved, not supported yet) Indicates that the playing state of Bluetooth A2DP Sink has changed. +(Deprecated) Indicates that the playing state of Bluetooth A2DP Sink has changed. - Value: **usual.event.bluetooth.a2dpsink.PLAYING_STATE_UPDATE** - Required subscriber permissions: ohos.permission.USE_BLUETOOTH ## COMMON_EVENT_BLUETOOTH_A2DPSINK_AUDIO_STATE_UPDATE -(Reserved, not supported yet) Indicates that the audio state of Bluetooth A2DP Sink has changed. +(Deprecated) Indicates that the audio state of Bluetooth A2DP Sink has changed. - Value: **usual.event.bluetooth.a2dpsink.AUDIO_STATE_UPDATE** - Required subscriber permissions: ohos.permission.USE_BLUETOOTH ## COMMON_EVENT_NFC_ACTION_ADAPTER_STATE_CHANGED -(Reserved, not supported yet) Indicates that the state of the device NFC adapter has changed. +Indicates that the state of the device NFC adapter has changed. - Value: **usual.event.nfc.action.ADAPTER_STATE_CHANGED** - Required subscriber permissions: none @@ -642,7 +642,7 @@ Indicates that the Wi-Fi P2P group information has changed. ## COMMON_EVENT_NFC_ACTION_RF_FIELD_OFF_DETECTED -(Reserved, not supported yet) Indicates that the NFC RF field is detected to be in the disabled state. +(Deprecated) Indicates that the NFC RF field is detected to be in the disabled state. - Value: **usual.event.nfc.action.RF_FIELD_OFF_DETECTED** - Required subscriber permissions: ohos.permission.MANAGE_SECURE_SETTINGS @@ -659,7 +659,7 @@ Indicates that the system starts charging the battery. - Required subscriber permissions: none ## COMMON_EVENT_DEVICE_IDLE_MODE_CHANGED -(Reserved, not supported yet) Indicates that the system idle mode has changed. +(Deprecated) Indicates that the system idle mode has changed. - Value: **usual.event.DEVICE_IDLE_MODE_CHANGED** - Required subscriber permissions: none @@ -683,19 +683,19 @@ Indicates that a user has been removed from the system. ## COMMON_EVENT_ABILITY_ADDED -(Reserved, not supported yet) Indicates that an ability has been added. +(Deprecated) Indicates that an ability has been added. - Value: **usual.event.ABILITY_ADDED** - Required subscriber permissions: ohos.permission.LISTEN_BUNDLE_CHANGE ## COMMON_EVENT_ABILITY_REMOVED -(Reserved, not supported yet) Indicates that an ability has been removed. +(Deprecated) Indicates that an ability has been removed. - Value: **usual.event.ABILITY_REMOVED** - Required subscriber permissions: ohos.permission.LISTEN_BUNDLE_CHANGE ## COMMON_EVENT_ABILITY_UPDATED -(Reserved, not supported yet) Indicates that an ability has been updated. +(Deprecated) Indicates that an ability has been updated. - Value: **usual.event.ABILITY_UPDATED** - Required subscriber permissions: ohos.permission.LISTEN_BUNDLE_CHANGE @@ -707,67 +707,67 @@ Indicates that a user has been removed from the system. ## COMMON_EVENT_IVI_SLEEP -(Reserved, not supported yet) Indicates that the in-vehicle infotainment (IVI) system is in sleep mode. +(Deprecated) Indicates that the in-vehicle infotainment (IVI) system is in sleep mode. - Value: **common.event.IVI_SLEEP** - Required subscriber permissions: none ## COMMON_EVENT_IVI_PAUSE -(Reserved, not supported yet) Indicates that the IVI system as entered sleep mode and instructs the playing application to stop playback. +(Deprecated) Indicates that the IVI system as entered sleep mode and instructs the playing application to stop playback. - Value: **common.event.IVI_PAUSE** - Required subscriber permissions: none ## COMMON_EVENT_IVI_STANDBY -(Reserved, not supported yet) Requests a third-party application in the IVI system to pause the current work. +(Deprecated) Requests a third-party application in the IVI system to pause the current work. - Value: **common.event.IVI_STANDBY** - Required subscriber permissions: none ## COMMON_EVENT_IVI_LASTMODE_SAVE -(Reserved, not supported yet) Requests a third-party application in the IVI system to save its last mode. +(Deprecated) Requests a third-party application in the IVI system to save its last mode. - Value: **common.event.IVI_LASTMODE_SAVE** - Required subscriber permissions: none ## COMMON_EVENT_IVI_VOLTAGE_ABNORMAL -(Reserved, not supported yet) Indicates that the voltage of the vehicle's power system is abnormal. +(Deprecated) Indicates that the voltage of the vehicle's power system is abnormal. - Value: **common.event.IVI_VOLTAGE_ABNORMAL** - Required subscriber permissions: none ## COMMON_EVENT_IVI_HIGH_TEMPERATURE -(Reserved, not supported yet) Indicates that the temperature of the IVI system is high. +(Deprecated) Indicates that the temperature of the IVI system is high. - Value: **common.event.IVI_HIGH_TEMPERATURE** - Required subscriber permissions: none ## COMMON_EVENT_IVI_EXTREME_TEMPERATURE -(Reserved, not supported yet) Indicates that the temperature of the IVI system is extremely high. +(Deprecated) Indicates that the temperature of the IVI system is extremely high. - Value: **common.event.IVI_EXTREME_TEMPERATURE** - Required subscriber permissions: none ## COMMON_EVENT_IVI_TEMPERATURE_ABNORMAL -(Reserved, not supported yet) Indicates that the IVI system is at an extreme temperature. +(Deprecated) Indicates that the IVI system is at an extreme temperature. - Value: **common.event.IVI_TEMPERATURE_ABNORMAL** - Required subscriber permissions: none ## COMMON_EVENT_IVI_VOLTAGE_RECOVERY -(Reserved, not supported yet) Indicates that the voltage of the vehicle's power system is restored to normal. +(Deprecated) Indicates that the voltage of the vehicle's power system is restored to normal. - Value: **common.event.IVI_VOLTAGE_RECOVERY** - Required subscriber permissions: none ## COMMON_EVENT_IVI_TEMPERATURE_RECOVERY -(Reserved, not supported yet) Indicates that the temperature of the IVI system is restored to normal. +(Deprecated) Indicates that the temperature of the IVI system is restored to normal. - Value: **common.event.IVI_TEMPERATURE_RECOVERY** - Required subscriber permissions: none ## COMMON_EVENT_IVI_ACTIVE -(Reserved, not supported yet) Indicates that the battery service of the IVI system is active. +(Deprecated) Indicates that the battery service of the IVI system is active. - Value: **common.event.IVI_ACTIVE** - Required subscriber permissions: none @@ -809,37 +809,37 @@ Indicates that a USB device has been detached from the device functioning as a U ## COMMON_EVENT_DISK_REMOVED -(Reserved, not supported yet) Indicates that an external storage device was removed. +(Deprecated) Indicates that an external storage device was removed. - Value: **usual.event.data.DISK_BAD_REMOVAL** - Required subscriber permissions: ohos.permission.STORAGE_MANAGER ## COMMON_EVENT_DISK_UNMOUNTED -(Reserved, not supported yet) Indicates that an external storage device was unmounted. +(Deprecated) Indicates that an external storage device was unmounted. - Value: **usual.event.data.DISK_UNMOUNTABLE** - Required subscriber permissions: ohos.permission.STORAGE_MANAGER ## COMMON_EVENT_DISK_MOUNTED -(Reserved, not supported yet) Indicates that an external storage device was mounted. +(Deprecated) Indicates that an external storage device was mounted. - Value: **usual.event.hardware.usb.action.USB_ACCESSORY_DETACHED** - Required subscriber permissions: ohos.permission.STORAGE_MANAGER ## COMMON_EVENT_DISK_BAD_REMOVAL -(Reserved, not supported yet) Indicates that an external storage device was removed without being unmounted. +(Deprecated) Indicates that an external storage device was removed without being unmounted. - Value: usual.event.data.DISK_REMOVED - Required subscriber permissions: ohos.permission.STORAGE_MANAGER ## COMMON_EVENT_DISK_UNMOUNTABLE -(Reserved, not supported yet) Indicates that an external storage device is unmountable when the card is inserted. +(Deprecated) Indicates that an external storage device is unmountable when the card is inserted. - Value: **usual.event.data.DISK_UNMOUNTED** - Required subscriber permissions: ohos.permission.STORAGE_MANAGER ## COMMON_EVENT_DISK_EJECT -(Reserved, not supported yet) Indicates that an external storage device was ejected (at the software level). +(Deprecated) Indicates that an external storage device was ejected (at the software level). - Value: **usual.event.data.DISK_EJECT** - Required subscriber permissions: ohos.permission.STORAGE_MANAGER @@ -875,19 +875,19 @@ Indicates that an external storage device was ejected (at the software level). ## COMMON_EVENT_VISIBLE_ACCOUNTS_UPDATED -(Reserved, not supported yet) Indicates that the account visibility changed. +(Deprecated) Indicates that the account visibility changed. - Value: **usual.event.data.VISIBLE_ACCOUNTS_UPDATED** - Required subscriber permissions: ohos.permission.GET_APP_ACCOUNTS ## COMMON_EVENT_ACCOUNT_DELETED -(Reserved, not supported yet) Indicates that an account was deleted. +(Deprecated) Indicates that an account was deleted. - Value: **usual.event.data.ACCOUNT_DELETED** - Required subscriber permissions: ohos.permission.INTERACT_ACROSS_LOCAL_ACCOUNTS ## COMMON_EVENT_FOUNDATION_READY -(Reserved, not supported yet) Indicates that the foundation is ready. +(Deprecated) Indicates that the foundation is ready. - Value: **usual.event.data.FOUNDATION_READY** - Required subscriber permissions: ohos.permission.RECEIVER_STARTUP_COMPLETED diff --git a/en/application-dev/reference/apis/js-apis-curve.md b/en/application-dev/reference/apis/js-apis-curve.md index 57429452128ed66558b340473c88aacddfb88b59..c5a95f48d331f665d89a8fd5449315ee4502046b 100644 --- a/en/application-dev/reference/apis/js-apis-curve.md +++ b/en/application-dev/reference/apis/js-apis-curve.md @@ -35,7 +35,6 @@ Implements initialization for the interpolation curve, which is used to create a | ---------------------------------- | ---------------- | | [ICurve](#icurve) | Interpolation curve.| - **Example** ```ts @@ -57,7 +56,7 @@ Creates a step curve. | Name| Type | Mandatory| Description | | ------ | ------- | ----| ------------------------------------------------------------ | -| count | number | Yes | Number of steps. The value must be a positive integer. | +| count | number | Yes | Number of steps. The value must be a positive integer.
Value range: [0, +∞)
**NOTE**
A value less than 0 evaluates to the value **0**.| | end | boolean | Yes | Whether jumping occurs when the interpolation ends.
- **true**: Jumping occurs when the interpolation ends.
- **false**: Jumping occurs when the interpolation starts.| **Return value** @@ -66,7 +65,6 @@ Creates a step curve. | ---------------------------------- | ---------------- | | [ICurve](#icurve) | Interpolation curve.| - **Example** ```ts @@ -85,12 +83,13 @@ Creates a cubic Bezier curve. The curve values must be between 0 and 1. **System capability**: SystemCapability.ArkUI.ArkUI.Full **Parameters** -| Name | Type | Mandatory | Description | -| ---- | ------ | ---- | -------------- | -| x1 | number | Yes | X coordinate of the first point on the Bezier curve.| -| y1 | number | Yes | Y coordinate of the first point on the Bezier curve.| -| x2 | number | Yes | X coordinate of the second point on the Bezier curve.| -| y2 | number | Yes | Y coordinate of the second point on the Bezier curve.| + +| Name| Type | Mandatory| Description | +| ------ | ------ | ---- | ------------------------------------------------------------ | +| x1 | number | Yes | X coordinate of the first point on the Bezier curve.
Value range: [0, 1]
**NOTE**
A value less than 0 evaluates to the value **0**. A value greater than 1 evaluates to the value **1**.| +| y1 | number | Yes | Y coordinate of the first point on the Bezier curve.
Value range: (-∞, +∞) | +| x2 | number | Yes | X coordinate of the second point on the Bezier curve.
Value range: [0, 1]
**NOTE**
A value less than 0 evaluates to the value **0**. A value greater than 1 evaluates to the value **1**.| +| y2 | number | Yes | Y coordinate of the second point on the Bezier curve.
Value range: (-∞, +∞) | **Return value** @@ -117,12 +116,12 @@ Creates a spring curve. **System capability**: SystemCapability.ArkUI.ArkUI.Full **Parameters** -| Name | Type | Mandatory | Description | -| --------- | ------ | ---- | ----- | -| velocity | number | Yes | Initial velocity. It is applied by external factors to the elastic animation. It aims to help ensure the smooth transition from the previous motion state to the elastic animation.| -| mass | number | Yes | Mass, which influences the inertia in the spring system. The greater the mass, the greater the amplitude of the oscillation, and the slower the speed of restoring to the equilibrium position.| -| stiffness | number | Yes | Stiffness. It is the degree to which an object deforms by resisting the force applied. In an elastic system, the greater the stiffness, the stronger the ability to resist deformation, and the faster the speed of restoring to the equilibrium position.| -| damping | number | Yes | Damping. It is a pure number and has no real physical meaning. It is used to describe the oscillation and attenuation of the system after being disturbed. The larger the damping, the smaller the number of oscillations of elastic motion, and the smaller the oscillation amplitude.| +| Name | Type | Mandatory| Description | +| --------- | ------ | ---- | ------------------------------------------------------------ | +| velocity | number | Yes | Initial velocity. It is applied by external factors to the spring animation, designed to help ensure the smooth transition from the previous motion state.
Value range: (-∞, +∞)| +| mass | number | Yes | Mass, which influences the inertia in the spring system. The greater the mass, the greater the amplitude of the oscillation, and the slower the speed of restoring to the equilibrium position.
Value range: [0, +∞)
**NOTE**
A value less than 0 evaluates to the value **1**.| +| stiffness | number | Yes | Stiffness. It is the degree to which an object deforms by resisting the force applied. In an elastic system, the greater the stiffness, the stronger the ability to resist deformation, and the faster the speed of restoring to the equilibrium position.
Value range: [0, +∞)
**NOTE**
A value less than 0 evaluates to the value **1**.| +| damping | number | Yes | Damping. It is a pure number and has no real physical meaning. It is used to describe the oscillation and attenuation of the system after being disturbed. The larger the damping, the smaller the number of oscillations of elastic motion, and the smaller the oscillation amplitude.
Value range: [0, +∞)
**NOTE**
A value less than 0 evaluates to the value **1**.| **Return value** @@ -149,18 +148,19 @@ Creates a spring animation curve. If multiple spring animations are applied to t **System capability**: SystemCapability.ArkUI.ArkUI.Full **Parameters** + | Name | Type | Mandatory | Description | | --------- | ------ | ---- | ----- | -| response | number | No | Duration of one complete oscillation, in seconds.
Default value: **0.55**| -| dampingFraction | number | No | Damping coefficient.
**0**: undamped. In this case, the spring oscillates forever.
> 0 and < 1: underdamped. In this case, the spring overshoots the equilibrium position.
**1**: critically damped.
> 1: overdamped. In this case, the spring approaches equilibrium gradually.
Default value: **0.825**| -| overlapDuration | number | No | Duration for animations to overlap, in seconds. When animations overlap, if the **response** values of the two animations are different, they will transit smoothly over this duration.
Default value: **0**| +| response | number | No | Duration of one complete oscillation,
Default value: **0.55**
Unit: second
Value range: [0, +∞)
**NOTE**
A value less than 0 evaluates to the default value **0.55**.| +| dampingFraction | number | No | Damping coefficient.
**0**: undamped. In this case, the spring oscillates forever.
> 0 and < 1: underdamped. In this case, the spring overshoots the equilibrium position.
**1**: critically damped.
> 1: overdamped. In this case, the spring approaches equilibrium gradually.
Default value: **0.825**
Unit: second
Value range: [0, +∞)
**NOTE**
A value less than 0 evaluates to the default value **0.55**.| +| overlapDuration | number | No | Duration for animations to overlap, in seconds. When animations overlap, if the **response** values of the two animations are different, they will transit smoothly over this duration.

Default value: **0**
Unit: second
Value range: [0, +∞)
**NOTE**
A value less than 0 evaluates to the default value **0**.
The spring animation curve is physics-based. Its duration depends on the **springMotion** parameters and the previous velocity, rather than the **duration** parameter in **[animation](../arkui-ts/ts-animatorproperty.md)** or **[animateTo](../arkui-ts/ts-explicit-animation.md)**. The time cannot be normalized. Therefore, the interpolation cannot be obtained by using the **[interpolate](#interpolate)** function of the curve.| **Return value** | Type | Description | | ---------------------------------- | ---------------- | -| [ICurve](#icurve)| Curve.
Note: The spring animation curve is physics-based. Its duration depends on the **springMotion** parameters and the previous velocity, rather than the **duration** parameter in **animation** or **animateTo**. The time cannot be normalized. Therefore, the interpolation cannot be obtained by using the [interpolate](#interpolate) function of the curve.| +| [ICurve](#icurve)| Curve.
**NOTE**
The spring animation curve is physics-based. Its duration depends on the **springMotion** parameters and the previous velocity, rather than the **duration** parameter in **animation** or **animateTo**. The time cannot be normalized. Therefore, the interpolation cannot be obtained by using the **[interpolate](#interpolate)** function of the curve.| **Example** @@ -182,17 +182,18 @@ Creates a responsive spring animation curve. It is a special case of [springMoti **System capability**: SystemCapability.ArkUI.ArkUI.Full **Parameters** + | Name | Type | Mandatory | Description | | --------- | ------ | ---- | ----- | -| response | number | No | See **response** in **springMotion**. Default value: **0.15**| -| dampingFraction | number | No | See **dampingFraction** in **springMotion**. Default value: **0.86**| -| overlapDuration | number | No | See **overlapDuration** in **springMotion**. Default value: **0.25**| +| response | number | No | See **response** in **springMotion**.
Default value: **0.15**
Unit: second
Value range: [0, +∞)
**NOTE**
A value less than 0 evaluates to the default value **0.15**.| +| dampingFraction | number | No | See **dampingFraction** in **springMotion**.
Default value: **0.86**
Unit: second
Value range: [0, +∞)
**NOTE**
A value less than 0 evaluates to the default value **0.86**.| +| overlapDuration | number | No | See **overlapDuration** in **springMotion**.
Default value: **0.25**
Unit: second
Value range: [0, +∞)
**NOTE**
A value less than 0 evaluates to the default value **0.25**.
To apply custom settings for a spring animation, you are advised to use **springMotion**. When using **responsiveSpringMotion**, you are advised to retain the default settings.
The duration of the responsive spring animation depends on the **responsiveSpringMotion** parameters and the previous velocity, rather than the **duration** parameter in **[animation](../arkui-ts/ts-animatorproperty.md)** or **[animateTo](../arkui-ts/ts-explicit-animation.md)**. In addition, the interpolation cannot be obtained by using the **[interpolate](#interpolate)** function of the curve.| **Return value** | Type | Description | | ---------------------------------- | ---------------- | -| [ICurve](#icurve)| Curve.
**NOTE**
1. To apply custom settings for a spring animation, you are advised to use **springMotion**. When using **responsiveSpringMotion**, you are advised to retain the default settings.
2. The duration of the responsive spring animation depends on the **responsiveSpringMotion** parameters and the previous velocity, rather than the **duration** parameter in **animation** or **animateTo**. In addition, the interpolation cannot be obtained by using the [interpolate](#interpolate) function of the curve.| +| [ICurve](#icurve)| Curve.
**NOTE**
1. To apply custom settings for a spring animation, you are advised to use **springMotion**. When using **responsiveSpringMotion**, you are advised to retain the default settings.
2. The duration of the responsive spring animation depends on the **responsiveSpringMotion** parameters and the previous velocity, rather than the **duration** parameter in **animation** or **animateTo**. In addition, the interpolation cannot be obtained by using the **interpolate** function of the curve.| **Example** @@ -217,9 +218,9 @@ Since API version 9, this API is supported in ArkTS widgets. **Parameters** -| Name | Type | Mandatory| Description | -| -------- | ------ | ---- | -------------------------------------------- | -| fraction | number | Yes | Current normalized time. The value ranges from 0 to 1.| +| Name | Type | Mandatory| Description | +| -------- | ------ | ---- | ------------------------------------------------------------ | +| fraction | number | Yes | Current normalized time.
Value range: [0, 1]
**NOTE**
A value less than 0 evaluates to the value **0**. A value greater than 1 evaluates to the value **1**.| **Return value** @@ -300,7 +301,7 @@ Creates a spring curve. This API is deprecated since API version 9. You are advi | Name | Type | Mandatory | Description | | --------- | ------ | ---- | ----- | -| velocity | number | Yes | Initial velocity. It is applied by external factors to the elastic animation. It aims to help ensure the smooth transition from the previous motion state to the elastic animation.| +| velocity | number | Yes | Initial velocity. It is applied by external factors to the spring animation, designed to help ensure the smooth transition from the previous motion state.| | mass | number | Yes | Mass, which influences the inertia in the spring system. The greater the mass, the greater the amplitude of the oscillation, and the slower the speed of restoring to the equilibrium position.| | stiffness | number | Yes | Stiffness. It is the degree to which an object deforms by resisting the force applied. In an elastic system, the greater the stiffness, the stronger the ability to resist deformation, and the faster the speed of restoring to the equilibrium position.| | damping | number | Yes | Damping. It is a pure number and has no real physical meaning. It is used to describe the oscillation and attenuation of the system after being disturbed. The larger the damping, the smaller the number of oscillations of elastic motion, and the smaller the oscillation amplitude.| diff --git a/en/application-dev/reference/apis/js-apis-matrix4.md b/en/application-dev/reference/apis/js-apis-matrix4.md index 123602526ffa59a7af9f20c7ee7eb0775ffae0e6..b707f54df167497056052a8524ec00d7bbe11188 100644 --- a/en/application-dev/reference/apis/js-apis-matrix4.md +++ b/en/application-dev/reference/apis/js-apis-matrix4.md @@ -281,11 +281,11 @@ Translates this matrix object along the x, y, and z axes. **Parameters** -| Name| Type | Mandatory| Description | -| ------ | ------ | ---- | ------------------------------------- | -| x | number | No | Translation distance along the x-axis, in px.
Default value: **0**| -| y | number | No | Translation distance along the y-axis, in px.
Default value: **0**| -| z | number | No | Translation distance along the z-axis, in px.
Default value: **0**| +| Name| Type | Mandatory| Description | +| ------ | ------ | ---- | ----------------------------------------------------------- | +| x | number | No | Translation distance along the x-axis, in px.
Default value: **0**
Value range: (-∞, +∞)| +| y | number | No | Translation distance along the y-axis, in px.
Default value: **0**
Value range: (-∞, +∞)| +| z | number | No | Translation distance along the z-axis, in px.
Default value: **0**
Value range: (-∞, +∞)| **Return value** @@ -328,13 +328,13 @@ Scales this matrix object along the x, y, and z axes. **Parameters** -| Name | Type | Mandatory| Description | -| ------- | ------ | ---- | --------------------------------- | -| x | number | No | Scaling multiple along the x-axis.
Default value: **1** | -| y | number | No | Scaling multiple along the y-axis.
Default value: **1** | -| z | number | No | Scaling multiple along the z-axis.
Default value: **1** | -| centerX | number | No | X coordinate of the center point.
Default value: **0**| -| centerY | number | No | Y coordinate of the center point.
Default value: **0**| +| 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.
Default value: **1**
Value range: [0, +∞)
**NOTE**
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.
Default value: **1**
Value range: [0, +∞)
**NOTE**
A value less than 0 evaluates to the default value.| +| z | number | No | Scaling multiple along the z-axis. If the value is greater than 1, the image is scaled up along the z-axis. If the value is less than 1, the image is scaled down along the z-axis.
Default value: **1**
Value range: [0, +∞)
**NOTE**
A value less than 0 evaluates to the default value.| +| centerX | number | No | X coordinate of the center point.
Default value: **0**
Value range: (-∞, +∞) | +| centerY | number | No | Y coordinate of the center point.
Default value: **0**
Value range: (-∞, +∞) | **Return value** @@ -376,14 +376,14 @@ Rotates this matrix object along the x, y, and z axes. **Parameters** -| Name | Type | Mandatory| Description | -| ------- | ------ | ---- | --------------------------------- | -| x | number | No | X coordinate of the rotation axis vector.
Default value: **1** | -| y | number | No | Y coordinate of the rotation axis vector.
Default value: **1** | -| z | number | No | Z coordinate of the rotation axis vector.
Default value: **1** | -| angle | number | No | Rotation angle.
Default value: **0** | -| centerX | number | No | X coordinate of the center point.
Default value: **0**| -| centerY | number | No | Y coordinate of the center point.
Default value: **0**| +| Name | Type | Mandatory| Description | +| ------- | ------ | ---- | ------------------------------------------------------- | +| x | number | No | X coordinate of the rotation axis vector.
Default value: **1**
Value range: (-∞, +∞)| +| y | number | No | Y coordinate of the rotation axis vector.
Default value: **1**
Value range: (-∞, +∞)| +| z | number | No | Z coordinate of the rotation axis vector.
Default value: **1**
Value range: (-∞, +∞)| +| angle | number | No | Rotation angle.
Default value: **0** | +| centerX | number | No | X coordinate of the center point.
Default value: **0** | +| centerY | number | No | Y coordinate of the center point.
Default value: **0** | **Return value** diff --git a/en/application-dev/reference/arkui-ts/figures/align.png b/en/application-dev/reference/arkui-ts/figures/align.png index ffabc26d3ee59984dda6cb375f8b18bb319b4fc7..5cdeb7cfd622b90a6fe52ef8cc94f187847d05b7 100644 Binary files a/en/application-dev/reference/arkui-ts/figures/align.png and b/en/application-dev/reference/arkui-ts/figures/align.png differ diff --git a/en/application-dev/reference/arkui-ts/figures/animation.PNG b/en/application-dev/reference/arkui-ts/figures/animation.PNG deleted file mode 100644 index 92f92e0001a90840d03ebd00e0b0ef736c2a94c8..0000000000000000000000000000000000000000 Binary files a/en/application-dev/reference/arkui-ts/figures/animation.PNG and /dev/null differ diff --git a/en/application-dev/reference/arkui-ts/figures/animation.gif b/en/application-dev/reference/arkui-ts/figures/animation.gif index 6cfbc07fc5122be3ecd69e6b33b6f00c0f676a0f..e1f1e9d8eedba5f4d7e9895fe10c1028cb8e19bd 100644 Binary files a/en/application-dev/reference/arkui-ts/figures/animation.gif and b/en/application-dev/reference/arkui-ts/figures/animation.gif differ diff --git a/en/application-dev/reference/arkui-ts/figures/animation1.PNG b/en/application-dev/reference/arkui-ts/figures/animation1.PNG deleted file mode 100644 index 98cc1fa8c0537071549fa8185fa14f7ad103e7f8..0000000000000000000000000000000000000000 Binary files a/en/application-dev/reference/arkui-ts/figures/animation1.PNG and /dev/null differ diff --git a/en/application-dev/reference/arkui-ts/figures/animation1.gif b/en/application-dev/reference/arkui-ts/figures/animation1.gif new file mode 100644 index 0000000000000000000000000000000000000000..d4fae00973755cc243e1d48f10acf9ef4b24682e Binary files /dev/null and b/en/application-dev/reference/arkui-ts/figures/animation1.gif differ diff --git a/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001174104400.gif b/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001174104400.gif new file mode 100644 index 0000000000000000000000000000000000000000..da442c6a4f02d281bafff3f9fde8a51c6ebbf932 Binary files /dev/null and b/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001174104400.gif differ diff --git a/en/application-dev/reference/arkui-ts/ts-animatorproperty.md b/en/application-dev/reference/arkui-ts/ts-animatorproperty.md index f22e531ac3a0f8423c9e8de5af520a92d2828d5f..11ce9d0312a22f1e9c432d99716319589b551d43 100644 --- a/en/application-dev/reference/arkui-ts/ts-animatorproperty.md +++ b/en/application-dev/reference/arkui-ts/ts-animatorproperty.md @@ -14,13 +14,13 @@ Since API version 9, this API is supported in ArkTS widgets. | Name | Type | Mandatory | Description | | ---------- | ------------------------------------------| ---- | ------------------------------------------------------------ | -| duration | number | No | Animation duration, in ms.
Default value: **1000**
Since API version 9, this API is supported in ArkTS widgets.
**NOTE**
The maximum animation duration on an ArkTS widget is 1000 ms. If the set value exceeds the limit, the value **1000** will be used. | -| tempo | number | No | Animation playback speed. A greater value indicates a higher animation playback speed.
The value **0** indicates that no animation is applied.
Default value: **1**| -| curve | string \| [Curve](ts-appendix-enums.md#curve) \| ICurve9+ | No | Animation curve.
Default value: **Curve.Linear**
Since API version 9, this API is supported in ArkTS widgets. | -| delay | number | No | Delay of animation playback, in ms. The value **0** indicates that the playback is not delayed.
Default value: **0** | -| iterations | number | No | Number of times that the animation is played. The value **-1** indicates that the animation is played for an unlimited number of times.
Default value: **1**| +| duration | number | No | Animation duration, in ms.
Default value: **1000**
Unit: ms
Since API version 9, this API is supported in ArkTS widgets.
**NOTE**
- The maximum animation duration on an ArkTS widget is 1000 ms.
- A value less than 1 evaluates to the value **0**.
- If the value is of the floating point type, the value is rounded down. If the value is 1.2, the value **1** is used.| +| tempo | number | No | Animation playback speed. A larger value indicates a higher animation playback speed.
The value **0** indicates that no animation is applied.
Default value: **1**
**NOTE**
A value less than 1 evaluates to the value **1**.| +| curve | string \| [Curve](ts-appendix-enums.md#curve) \| ICurve9+ | No | Animation curve. The default curve is linear.
Default value: **Curve.Linear**
Since API version 9, this API is supported in ArkTS widgets.| +| delay | number | No | Delay of animation playback, in ms. The value **0** indicates that the playback is not delayed.
Default value: **0**
Value range: [0, +∞)
**NOTE**
A value less than 1 evaluates to the value **0**. If the value is of the floating point type, the value is rounded down. If the value is 1.2, the value **1** is used.| +| iterations | number | No | Number of times that the animation is played.
Default value: **1**
Value range: [-1, +∞)
**NOTE**
The value **-1** indicates that the animation is played for an unlimited number of times. The value **0** indicates that no animation is applied.| | playMode | [PlayMode](ts-appendix-enums.md#playmode) | No | Animation playback mode. By default, the animation is played from the beginning after the playback is complete.
Default value: **PlayMode.Normal**
Since API version 9, this API is supported in ArkTS widgets.| -| onFinish | () => void | No | Callback invoked when the animation playback is complete.
Since API version 9, this API is supported in ArkTS widgets.| +| onFinish | () => void | No | Callback invoked when the animation playback is complete.
Since API version 9, this API is supported in ArkTS widgets.
**NOTE**
This callback is not invoked when **iterations** is set to **-1**.| ## Example @@ -37,11 +37,11 @@ struct AttrAnimationExample { build() { Column() { - Button('change width and height') + Button('change size') .onClick(() => { if (this.flag) { - this.widthSize = 100 - this.heightSize = 50 + this.widthSize = 150 + this.heightSize = 60 } else { this.widthSize = 250 this.heightSize = 100 @@ -67,8 +67,8 @@ struct AttrAnimationExample { duration: 1200, curve: Curve.Friction, delay: 500, - iterations: -1, // The value -1 indicates that the animation is played for an unlimited number of times. - playMode: PlayMode.AlternateReverse + iterations: -1, // The value -1 indicates that the animation is played for an unlimited number of times. + playMode: PlayMode.Alternate }) }.width('100%').margin({ top: 20 }) } diff --git a/en/application-dev/reference/arkui-ts/ts-appendix-enums.md b/en/application-dev/reference/arkui-ts/ts-appendix-enums.md index 967d9a0f35c6e5ee71a4ebe8a09ceaed21305c53..02df27c18b45a96f6f409cf498a8b91b93c4641e 100644 --- a/en/application-dev/reference/arkui-ts/ts-appendix-enums.md +++ b/en/application-dev/reference/arkui-ts/ts-appendix-enums.md @@ -237,8 +237,8 @@ Since API version 9, this API is supported in ArkTS widgets. | Name | Description | | ------ | -------------------------------------------------- | | All | The transition takes effect in all scenarios.| -| Insert | The transition takes effect when a component is inserted. | -| Delete | The transition takes effect when a component is deleted. | +| Insert | The transition takes effect when a component is inserted or displayed.| +| Delete | The transition takes effect when a component is deleted or hidden.| ## RelateType @@ -307,12 +307,12 @@ Since API version 9, this API is supported in ArkTS widgets. | Name | Description | | -------- | ------------------------------------------------------------ | -| Auto | The default configuration in the flex container is used. | -| Start | The elements are in the flex container, top-aligned in the cross-axis direction. | -| Center | The elements are in the flex container, centered in the cross-axis direction. | -| End | The elements are in the flex container, bottom-aligned in the cross-axis direction. | -| Stretch | The elements are in the flex container, stretched and padded in the cross-axis direction. If the size is not set, the elements are stretched to the container size.| -| Baseline | The elements are in the flex container, text baseline aligned in the cross-axis direction. | +| Auto | The default configuration of the flex container is used. | +| Start | The items in the flex container are aligned with the cross-start edge. | +| Center | The items in the flex container are centered along the cross axis. | +| End | The items in the flex container are aligned with the cross-end edge. | +| Stretch | The items in the flex container are stretched and padded along the cross axis. If the flex container has the **Wrap** attribute set to **FlexWrap.Wrap** or **FlexWrap.WrapReverse**, the items are stretched to the cross size of the widest element on the current row or column. In other cases, the items with no size set are stretched to the container size.| +| Baseline | The items in the flex container are aligned in such a manner that their text baselines are aligned along the cross axis. | ## FlexDirection @@ -417,21 +417,21 @@ Since API version 9, this API is supported in ArkTS widgets. Since API version 9, this API is supported in ArkTS widgets. -| Name | Description | -| ------ | -------------- | -| Start | Aligned with the start.| -| Center | Horizontally centered.| -| End | Aligned with the end.| +| Name | Description | +| --------------------- | -------------- | +| Start | Aligned with the start.| +| Center | Horizontally centered.| +| End | Aligned with the end.| ## TextOverflow Since API version 9, this API is supported in ArkTS widgets. -| Name | Description | -| -------- | -------------------------------------- | -| Clip | Extra-long text is clipped. | -| Ellipsis | An ellipsis (...) is used to represent clipped text.| -| None | No clipping or ellipsis is used for extra-long text. | +| Name | Description | +| --------------------- | -------------------------------------- | +| Clip | Extra-long text is clipped. | +| Ellipsis | An ellipsis (...) is used to represent text overflow.| +| None | No clipping or ellipsis is used for text overflow. | ## TextDecorationType diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-button.md b/en/application-dev/reference/arkui-ts/ts-basic-components-button.md index 75d67936b62bf0ac72456673ef1474e4840cb9fd..036deb4f97a0c1f02e72a62d4c2a15e38e4e4ba5 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-components-button.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-components-button.md @@ -25,10 +25,9 @@ Since API version 9, this API is supported in ArkTS widgets. | type | ButtonType | No | Button type.
Default value: **ButtonType.Capsule** | | stateEffect | boolean | No | Whether to enable the pressed effect on the click of the button. The value **false** means to disable the pressed effect.
Default value: **true**| - **API 2:** Button(label?: ResourceStr, options?: { type?: ButtonType, stateEffect?: boolean }) - Creates a button component based on text content. In this case, the component cannot contain child components. +Creates a button component based on text content. In this case, the component cannot contain child components. Since API version 9, this API is supported in ArkTS widgets. @@ -39,15 +38,16 @@ Since API version 9, this API is supported in ArkTS widgets. | label | [ResourceStr](ts-types.md#resourcestr) | No | Button text. | | options | { type?: ButtonType, stateEffect?: boolean } | No | See parameters of API 1.| - ## Attributes +In addition to the [universal attributes](ts-universal-attributes-size.md), the following attributes are supported. + | Name | Type | Description | | ----------- | ----------- | --------------------------------- | | type | ButtonType | Button type.
Default value: **ButtonType.Capsule**
Since API version 9, this API is supported in ArkTS widgets.| | stateEffect | boolean | Whether to enable the pressed effect on the click of the button. The value **false** means to disable the pressed effect.
Default value: **true**
Since API version 9, this API is supported in ArkTS widgets.| -## ButtonType enums +## ButtonType Since API version 9, this API is supported in ArkTS widgets. @@ -58,11 +58,14 @@ Since API version 9, this API is supported in ArkTS widgets. | Normal | Normal button (without rounded corners by default). | > **NOTE** -> - The rounded corner of a button is set by using [borderRadius](ts-universal-attributes-border.md), rather than by using the **border** API. Only a button-wide rounded corner setting is supported. -> - For a button of the **Capsule** type, the **borderRadius** settings do not take effect, and its rounded corner is always half of the button height. +> - The rounded corner of a button is set by using [borderRadius](ts-universal-attributes-border.md), rather than by using the **border** API. Only a rounded corner whose parameter is [Length](ts-types.md#length) is supported. +> - For a button of the **Capsule** type, the **borderRadius** settings do not take effect, and the radius of its rounded corner is always half of the button height or width, whichever is smaller. > - For a button of the **Circle** type, its radius is the value of **borderRadius** (if set) or the width or height (whichever is smaller). > - The button text is set using the [text style attributes](ts-universal-attributes-text-style.md). +> - Before setting the [gradient color](ts-universal-attributes-gradient-color.md), you need to set [backgroundColor](ts-universal-attributes-background.md) to transparent. + +The [universal events](ts-universal-events-click.md) are supported. ## Example diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-datapanel.md b/en/application-dev/reference/arkui-ts/ts-basic-components-datapanel.md index 08d913698286ee0cb2cbfbc66386cd4a52a45bc9..f65895eba487b20b68d4dc26f74f5c5493f3dccb 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-components-datapanel.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-components-datapanel.md @@ -24,10 +24,20 @@ Since API version 9, this API is supported in ArkTS widgets. | Name | Type | Mandatory | Description| | ----------------- | -------- | ----- | -------- | -| values | number[] | Yes | Data value list. A maximum of nine values are supported. If more than nine values are set, only the first nine ones are used. If the value is less than 0, the value 0 is used.| +| values | number[] | Yes | Data value list. A maximum of nine values are supported. If more than nine values are set, only the first nine ones are used. A value less than 0 evaluates to the value **0**. | | max | number | No | - When set to a value greater than 0, this parameter indicates the maximum value in the **values** list.
- When set to a value equal to or smaller than 0, this parameter indicates the sum of values in the **values** list. The values are displayed in proportion.
Default value: **100**| | type8+ | [DataPanelType](#datapaneltype) | No| Type of the data panel (dynamic modification is not supported).
Default value: **DataPanelType.Circle**| +## Attributes + +In addition to the [universal attributes](ts-universal-attributes-size.md), the following attributes are supported. + +| Name | Type | Description | +| ----------- | ------- | -------------------------------------------- | +| closeEffect | boolean | Whether to disable the rotation effect for the component.
Default value: **false**| + + + ## DataPanelType Since API version 9, this API is supported in ArkTS widgets. diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-divider.md b/en/application-dev/reference/arkui-ts/ts-basic-components-divider.md index cee85008404560b115d9dc021ed98e59da47d36a..f4b378341d89b821c42ac0bfec8f47c0c023dc92 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-components-divider.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-components-divider.md @@ -25,16 +25,11 @@ In addition to the [universal attributes](ts-universal-attributes-size.md), the | Name | Type | Description | | ----------- | ---------- | ------------------ | | vertical | boolean | Whether a vertical divider is used. **false**: A horizontal divider is used.
**true**: A vertical divider is used.
Default value: **false**
Since API version 9, this API is supported in ArkTS widgets.| -| color | [ResourceColor](ts-types.md#resourcecolor) | Color of the divider.
Since API version 9, this API is supported in ArkTS widgets.| -| strokeWidth | number \| string | Width of the divider.
Default value: **1**
Since API version 9, this API is supported in ArkTS widgets.| +| color | [ResourceColor](ts-types.md#resourcecolor) | Color of the divider.
Default value: **'\#33182431'**
Since API version 9, this API is supported in ArkTS widgets. | +| strokeWidth | number \| string | Width of the divider.
Default value: **1**
Unit: vp
Since API version 9, this API is supported in ArkTS widgets.
**NOTE**
This attribute cannot be set to a percentage. | | lineCap | [LineCapStyle](ts-appendix-enums.md#linecapstyle) | Cap style of the divider.
Default value: **LineCapStyle.Butt**
Since API version 9, this API is supported in ArkTS widgets.| -## Events - -The universal events are not supported. - - ## Example ```ts diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-image.md b/en/application-dev/reference/arkui-ts/ts-basic-components-image.md index a2162ebc684e42bd3f9cd9341fe18fd07505cb56..a53546a07c3a570f44824f72114f300ad8f60d3c 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-components-image.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-components-image.md @@ -80,11 +80,11 @@ Since API version 9, this API is supported in ArkTS widgets. In addition to the [universal events](ts-universal-events-click.md), the following events are supported. -| Name | Description | +| Name | Description | | ------------------------------------------------------------ | ------------------------------------------------------------ | -| onComplete(callback: (event?: { width: number, height: number, componentWidth: number,
componentHeight: number, loadingStatus: number }) => void) | Triggered when an image is successfully loaded. The size of the loaded image is returned.
- **width**: width of the image, in pixels.
- **height**: height of the image, in pixels.
- **componentWidth**: width of the container component, in pixels.
- **componentHeight**: height of the container component, in pixels.
- **loadingStatus**: image loading status.
Since API version 9, this API is supported in ArkTS widgets.| -| onError(callback: (event?: { componentWidth: number, componentHeight: number , message9+: string }) => void) | Triggered when an exception occurs during image loading.
- **componentWidth**: width of the container component, in pixels.
- **componentHeight**: height of the container component, in pixels.
Since API version 9, this API is supported in ArkTS widgets.| -| onFinish(event: () => void) | Triggered when the animation playback in the loaded SVG image is complete. If the animation is an infinite loop, this callback is not triggered.
Since API version 9, this API is supported in ArkTS widgets.| +| onComplete(callback: (event?: { width: number, height: number, componentWidth: number,
componentHeight: number, loadingStatus: number }) => void) | Triggered when an image is successfully loaded. The size of the loaded image is returned.
- **width**: width of the image, in pixels.
- **height**: height of the image, in pixels.
- **componentWidth**: width of the container component, in pixels.
- **componentHeight**: height of the container component, in pixels.
- **loadingStatus**: image loading status. The value **1** means that the image is successfully loaded, and **0** means the opposite.
Since API version 9, this API is supported in ArkTS widgets. | +| onError(callback: (event?: { componentWidth: number, componentHeight: number , message9+: string }) => void) | Triggered when an exception occurs during image loading.
- **componentWidth**: width of the container component, in pixels.
- **componentHeight**: height of the container component, in pixels.
Since API version 9, this API is supported in ArkTS widgets. | +| onFinish(event: () => void) | Triggered when the animation playback in the loaded SVG image is complete. If the animation is an infinite loop, this callback is not triggered.
Since API version 9, this API is supported in ArkTS widgets. | ## Example diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-qrcode.md b/en/application-dev/reference/arkui-ts/ts-basic-components-qrcode.md index 8ae6b8443439678c5e10fda4c566edfa3037563b..85745ba42d26583d369fe5f652c756ae318440f5 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-components-qrcode.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-components-qrcode.md @@ -2,7 +2,7 @@ The **\** component is used to display a QR code. -> **NOTE** +> **NOTE** > > This component is supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version. @@ -36,7 +36,7 @@ In addition to the [universal attributes](ts-universal-attributes-size.md), the ## Events -Among all the universal events, only the [click event](ts-universal-events-click.md) is supported. +Among the universal events, the [click event](ts-universal-events-click.md), [touch event](ts-universal-events-touch.md), and [show/hide event](ts-universal-events-show-hide.md) are supported. ## Example diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-rating.md b/en/application-dev/reference/arkui-ts/ts-basic-components-rating.md index d78f3a705501daf305b4d3ee01a33a57c568a6a0..eb3d4489f8cadd3df86f727fe68be24596b407ee 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-components-rating.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-components-rating.md @@ -32,7 +32,7 @@ Since API version 9, this API is supported in ArkTS widgets. | -------- | -------- | -------- | | stars | number | Total number of stars.
Default value: **5**
Since API version 9, this API is supported in ArkTS widgets.| | stepSize | number | Step of an operation.
Default value: **0.5**
Since API version 9, this API is supported in ArkTS widgets.| -| starStyle | {
backgroundUri: string,
foregroundUri: string,
secondaryUri?: string
} | **backgroundUri**: image link of the unselected star. You can use the default image or a custom local image.
**foregroundUri**: image path of the selected star. You can use the default image or a custom local image.
**secondaryUir**: image path of the partially selected star. You can use the default image or a custom local image.
Since API version 9, this API is supported in ArkTS widgets.| +| starStyle | {
backgroundUri: string,
foregroundUri: string,
secondaryUri?: string
} | Star style.
**backgroundUri**: image path for the unselected star. You can use the default system image or a custom image.
**foregroundUri**: image path for the selected star. You can use the default system image or a custom image.
**secondaryUir**: image path for the partially selected star. You can use the default system image or a custom image.
Since API version 9, this API is supported in ArkTS widgets.
**NOTE**
For details about the image types supported by the **startStyle** attribute, see [Image](ts-basic-components-image.md).
Local and online images are supported, but not **PixelMap** and **Resource** objects.
By default, the image is loaded in asynchronous mode. Synchronous loading is not supported.| ## Events diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-slider.md b/en/application-dev/reference/arkui-ts/ts-basic-components-slider.md index bea534a1a1861e1ad2183d0ed1455127f762c65c..d16baa17d64de593d8f559d5de19ed5ded17ab30 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-components-slider.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-components-slider.md @@ -50,7 +50,7 @@ Except touch target attributes, the universal attributes are supported. | trackColor | [ResourceColor](ts-types.md#resourcecolor) | Background color of the slider.
Since API version 9, this API is supported in ArkTS widgets.| | selectedColor | [ResourceColor](ts-types.md#resourcecolor) | Color of the selected part of the slider track.
Since API version 9, this API is supported in ArkTS widgets.| | showSteps | boolean | Whether to display the current step.
Default value: **false**
Since API version 9, this API is supported in ArkTS widgets.| -| showTips | boolean | Whether to display a bubble to indicate the percentage when the user drags the slider.
Default value: **false**
Since API version 9, this API is supported in ArkTS widgets.| +| showTips | boolean | Whether to display a bubble to indicate the percentage when the user drags the slider.
Default value: **false**
Since API version 9, this API is supported in ArkTS widgets.
**NOTE**
When **direction** is set to **Axis.Horizontal**, the bubble is displayed right above the slider. When **direction** is set to **Axis.Vertical**, the bubble is displayed on the left of the slider.
The drawing area of the bubble is the overlay of the slider.
If no margin is set for the slider or the margin is not large enough, the bubble will be clipped.| | trackThickness | [Length](ts-types.md#length) | Track thickness of the slider.
Since API version 9, this API is supported in ArkTS widgets.| @@ -60,7 +60,7 @@ In addition to the **OnAppear** and **OnDisAppear** universal events, the follow | Name| Description| | -------- | -------- | -| onChange(callback: (value: number, mode: SliderChangeMode) => void) | Invoked when the slider slides.
**value**: current slider value. If the return value contains decimals, you can use **Math.toFixed()** to process the data to the desired precision.
**mode**: dragging state.
Since API version 9, this API is supported in ArkTS widgets.| +| onChange(callback: (value: number, mode: SliderChangeMode) => void) | Invoked when the slider is dragged or clicked.
**value**: current slider value. If the return value contains decimals, you can use **Math.toFixed()** to process the data to the desired precision.
**mode**: state triggered by the event.
Since API version 9, this API is supported in ArkTS widgets.
**NOTE**
The **Begin** and **End** states are triggered when the slider is clicked with a gesture. The **Moving** and **Click** states are triggered when the value of **value** changes.
If the coherent action is a drag action, the **Click** state will not be triggered.
The value range of **value** is the **steps** value array.| ## SliderChangeMode @@ -68,9 +68,9 @@ Since API version 9, this API is supported in ArkTS widgets. | Name| Value| Description| | -------- | -------- | -------- | -| Begin | 0 | The user starts to drag the slider.| +| Begin | 0 | The user touches or presses the slider with a gesture or mouse.| | Moving | 1 | The user is dragging the slider.| -| End | 2 | The user stops dragging the slider.| +| End | 2 | The user stops dragging the slider by lifting their finger or releasing the mouse.| | Click | 3 | The user moves the slider by touching the slider track.| diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-textarea.md b/en/application-dev/reference/arkui-ts/ts-basic-components-textarea.md index e4b6ba1ad47c9e06f3f26e6b47f4afd505b6aa36..48970be3a76da10962f6a1576dcc5d25750b1469 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-components-textarea.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-components-textarea.md @@ -38,6 +38,10 @@ In addition to the [universal attributes](ts-universal-attributes-size.md), the | inputFilter8+ | {
value: [ResourceStr](ts-types.md#resourcestr),
error?: (value: string) => void
} | 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.
- **value**: regular expression to set.
- **error**: filtered-out content to return when regular expression matching fails.| | copyOption9+ | [CopyOptions](ts-appendix-enums.md#copyoptions9) | Whether copy and paste is allowed.
If this attribute is set to **CopyOptions.None**, the paste operation is allowed, but not the copy or cut operation.| +> **NOTE** +> +> The default value of the universal attribute [padding](ts-universal-attributes-size.md) is as follows: { top: 8 vp, right: 16 vp, bottom: 8 vp, left: 16 vp } + ## Events @@ -72,7 +76,6 @@ Sets the position of the caret. | ------ | -------- | ---- | -------------------------------------- | | value | number | Yes | Length from the start of the string to the position where the caret is located.| - ## Example ```ts @@ -86,6 +89,7 @@ struct TextAreaExample { build() { Column() { TextArea({ + text: this.text, placeholder: 'The text area can hold an unlimited amount of text. input your word...', controller: this.controller }) diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-textinput.md b/en/application-dev/reference/arkui-ts/ts-basic-components-textinput.md index aef50da2fed1f32ad0ceb82aecbf7006fcbae009..b77cb3e53a6136c6dc4d407efcb9ed14dc390f2e 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-components-textinput.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-components-textinput.md @@ -31,18 +31,22 @@ In addition to the [universal attributes](ts-universal-attributes-size.md), the | Name | Type | Description | | ------------------------ | ---------------------------------------- | ---------------------------------------- | -| type | InputType | Input box type.
Default value: **InputType.Normal** | +| type | InputType | Input box type.
Default value: **InputType.Normal** | | placeholderColor | [ResourceColor](ts-types.md#resourcecolor) | Placeholder text color.| | placeholderFont | [Font](ts-types.md#font) | Placeholder text font.| -| enterKeyType | EnterKeyType | Type of the Enter key. Currently, only the default value is supported.
Default value: **EnterKeyType.Done**| +| enterKeyType | EnterKeyType | Type of the Enter key. Only the default value is supported.
Default value: **EnterKeyType.Done**| | caretColor | [ResourceColor](ts-types.md#resourcecolor) | Color of the caret in the text box. | | maxLength | number | Maximum number of characters in the text input. | -| inputFilter8+ | {
value: [ResourceStr](ts-types.md#resourcestr),
error?: (value: string) => void
} | 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.
- **value**: regular expression to set.
- **error**: filtered-out content to return when regular expression matching fails.| +| inputFilter8+ | {
value: [ResourceStr](ts-types.md#resourcestr),
error?: (value: string) => void
} | 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.
- **value**: regular expression to set.
- **error**: filtered-out content to return when regular expression matching fails.| | copyOption9+ | [CopyOptions](ts-appendix-enums.md#copyoptions9) | Whether copy and paste is allowed.
If this attribute is set to **CopyOptions.None**, the paste operation is allowed, but not the copy or cut operation.| | showPasswordIcon9+ | boolean | Whether to display the show password icon at the end of the password text box.
Default value: **true**| | style9+ | TextInputStyle | Text input style.
Default value: **TextInputStyle.Default**| | textAlign9+ | [TextAlign](ts-appendix-enums.md#textalign) | Alignment mode of the text in the text box.
Default value: **TextAlign.Start** | +> **NOTE** +> +> The default value of the universal attribute [padding](ts-universal-attributes-size.md) is as follows:
{
top: 8 vp,
right: 16 vp,
bottom: 16 vp,
left: 8 vp
} + ## EnterKeyType | Name | Description | @@ -74,12 +78,12 @@ In addition to the [universal attributes](ts-universal-attributes-size.md), the In addition to the [universal events](ts-universal-events-click.md), the following events are supported. -| Name | Description | -| ---------------------------------------- | ---------------------------------------- | -| onChange(callback: (value: string) => void) | Triggered when the input changes. | -| onSubmit(callback: (enterKey: EnterKeyType) => void) | Triggered when the Enter key on the keyboard is pressed. The return value is the current type of the Enter key. | -| onEditChanged(callback: (isEditing: boolean) => void)(deprecated) | Triggered when the input status changes. Sicne API version 8, **onEditChange** is recommended. | -| onEditChange(callback: (isEditing: boolean) => void)8+ | Triggered when the input status changes. If the value of **isEditing** is **true**, text input is in progress. | +| Name | Description | +| ------------------------------------------------------------ | ------------------------------------------------------------ | +| onChange(callback: (value: string) => void) | Triggered when the input changes.
**value**: text content.| +| onSubmit(callback: (enterKey: EnterKeyType) => void) | Triggered when the Enter key on the keyboard is pressed. The return value is the current type of the Enter key.
**enterKeyType**: type of the Enter key. For details, see [EnterKeyType](#enterkeytype).| +| onEditChanged(callback: (isEditing: boolean) => void)(deprecated) | Triggered when the input status changes. Since API version 8, **onEditChange** is recommended.| +| onEditChange(callback: (isEditing: boolean) => void)8+ | Triggered when the input status changes. If the value of **isEditing** is **true**, text input is in progress. | | onCopy(callback:(value: string) => void)8+ | Triggered when the copy button on the pasteboard, which displays when the text box is long pressed, is clicked.
**value**: text to be copied.| | onCut(callback:(value: string) => void)8+ | Triggered when the cut button on the pasteboard, which displays when the text box is long pressed, is clicked.
**value**: text to be cut.| | onPaste(callback:(value: string) => void)8+ | Triggered when the paste button on the pasteboard, which displays when the text box is long pressed, is clicked.
**value**: text to be pasted.| @@ -104,7 +108,6 @@ Sets the position of the caret. | ------ | -------- | ---- | -------------------------------------- | | value | number | Yes | Length from the start of the string to the position where the caret is located.| - ## Example ```ts @@ -117,7 +120,7 @@ struct TextInputExample { build() { Column() { - TextInput({ placeholder: 'input your word...', controller: this.controller }) + TextInput({ text: this.text, placeholder: 'input your word...', controller: this.controller }) .placeholderColor(Color.Grey) .placeholderFont({ size: 14, weight: 400 }) .caretColor(Color.Blue) diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-toggle.md b/en/application-dev/reference/arkui-ts/ts-basic-components-toggle.md index 7c3994074a9bf4124800346196515150f020ffc6..17aba7ea6f738561443a049ec3e0e54674fa3f4c 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-components-toggle.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-components-toggle.md @@ -35,21 +35,23 @@ Since API version 9, this API is supported in ArkTS widgets. | Name | Description | | -------- | ---------------- | -| Checkbox | Check box type.
**NOTE**
The default value of the universal attribute [padding](ts-universal-attributes-size.md) is as follows:
{
top: 14 vp,
right: 6 vp,
bottom: 14 vp,
left: 6 vp
} | +| Checkbox | Check box type.
**NOTE**
The default value of the universal attribute [margin](ts-universal-attributes-size.md) is as follows:
{
top: 12 vp,
right: 12 vp,
bottom: 12 vp,
left: 12 vp
} | | Button | Button type. The set string, if any, will be displayed inside the button. | -| Switch | Switch type.
**NOTE**
The default value of the universal attribute [padding](ts-universal-attributes-size.md) is as follows:
{
top: 12 vp,
right: 12 vp,
bottom: 12 vp,
left: 12 vp
} | - +| Switch | Switch type.
**NOTE**
The default value of the universal attribute [margin](ts-universal-attributes-size.md) is as follows:
{
top: 14 vp,
right:6 vp,
bottom: 6 vp,
left: 14 vp
} | ## Attributes +In addition to the [universal attributes](ts-universal-attributes-size.md), the following attributes are supported. + | Name | Parameter | Description | | ---------------- | --------------------------- | ---------------------- | | selectedColor | [ResourceColor](ts-types.md#resourcecolor) | Background color of the component when it is turned on.
Since API version 9, this API is supported in ArkTS widgets.| | switchPointColor | [ResourceColor](ts-types.md#resourcecolor) | Color of the circular slider when the component is of the **Switch** type.
**NOTE**
This attribute is valid only when **type** is set to **ToggleType.Switch**.
Since API version 9, this API is supported in ArkTS widgets.| - ## Events +In addition to the [universal events](ts-universal-events-click.md), the following events are supported. + | Name| Description| | -------- | -------- | | onChange(callback: (isOn: boolean) => void) | Triggered when the toggle status changes.
Since API version 9, this API is supported in ArkTS widgets.| diff --git a/en/application-dev/reference/arkui-ts/ts-basic-gestures-pangesture.md b/en/application-dev/reference/arkui-ts/ts-basic-gestures-pangesture.md index 4b8520cfa0e7a2b173eda68caa17d379f5c42759..e1e0af8f5fa486e762f569c7a9f1f628147f9e64 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-gestures-pangesture.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-gestures-pangesture.md @@ -17,7 +17,7 @@ PanGesture(value?: { fingers?: number; direction?: PanDirection; distance?: numb | Name| Type| Mandatory| Description| | -------- | -------- | -------- | -------- | -| fingers | number | No| Minimum number of fingers to trigger a pan gesture. The value ranges from 1 to 10.
Default value: **1**| +| fingers | number | No| Minimum number of fingers to trigger a pan gesture. The value ranges from 1 to 10.
Default value: **1**
Value range: 1 to 10
**NOTE**
If the value is less than 1 or is not set, the default value is used.| | direction | PanDirection | No| Pan direction. The enumerated value supports the AND (&) and OR (\|) operations.
Default value: **PanDirection.All**| | distance | number | No| Minimum pan distance to trigger the gesture, in vp.
Default value: **5**
**NOTE**
If a pan gesture and [tab](ts-container-tabs.md) swipe occur at the same time, set **distance** to **1** so that the gesture can be more easily recognized.| diff --git a/en/application-dev/reference/arkui-ts/ts-basic-gestures-tapgesture.md b/en/application-dev/reference/arkui-ts/ts-basic-gestures-tapgesture.md index 03109744f1cdc09ed7b2d9f7d7687db8944f602f..ef9a851b418959eeb04ed06675815d82a9bd7dc4 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-gestures-tapgesture.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-gestures-tapgesture.md @@ -1,6 +1,6 @@ # TapGesture -**TapGesture** is used to trigger a tap gesture with one or more taps. +**TapGesture** is used to trigger a tap gesture with one, two, or more taps. > **NOTE** > @@ -15,8 +15,8 @@ TapGesture(value?: { count?: number, fingers?: number }) | Name| Type| Mandatory| Description| | -------- | -------- | -------- | -------- | -| count | number | No| Number of consecutive taps. If this parameter is set to a value less than **1**, the default value will be used.
Default value: **1**
> **NOTE**
> If multi-tap is configured, the timeout interval between a lift and the next tap is 300 ms.| -| fingers | number | No| Number of fingers required to trigger a tap. The value ranges from 1 to 10.
Default value: **1**
> **NOTE**
> 1. When multi-finger is configured, the gesture will fail to be recognized if the number of fingers used for tapping is less than the configured number within 300 ms of tapping by the first finger.
> 2. The gesture will fail to be recognized if the number of fingers used for tapping exceeds the configured number.| +| count | number | No| Number of consecutive taps. If the value is less than 1 or is not set, the default value is used.
Default value: **1**
**NOTE**
If multi-tap is configured, the timeout interval between a lift and the next tap is 300 ms.| +| fingers | number | No| Number of fingers required to trigger a tap. The value ranges from 1 to 10. If the value is less than 1 or is not set, the default value is used.
Default value: **1**
**NOTE**
1. When multi-finger is configured, if the number of fingers used for tap does not reach the specified number within 300 ms after the first finger is tapped, the gesture fails to be recognized.
2. Gesture recognition fails if the number of fingers used for tap exceeds the configured number.| ## Events diff --git a/en/application-dev/reference/arkui-ts/ts-container-flex.md b/en/application-dev/reference/arkui-ts/ts-container-flex.md index 6a5908578950850fbedda096b33f03c858097cd0..327533e907cef5e8b76dcba472e1258d164e252e 100644 --- a/en/application-dev/reference/arkui-ts/ts-container-flex.md +++ b/en/application-dev/reference/arkui-ts/ts-container-flex.md @@ -6,6 +6,7 @@ The **\** component allows for flexible layout of child components. > > - This component is supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version. > - The **\** component adapts the layout of flex items during rendering. This may affect the performance. Therefore, you are advised to use **[\](ts-container-column.md)** or **[\](ts-container-row.md)** instead under scenarios where consistently high performance is required. +> - If the main axis of the **\** component is not set, it follows the size of the parent container. On the contrary, if the main axis of the [\](ts-container-column.md) or [\](ts-container-row.md) component is not set, it follows the size of their child component. ## Child Components diff --git a/en/application-dev/reference/arkui-ts/ts-explicit-animation.md b/en/application-dev/reference/arkui-ts/ts-explicit-animation.md index 1cee9be56077b524b2bb71e098336701e7dd9593..3e756f519e74b7f851b3af2401e7272eb133a4a9 100644 --- a/en/application-dev/reference/arkui-ts/ts-explicit-animation.md +++ b/en/application-dev/reference/arkui-ts/ts-explicit-animation.md @@ -42,7 +42,7 @@ struct AnimateToExample { build() { Column() { - Button('change width and height') + Button('change size') .width(this.widthSize) .height(this.heightSize) .margin(30) @@ -57,8 +57,8 @@ struct AnimateToExample { console.info('play end') } }, () => { - this.widthSize = 100 - this.heightSize = 50 + this.widthSize = 150 + this.heightSize = 60 }) } else { animateTo({}, () => { @@ -77,7 +77,7 @@ struct AnimateToExample { curve: Curve.Friction, delay: 500, iterations: -1, // The value -1 indicates that the animation is played for an unlimited number of times. - playMode: PlayMode.AlternateReverse, + playMode: PlayMode.Alternate, onFinish: () => { console.info('play end') } @@ -90,10 +90,4 @@ struct AnimateToExample { } ``` -The figure below shows two buttons in their initial state. - -![animation](figures/animation.PNG) - -Clicking the first button plays the animation of resizing the button, and clicking the second button plays the animation of rotating the button clockwise by 90 degrees. The figure below shows the two buttons when the animations have finished. - -![animation1](figures/animation1.PNG) +![animation1](figures/animation1.gif) diff --git a/en/application-dev/reference/arkui-ts/ts-media-components-video.md b/en/application-dev/reference/arkui-ts/ts-media-components-video.md index feb0d96571dd263205252f8c849b5a0f6ee967b1..0c143bd234578db616fb7a86fccca80cb592b983 100644 --- a/en/application-dev/reference/arkui-ts/ts-media-components-video.md +++ b/en/application-dev/reference/arkui-ts/ts-media-components-video.md @@ -118,9 +118,9 @@ Requests full-screen mode. **Parameters** -| Name | Type | Mandatory | Description | -| ----- | ------- | ---- | --------------------- | -| value | boolean | Yes | Whether the playback is in full-screen mode.
Default value: **false**| +| Name| Type| Mandatory| Description | +| ------ | -------- | ---- | -------------------------------------------------- | +| value | boolean | Yes | Whether to play the video in full screen mode within the application window.
Default value: **false**| ### exitFullscreen @@ -173,7 +173,7 @@ struct VideoCreateComponent { previewUri: this.previewUri, currentProgressRate: this.curRate, controller: this.controller - }).width(800).height(600) + }).width('100%').height(600) .autoPlay(this.isAutoPlay) .controls(this.showControls) .onStart(() => { @@ -186,7 +186,7 @@ struct VideoCreateComponent { console.info('onFinish') }) .onError(() => { - console.info('onFinish') + console.info('onError') }) .onPrepared((e) => { console.info('onPrepared is ' + e.duration) diff --git a/en/application-dev/reference/arkui-ts/ts-motion-path-animation.md b/en/application-dev/reference/arkui-ts/ts-motion-path-animation.md index f32762ea1dd342ff52e4ff80c4bc7fb4245b6137..fd98aadd3525b1d6d37262125bdc544833e9d129 100644 --- a/en/application-dev/reference/arkui-ts/ts-motion-path-animation.md +++ b/en/application-dev/reference/arkui-ts/ts-motion-path-animation.md @@ -11,7 +11,7 @@ The motion path animation is used to animate a component along a custom path. | Name| Type| Default Value| Description| | -------- | -------- | -------- | -------- | -| motionPath | {
path: string,
from?: number,
to?: number,
rotatable?: boolean
}
**NOTE**
In a path, **start** and **end** can be used to replace the start point and end point. Example:
'Mstart.x start.y L50 50 Lend.x end.y Z'
For more information, see [Path Drawing](../../ui/ui-js-components-svg-path.md).| {
'',
0.0,
1.0,
false
} | Motion path of the component.
- **path**: motion path of the translation animation. The value is an SVG path string.
- **from**: start point of the motion path. The default value is **0.0**.
- **to**: end point of the motion path. The default value is **1.0**.
- **rotatable**: whether to rotate along the path. | +| motionPath | {
path: string,
from?: number,
to?: number,
rotatable?: boolean
}
**NOTE**
In a path, **start** and **end** can be used to replace the start point and end point. Example:
'Mstart.x start.y L50 50 Lend.x end.y Z'
For more information, see [Path Drawing](../../ui/ui-js-components-svg-path.md).| {
'',
0.0,
1.0,
false
} | Motion path of the component.
- **path**: motion path of the translation animation. The value is an SVG path string.
- **from**: start point of the motion path.
Default value: **0.0**
Value range: [0, 1]
A value less than 0 evaluates to the value **0**. A value greater than 1 evaluates to the value **1**.
- **to**: end point of the motion path.
Default value: **1.0**
Value range: [0, 1]
A value less than 0 evaluates to the value **0**. A value larger than 1 evaluates to the value **1**.
- **rotatable**: whether to rotate along the path. | ## Example @@ -25,7 +25,7 @@ struct MotionPathExample { build() { Column() { - Button('click me') + Button('click me').margin(50) // Execute the animation: Move from the start point to (300,200), then to (300,500), and finally to the end point. .motionPath({ path: 'Mstart.x start.y L300 200 L300 500 Lend.x end.y', from: 0.0, to: 1.0, rotatable: true }) .onClick(() => { @@ -38,4 +38,4 @@ struct MotionPathExample { } ``` -![en-us_image_0000001212378420](figures/en-us_image_0000001212378420.gif) +![en-us_image_0000001174104400](figures/en-us_image_0000001174104400.gif) diff --git a/en/application-dev/reference/arkui-ts/ts-page-transition-animation.md b/en/application-dev/reference/arkui-ts/ts-page-transition-animation.md index fe419d713fe257eb593064363f8e1e8d1afe0e92..5cd36a45df7a1b6720be03d6ca9fe59d5f555cbf 100644 --- a/en/application-dev/reference/arkui-ts/ts-page-transition-animation.md +++ b/en/application-dev/reference/arkui-ts/ts-page-transition-animation.md @@ -1,6 +1,6 @@ # Page Transition -The page transition navigates users between pages. You can customize page transitions by configuring the page entrance and exit components in the global **pageTransition** API. +The page transition navigates users between pages. You can customize page transitions by configuring the page entrance and exit components in the **pageTransition** API. > **NOTE** > @@ -8,12 +8,12 @@ The page transition navigates users between pages. You can customize page transi > -| Name | Parameter | Description | -| ------------------- | ------------------------------------------------------------ | ------------------------------------------------------------ | -| PageTransitionEnter | {
type?: RouteType,
duration?: number,
curve?: [Curve](ts-appendix-enums.md#curve) \| string,
delay?: number
} | Page entrance animation.
- **type**: route type for the page transition effect to take effect.
Default value: **RouteType.None**
**Note**: If no match is found, the default page transition effect is used (which may vary according to the device). To disable the default page transition effect, set **duration** to **0**.
- **duration**: animation duration, in milliseconds.
- **curve**: animation curve. The value of the string type can be any of the following: "ease", "ease-in", "ease-out", "ease-in-out", "extreme-deceleration", "fast-out-linear-in", "fast-out-slow-in", "friction", "linear", "linear-out-slow-in", "rhythm", "sharp", "smooth".
Default value: **Curve.Linear**
- **delay**: animation delay, in milliseconds. By default, the animation is played without delay.| -| PageTransitionExit | {
type?: RouteType,
duration?: number,
curve?: [Curve](ts-appendix-enums.md#curve) \| string,
delay?: number
} | Page exit animation.
- **type**: route type for the page transition effect to take effect.
Default value: **RouteType.None**
**Note**: If no match is found, the default page transition effect is used (which may vary according to the device). To disable the default page transition effect, set **duration** to **0**.
- **duration**: animation duration, in milliseconds.
- **curve**: animation curve. The value range of the string type is the same as that of **PageTransitionEnter**.
Default value: **Curve.Linear**
- **delay**: animation delay, in milliseconds. By default, the animation is played without delay.| +| Name | Parameter | Mandatory| Description | +| ------------------- | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | +| PageTransitionEnter | {
type?: RouteType,
duration?: number,
curve?: [Curve](ts-appendix-enums.md#curve) \| string,
delay?: number
} | No | Page entrance animation.
- **type**: route type for the page transition effect to take effect.
Default value: **RouteType.None**
**NOTE**
If no match is found, the default page transition effect is used (which may vary according to the device). To disable the default page transition effect, set **duration** to **0**.
- **duration**: animation duration.
Unit: ms
- **curve**: animation curve. The value of the string type can be any of the following: "ease", "ease-in", "ease-out", "ease-in-out", "extreme-deceleration", "fast-out-linear-in", "fast-out-slow-in", "friction", "linear", "linear-out-slow-in", "rhythm", "sharp", "smooth".
Default value: **Curve.Linear**
- **delay**: animation delay.
Default value: **0**
Unit: ms| +| PageTransitionExit | {
type?: RouteType,
duration?: number,
curve?: [Curve](ts-appendix-enums.md#curve) \| string,
delay?: number
} | No | Page exit animation.
- **type**: route type for the page transition effect to take effect.
Default value: **RouteType.None**
**NOTE**
If no match is found, the default page transition effect is used (which may vary according to the device). To disable the default page transition effect, set **duration** to **0**.
- **duration**: animation duration, in milliseconds.
- **curve**: animation curve. The value range of the string type is the same as that of **PageTransitionEnter**.
Default value: **Curve.Linear**
- **delay**: animation delay.
Default value: **0**
Unit: ms| -## RouteType enums +## RouteType | Name| Description | | ---- | ------------------------------------------------------------ | @@ -28,7 +28,7 @@ The page transition navigates users between pages. You can customize page transi | --------- | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | | slide | [SlideEffect](#slideeffect) | No | Slide effect during page transition.
Default value: **SlideEffect.Right**| | translate | {
x? : number \| string,
y? : number \| string,
z? : number \| string
} | No | Translation effect during page transition, which is the value of the start point of entrance and the end point of exit. When this parameter is set together with **slide**, the latter takes effect by default.
- **x**: translation distance along the x-axis.
- **y**: translation distance along the y-axis.
- **z**: translation distance along the y-axis.| -| scale | {
x? : number,
y? : number,
z? : number,
centerX? : number \| string,
centerY? : number \| string
} | No | Scaling effect during page transition, which is the value of the start point of entrance and the end point of exit.
- **x**: scale ratio along the x-axis.
- **y**: scale ratio along the y-axis.
- **z**: scale ratio along the z-axis.
- **centerX** and **centerY**: scale center point.
- If the center point is 0, it refers to the upper left corner of the component.
| +| scale | {
x? : number,
y? : number,
z? : number,
centerX? : number \| string,
centerY? : number \| string
} | No | Scaling effect during page transition, which is the value of the start point of entrance and the end point of exit.
- **x**: scale ratio along the x-axis.
- **y**: scale ratio along the y-axis.
- **z**: scale ratio along the z-axis.
- **centerX** and **centerY**: scale center point.
- If the center point is 0, it refers to the upper left corner of the component. | | opacity | number | No | Opacity, which is the opacity value of the start point of entrance or the end point of exit.
Default value: **1**| ## SlideEffect @@ -43,10 +43,10 @@ The page transition navigates users between pages. You can customize page transi ## Events -| Name | Description | +| Name | Description | | ------------------------------------------------------------ | ------------------------------------------------------------ | -| onEnter(event: (type?: RouteType, progress?: number) => void) | The callback input parameter is the normalized progress of the current entrance animation. The value range is 0–1.
- **type**: route type.
- **progress**: current progress.| -| onExit(event: (type?: RouteType, progress?: number) => void) | The callback input parameter is the normalized progress of the current exit animation. The value range is 0–1.
- **type**: route type.
- **progress**: current progress.| +| onEnter(event: (type?: RouteType, progress?: number) => void) | Invoked once every animation frame until the entrance animation ends, when the value of **progress** changes from 0 to 1. The input parameter is the normalized progress of the current entrance animation. The value range is 0–1.
- **type**: route type.
- **progress**: current progress. | +| onExit(event: (type?: RouteType, progress?: number) => void) | Invoked once every animation frame until the exit animation ends, when the value of **progress** changes from 0 to 1. The input parameter is the normalized progress of the current exit animation. The value range is 0–1.
- **type**: route type.
- **progress**: current progress. | ## Example diff --git a/en/application-dev/reference/arkui-ts/ts-transition-animation-component.md b/en/application-dev/reference/arkui-ts/ts-transition-animation-component.md index 7c62710b64759d42e205eb91b010fb50e478e108..cd072648a81f68b080ae88b9a90cf6a157376dc6 100644 --- a/en/application-dev/reference/arkui-ts/ts-transition-animation-component.md +++ b/en/application-dev/reference/arkui-ts/ts-transition-animation-component.md @@ -12,17 +12,17 @@ Configure the component transition animations for when a component is inserted o | Name| Type| Description| | -------- | -------- | -------- | -| transition | TransitionOptions | Transition parameters, which are all optional. For details, see **TransitionOptions**.| +| transition | TransitionOptions | Transition effects when the component is inserted, displayed, deleted, or hidden.
If no transition effect is set, an opacity transition from 0 to 1 is applied.
Since API version 9, this API is supported in ArkTS widgets.
**NOTE**
Transition parameters, which are all optional. For details, see **TransitionOptions**.| ## TransitionOptions | Name| Type| Mandatory| Description| | -------- | -------- | -------- | -------- | -| type | [TransitionType](ts-appendix-enums.md#transitiontype) | No| Transition type, which includes component addition and deletion by default.
Default value: **TransitionType.All**
**NOTE**
If **type** is not specified, insertion and deletion use the same transition type.| -| opacity | number | No| Opacity of the component during transition, which is the value of the start point of insertion and the end point of deletion.
Default value: **1**| -| translate | {
x? : number \| string,
y? : number \| string,
z? : number \| string
} | No| Translation of the component during transition, which is the value of the start point of insertion and the end point of deletion.
-**x**: distance to translate along the x-axis.
-**y**: distance to translate along the y-axis.
-**z**: distance to translate along the z-axis.| -| scale | {
x? : number,
y? : number,
z? : number,
centerX? : number \| string,
centerY? : number \| string
} | No| Scaling of the component during transition, which is the value of the start point of insertion and the end point of deletion.
- **x**: scale factor along the x-axis.
- **y**: scale factor along the y-axis.
- **z**: scale factor along the z-axis.
- **centerX** and **centerY**: x coordinate and y coordinate of the scale center, respectively. The default values are both **"50%"**.
- If the center point is 0, it indicates the upper left corner of the component.
| -| rotate | {
x?: number,
y?: number,
z?: number,
angle?: number \| string,
centerX?: number \| string,
centerY?: number \| string
} | No| Rotation of the component during transition, which is the value of the start point of insertion and the end point of deletion.
- **x**: rotation vector along the x-axis.
- **y**: rotation vector along the y-axis.
- **z**: rotation vector along the z-axis.
- **centerX** and **centerY**: x coordinate and y coordinate of the rotation center, respectively. The default values are both **"50%"**.
- If the center point is (0, 0), it indicates the upper left corner of the component.| +| type | [TransitionType](ts-appendix-enums.md#transitiontype) | No| Transition type, which includes component addition and deletion by default.
Default value: **TransitionType.All**
Since API version 9, this API is supported in ArkTS widgets.
**NOTE**
If **type** is not specified, insertion and deletion use the same transition type.| +| opacity | number | No| Opacity of the component during transition, which is the value of the start point of insertion and the end point of deletion.
Default value: **1**
Value range: [0, 1]
Since API version 9, this API is supported in ArkTS widgets.
**NOTE**
A value less than 0 evaluates to the value **0**. A value greater than 1 evaluates to the value **1**.| +| translate | {
x? : number \| string,
y? : number \| string,
z? : number \| string
} | No| Translation of the component during transition, which is the value of the start point of insertion and the end point of deletion.
-**x**: distance to translate along the x-axis.
-**y**: distance to translate along the y-axis.
-**z**: distance to translate along the z-axis.
Since API version 9, this API is supported in ArkTS widgets.| +| scale | {
x? : number,
y? : number,
z? : number,
centerX? : number \| string,
centerY? : number \| string
} | No| Scaling of the component during transition, which is the value of the start point of insertion and the end point of deletion.
- **x**: scale factor along the x-axis.
- **y**: scale factor along the y-axis.
- **z**: scale factor along the z-axis.
- **centerX** and **centerY**: x coordinate and y coordinate of the scale center, respectively. The default values are both **"50%"**.
- If the center point is 0, it indicates the upper left corner of the component.
Since API version 9, this API is supported in ArkTS widgets.| +| rotate | {
x?: number,
y?: number,
z?: number,
angle?: number \| string,
centerX?: number \| string,
centerY?: number \| string
} | No| Rotation of the component during transition, which is the value of the start point of insertion and the end point of deletion.
- **x**: rotation vector along the x-axis.
- **y**: rotation vector along the y-axis.
- **z**: rotation vector along the z-axis.
- **centerX** and **centerY**: x coordinate and y coordinate of the rotation center, respectively. The default values are both **"50%"**.
- If the center point is (0, 0), it indicates the upper left corner of the component.
Since API version 9, this API is supported in ArkTS widgets.| ## Example diff --git a/en/application-dev/reference/arkui-ts/ts-transition-animation-shared-elements.md b/en/application-dev/reference/arkui-ts/ts-transition-animation-shared-elements.md index cd3f67300cfa8b63bac83b973dcb404590426d27..2fcbfe67f010ea80ca278932bf4210074d438878 100644 --- a/en/application-dev/reference/arkui-ts/ts-transition-animation-shared-elements.md +++ b/en/application-dev/reference/arkui-ts/ts-transition-animation-shared-elements.md @@ -1,6 +1,6 @@ -# Transition of Shared Elements +# Shared Element Transition -Shared element transition can be used for transition between pages, for example, transition from an image on the current page to the next page. +A shared element transition is a transition animation applied to a component that is present on two pages. This component is called the shared element and can be set in the **sharedTransition** attribute. > **NOTE** > @@ -10,14 +10,14 @@ Shared element transition can be used for transition between pages, for example, ## Attributes -| Name | Parameters | Description | +| Name | Parameter | Description | | ---------------- | ------------------------------------------------------------ | ------------------------------------------------------------ | -| sharedTransition | id: string,
{
duration?: number,
curve?: Curve \| string,
delay?: number,
motionPath?:
{
path: string,
form?: number,
to?: number,
rotatable?: boolean
},
zIndex?: number,
type?: [SharedTransitionEffectType](ts-appendix-enums.md#sharedtransitioneffecttype)
} | Transition of the shared element. If the same **id** value is configured for a component on the two pages, this component is considered as a shared element of the pages. If the **id** value is an empty string, no transition will be applied to the component.
- **id**: component ID.
- **duration**: animation duration, in ms. The default duration is 1000 ms.
- **curve**: animation curve. The default curve is **Linear**. For details about the valid values, see [Curve](ts-animatorproperty.md).
- **delay**: Delay of animation playback, in ms. By default, the playback is not delayed.
- **motionPath**: motion path information. For details, see [Motion Path Animation](ts-motion-path-animation.md).
- **path**: path.
- **from**: start value.
- **to**: end value.
- **rotatable**: whether to rotate.
- **zIndex**: z-axis.
- **type**: animation type.| +| sharedTransition | id: string,
{
duration?: number,
curve?: Curve \| string,
delay?: number,
motionPath?:
{
path: string,
form?: number,
to?: number,
rotatable?: boolean
},
zIndex?: number,
type?: [SharedTransitionEffectType](ts-appendix-enums.md#sharedtransitioneffecttype)
} | Transition of the shared element. If the same **id** value is configured for a component on the two pages, this component is considered as a shared element of the pages. If the **id** value is an empty string, no transition will be applied to the component.
- **id**: component ID.
- **duration**: animation duration.
Default value: **1000**
Unit: ms
Value range: [0, +∞)
The value **0** indicates that no animation is applied. A value less than 0 evaluates to the value **0**.
- **curve**: animation curve. The default curve is **Linear**. For details about the valid values, see [Curve](ts-animatorproperty.md).
- **delay**: animation delay.
Default value: **0**
Unit: ms
Value range: [0, +∞)
A value less than 0 evaluates to the value **0**.
- **motionPath**: motion path information. For details, see [Motion Path Animation](ts-motion-path-animation.md).
- **path**: path.
- **from**: start value.
- **to**: end value.
- **rotatable**: whether to rotate.
- **zIndex**: z-axis.
- **type**: animation type.| ## Example - The example implements the custom transition of a shared image during redirection from one page to another, which is triggered by a click on the image. +This example implements the custom transition of a shared image during redirection from one page to another, which is triggered by a click on the image. ```ts // xxx.ets diff --git a/en/application-dev/reference/arkui-ts/ts-universal-attributes-location.md b/en/application-dev/reference/arkui-ts/ts-universal-attributes-location.md index d28294adf2e11dd3c2bdd47c9bf3abe66dce6623..378a573d7c4434707380f0a0bbe8d8fe23405d9d 100644 --- a/en/application-dev/reference/arkui-ts/ts-universal-attributes-location.md +++ b/en/application-dev/reference/arkui-ts/ts-universal-attributes-location.md @@ -14,7 +14,7 @@ The location attributes set the alignment mode, layout direction, and position o | -------- | -------- | -------- | | align | [Alignment](ts-appendix-enums.md#alignment) | Alignment mode of the component content in the drawing area.
Default value: **Alignment.Center**
Since API version 9, this API is supported in ArkTS widgets.| | direction | [Direction](ts-appendix-enums.md#direction) | Horizontal layout of the component.
Default value: **Direction.Auto**
Since API version 9, this API is supported in ArkTS widgets.| -| position | [Position](ts-types.md#position8) | Offset of the component's upper left corner relative to the parent component's upper left corner. This offset is expressed using absolute values. When laying out components, this attribute does not affect the layout of the parent component. It only adjusts the component position during drawing.
Since API version 9, this API is supported in ArkTS widgets.| +| position | [Position](ts-types.md#position8) | Offset of the component's upper left corner relative to the parent component's upper left corner. This offset is expressed using absolute values. When laying out components, this attribute does not affect the layout of the parent component. It only adjusts the component position during drawing.
This attribute is applicable to scenarios where the component is fixed at a position in the parent container, for example, where it is pinned to top or floating above the UI.
Since API version 9, this API is supported in ArkTS widgets.| | markAnchor | [Position](ts-types.md#position8) | Anchor point of the component for positioning. The upper left corner of the component is used as the reference point for offset. Generally, this attribute is used together with the **position** and **offset** attributes. When used independently, this attribute is similar to **offset**.
Default value:
{
x: 0,
y: 0
}
Since API version 9, this API is supported in ArkTS widgets.| | offset | [Position](ts-types.md#position8) | Offset of the component relative to itself. This offset is expressed using relative values. This attribute does not affect the layout of the parent component. It only adjusts the component position during drawing.
Default value:
{
x: 0,
y: 0
}
Since API version 9, this API is supported in ArkTS widgets.| | alignRules9+ | {
left?: { anchor: string, align: [HorizontalAlign](ts-appendix-enums.md#horizontalalign) };
right?: { anchor: string, align: [HorizontalAlign](ts-appendix-enums.md#horizontalalign) };
middle?: { anchor: string, align: [HorizontalAlign](ts-appendix-enums.md#horizontalalign) };
top?: { anchor: string, align: [VerticalAlign](ts-appendix-enums.md#verticalalign) };
bottom?: { anchor: string, align: [VerticalAlign](ts-appendix-enums.md#verticalalign) };
center?: { anchor: string, align: [VerticalAlign](ts-appendix-enums.md#verticalalign) }
} | Alignment rules relative to the container.
- **left**: left-aligned.
- **right**: right-aligned.
- **middle**: center-aligned.
- **top**: top-aligned.
- **bottom**: bottom-aligned.
- **center**: center-aligned.
This API is supported in ArkTS widgets.
**NOTE**
- **anchor**: ID of the component that functions as the anchor point.
- **align**: alignment mode relative to the anchor component. | @@ -32,19 +32,15 @@ struct PositionExample1 { Column({ space: 10 }) { // When the component content is within the area specified by the component width and height, set the alignment mode of the content in the component. Text('align').fontSize(9).fontColor(0xCCCCCC).width('90%') - Text('top start') - .align(Alignment.TopStart) - .height(50) - .width('90%') - .fontSize(16) - .backgroundColor(0xFFE4C4) - - Text('Bottom end') - .align(Alignment.BottomEnd) - .height(50) - .width('90%') - .fontSize(16) - .backgroundColor(0xFFE4C4) + Stack() { + Text('First show in bottom end').height('65%').backgroundColor(0xD2B48C) + Text('Second show in bottom end').backgroundColor(0xF5DEB3).opacity(0.9) + }.width('90%').height(50).margin({ top: 5 }).backgroundColor(0xFFE4C4) + .align(Alignment.BottomEnd) + Stack() { + Text('top start') + }.width('90%').height(50).margin({ top: 5 }).backgroundColor(0xFFE4C4) + .align(Alignment.TopStart) // To arrange the child components from left to right, set direction of the parent container to Direction.Ltr. Text('direction').fontSize(9).fontColor(0xCCCCCC).width('90%') @@ -86,6 +82,7 @@ struct PositionExample2 { Text('position').fontSize(12).fontColor(0xCCCCCC).width('90%') Row() { Text('1').size({ width: '30%', height: '50' }).backgroundColor(0xdeb887).border({ width: 1 }).fontSize(16) + .textAlign(TextAlign.Center) Text('2 position(30, 10)') .size({ width: '60%', height: '30' }) .backgroundColor(0xbbb2cb) @@ -94,6 +91,7 @@ struct PositionExample2 { .align(Alignment.Start) .position({ x: 30, y: 10 }) Text('3').size({ width: '45%', height: '50' }).backgroundColor(0xdeb887).border({ width: 1 }).fontSize(16) + .textAlign(TextAlign.Center) Text('4 position(50%, 70%)') .size({ width: '50%', height: '50' }) .backgroundColor(0xbbb2cb) @@ -110,14 +108,20 @@ struct PositionExample2 { .size({ width: '100', height: '100' }) .backgroundColor(0xdeb887) Text('text') + .fontSize('30px') + .textAlign(TextAlign.Center) .size({ width: 25, height: 25 }) .backgroundColor(Color.Green) .markAnchor({ x: 25, y: 25 }) Text('text') + .fontSize('30px') + .textAlign(TextAlign.Center) .size({ width: 25, height: 25 }) .backgroundColor(Color.Green) .markAnchor({ x: -100, y: -25 }) Text('text') + .fontSize('30px') + .textAlign(TextAlign.Center) .size({ width: 25, height: 25 }) .backgroundColor(Color.Green) .markAnchor({ x: 25, y: -25 }) @@ -127,6 +131,7 @@ struct PositionExample2 { Text('offset').fontSize(12).fontColor(0xCCCCCC).width('90%') Row() { Text('1').size({ width: '15%', height: '50' }).backgroundColor(0xdeb887).border({ width: 1 }).fontSize(16) + .textAlign(TextAlign.Center) Text('2 offset(15, 30)') .size({ width: 120, height: '50' }) .backgroundColor(0xbbb2cb) @@ -135,6 +140,7 @@ struct PositionExample2 { .align(Alignment.Start) .offset({ x: 15, y: 30 }) Text('3').size({ width: '15%', height: '50' }).backgroundColor(0xdeb887).border({ width: 1 }).fontSize(16) + .textAlign(TextAlign.Center) Text('4 offset(-10%, 20%)') .size({ width: 100, height: '50' }) .backgroundColor(0xbbb2cb) diff --git a/en/application-dev/reference/arkui-ts/ts-universal-attributes-popup.md b/en/application-dev/reference/arkui-ts/ts-universal-attributes-popup.md index 4137fd80dcc1eb91901af56241b4f3ee700274aa..4bb9ffdcc334869e7a7d862e4c6a095887ad74ea 100644 --- a/en/application-dev/reference/arkui-ts/ts-universal-attributes-popup.md +++ b/en/application-dev/reference/arkui-ts/ts-universal-attributes-popup.md @@ -18,13 +18,14 @@ You can bind a popup to a component, specifying its content, interaction logic, | Name | Type | Mandatory | Description | | -------------------------| ------------------------------------------------| -----| ----------------------------------------- | -| message | string | Yes | Content of the popup message. | -| placementOnTop | boolean | No | Whether to display the popup above the component.
Default value: **false** | -| primaryButton | {
value: string,
action: () => void
} | No | Primary button.
**value**: text of the primary button in the popup.
**action**: callback for clicking the primary button.| -| secondaryButton | {
value: string,
action: () => void
} | No | Secondary button.
**value**: text of the secondary button in the popup.
**action**: callback for clicking the secondary button.| -| onStateChange | (event: { isVisible: boolean }) => void | No | Callback for the popup status change event.
**isVisible**: whether the popup is visible. | -| arrowOffset9+ | [Length](ts-types.md#length) | No | Offset of the popup arrow relative to the popup.
When the arrow is at the top or bottom of the popup: The value **0** indicates that the arrow is located on the leftmost, and any other value indicates the distance from the arrow to the leftmost; the arrow is centered by default.
When the arrow is on the left or right side of the popup: The value indicates the distance from the arrow to the top; the arrow is centered by default.
When the popup is displayed on either edge of the screen, it will automatically deviate leftward or rightward to stay within the safe area. When the value is **0**, the arrow always points to the bound component. | -| showInSubWindow9+ | boolean | No | Whether to show the popup in the subwindow.
Default value: **false** | +| message | string | Yes | Content of the popup message. | +| placementOnTop | boolean | No | Whether to display the popup above the component.
Default value: **false** | +| primaryButton | {
value: string,
action: () => void
} | No | Primary button.
**value**: text of the primary button in the popup.
**action**: callback for clicking the primary button.| +| secondaryButton | {
value: string,
action: () => void
} | No | Secondary button.
**value**: text of the secondary button in the popup.
**action**: callback for clicking the secondary button.| +| onStateChange | (event: { isVisible: boolean }) => void | No | Callback for the popup status change event.
**isVisible**: whether the popup is visible. | +| arrowOffset9+ | [Length](ts-types.md#length) | No | Offset of the popup arrow relative to the popup.
When the arrow is at the top or bottom of the popup: The value **0** indicates that the arrow is located on the leftmost, and any other value indicates the distance from the arrow to the leftmost; the arrow is centered by default.
When the arrow is on the left or right side of the popup: The value indicates the distance from the arrow to the top; the arrow is centered by default.
When the popup is displayed on either edge of the screen, it will automatically deviate leftward or rightward to stay within the safe area. When the value is **0**, the arrow always points to the bound component. | +| showInSubWindow9+ | boolean | No | Whether to show the popup in the subwindow.
Default value: **false** | + ## CustomPopupOptions8+ @@ -33,13 +34,12 @@ You can bind a popup to a component, specifying its content, interaction logic, | builder | [CustomBuilder](ts-types.md#custombuilder8) | Yes | Popup builder. | | placement | [Placement](ts-appendix-enums.md#placement8) | No | Preferred position of the popup. If the set position is insufficient for holding the popup, it will be automatically adjusted.
Default value: **Placement.Bottom** | | popupColor | [ResourceColor](ts-types.md#resourcecolor) | No | Color of the popup. | -| enableArrow | boolean | No | Whether to display an arrow.
Since API version 9, if the position set for the popup is not large enough, the arrow will not be displayed. For example, if **placement** is set to **Left** but the popup height is less than twice the arrow width (64 vp), the arrow will not be displayed.
Default value: **true**| +| enableArrow | boolean | No | Whether to display an arrow.
Since API version 9, if the position set for the popup is not large enough, the arrow will not be displayed. For example, if **placement** is set to **Left**, but the popup height (80 vp) is less than the sum of the arrow width (32 vp) and diameter of popup rounded corner (48 vp), the arrow will not be displayed.
Default value: **true**| | autoCancel | boolean | No | Whether to automatically close the popup when an operation is performed on the page.
Default value: **true** | | onStateChange | (event: { isVisible: boolean }) => void | No | Callback for the popup status change event.
**isVisible**: whether the popup is visible. | | arrowOffset9+ | [Length](ts-types.md#length) | No | Offset of the popup arrow relative to the popup.
When the arrow is at the top or bottom of the popup: The value **0** indicates that the arrow is located on the leftmost, and any other value indicates the distance from the arrow to the leftmost; the arrow is centered by default.
When the arrow is on the left or right side of the popup: The value indicates the distance from the arrow to the top; the arrow is centered by default.
When the popup is displayed on either edge of the screen, it will automatically deviate leftward or rightward to stay within the safe area. When the value is **0**, the arrow always points to the bound component. | | showInSubWindow9+ | boolean | No | Whether to show the popup in the subwindow.
Default value: **false** | - ## Example ```ts // xxx.ets diff --git a/en/application-dev/reference/arkui-ts/ts-universal-attributes-text-style.md b/en/application-dev/reference/arkui-ts/ts-universal-attributes-text-style.md index 3fe2fd67e04bb818ccc5625f7f7d9d61e9347ea2..19fb0da84c1cafd88ea971c93db167934313de3f 100644 --- a/en/application-dev/reference/arkui-ts/ts-universal-attributes-text-style.md +++ b/en/application-dev/reference/arkui-ts/ts-universal-attributes-text-style.md @@ -2,7 +2,7 @@ The text style attributes set the style for text in a component. -> **NOTE** +> **NOTE** > > The APIs of this module are supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version. @@ -18,6 +18,8 @@ The text style attributes set the style for text in a component. | fontStyle | [FontStyle](ts-appendix-enums.md#fontstyle) | Font style.
Default value: **FontStyle.Normal** | | fontWeight | number \| [FontWeight](ts-appendix-enums.md#fontweight) \| string | Font weight. For the number type, the value ranges from 100 to 900, at an interval of 100. The default value is **400**. A larger value indicates a larger font weight. The string type supports only the string of the number type, for example, **400**, **"bold"**, **"bolder"**, **"lighter"**, **"regular"**, and **"medium"**, which correspond to the enumerated values in **FontWeight**.
Default value: **FontWeight.Normal** | | fontFamily | string \| [Resource](ts-types.md#resource) | Font family.
Default value: **'HarmonyOS Sans'**
Currently, only the default font is supported. | +| 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.| +| decoration | {
type: [TextDecorationType](ts-appendix-enums.md#textdecorationtype),
color?: [ResourceColor](ts-types.md#resourcecolor)
} | Style and color of the text decorative line.
Default value: {
type: TextDecorationType.None,
color: Color.Black
} | ## Example diff --git a/en/application-dev/ui/ui-ts-animation-feature.md b/en/application-dev/ui/ui-ts-animation-feature.md index 0f96e137cff81f4d86cc714faf3356d8331e3af6..3d6467e08cc112b6b9a953aa4d0a649486042bd2 100644 --- a/en/application-dev/ui/ui-ts-animation-feature.md +++ b/en/application-dev/ui/ui-ts-animation-feature.md @@ -111,7 +111,7 @@ The splash screen animation refers to the fade-in and fade-out of the logo. Afte } ``` -5. After the splash screen animation plays for 1 second, the **FoodCategoryList** page is displayed. Set the **onFinish** callback of **animateTo**. Invoke the **setTimeout** API of the timer. After a delay of 1s, call **router.replace** to display the **FoodCategoryList** page. +5. After the splash screen animation plays for 1 second, the **FoodCategoryList** page is displayed. Set the **onFinish** callback of **animateTo**. Invoke the **setTimeout** API of the timer. After a delay of 1s, call **router.replaceUrl** to display the **FoodCategoryList** page. ```ts import router from '@ohos.router' @@ -240,11 +240,11 @@ The splash screen animation refers to the fade-in and fade-out of the logo. Afte Implement the shared element transition between the food list page and the food details page. That is, after you click **FoodListItem** or **FoodGridItem**, the food thumbnail is zoomed in, and then you are redirected to the large image on the food details page. -1. Set the **sharedTransition** method for the **\** component of **FoodListItem** and **FoodGridItem**. The transition ID is **foodItem.id**, the duration of the transition animation is 1s, and the delay is 0.1s. The change curve is **Curves.cubicBezier(0.2, 0.2, 0.1, 1.0)**. You need to import the **Curves** module first. +1. Set the **sharedTransition** method for the **** component of **FoodListItem** and **FoodGridItem**. The transition ID is **foodItem.id**, the duration of the transition animation is 1s, and the delay is 0.1s. The change curve is **Curves.cubicBezier(0.2, 0.2, 0.1, 1.0)**. You need to import the **Curves** module first. - During the shared element transition, the attributes of the current element are carried. Therefore, create a **\** component as the parent component of the **\** component, and set the background color on the **\** component. + During the shared element transition, the attributes of the current element are carried. Therefore, create a **** component as the parent component of the **** component, and set the background color on the **** component. - Set **autoResize** to **false** for the **\** component of **FoodListItem**. The **\** component adjusts the size of the image source based on the final display area by default to optimize the image rendering performance. In the transition animation, the image will be reloaded during the zoom-in process. Therefore, to ensure the smoothness of the transition animation, set **autoResize** to **false**. + Set **autoResize** to **false** for the **** component of **FoodListItem**. The **** component adjusts the size of the image source based on the final display area by default to optimize the image rendering performance. In the transition animation, the image will be reloaded during the zoom-in process. Therefore, to ensure the smoothness of the transition animation, set **autoResize** to **false**. ```ts // FoodList.ets @@ -316,7 +316,7 @@ Implement the shared element transition between the food list page and the food ``` -2. Sets the **sharedTransition** method for the **\** component of **FoodImageDisplay** on the **FoodDetail** page. The setting method is the same as that mentioned above. +2. Sets the **sharedTransition** method for the **** component of **FoodImageDisplay** on the **FoodDetail** page. The setting method is the same as that mentioned above. ```ts import Curves from '@ohos.curves' diff --git a/en/application-dev/ui/ui-ts-layout-mediaquery.md b/en/application-dev/ui/ui-ts-layout-mediaquery.md index c57de9e82ec6bb20226f282c88f2fcd88f7cc8fb..c37468c67f14b37878f22c9138612aebba805975 100644 --- a/en/application-dev/ui/ui-ts-layout-mediaquery.md +++ b/en/application-dev/ui/ui-ts-layout-mediaquery.md @@ -10,32 +10,32 @@ ## Usage -Invoke the **mediaquery** API to set the media query condition and the callback, and change the page layout or implement service logic in the callback corresponding to the condition. +Invoke the **mediaquery** API to set the media query condition and the callback, and change the page layout or implement service logic in the callback corresponding to the condition. The procedure is as follows: -First, import the **mediaquery** module, as shown below: +1. Import the **mediaquery** module, as shown below: -```ts -import mediaquery from '@ohos.mediaquery' -``` + ```ts + import mediaquery from '@ohos.mediaquery' + ``` -Then, use the **matchMediaSync** API to set the media query condition and save the returned listener, as shown below: +2. Use the **matchMediaSync** API to set the media query condition and save the returned listener, as shown below: -```ts -listener = mediaquery.matchMediaSync('(orientation: landscape)') -``` + ```ts + listener = mediaquery.matchMediaSync('(orientation: landscape)') + ``` -Finally, register the **onPortrait** callback using the saved listener, and change the page layout or implement service logic in the callback. When the media query condition is matched, the callback is triggered. The sample code is as follows: +3. Register the **onPortrait** callback using the saved listener, and change the page layout or implement service logic in the callback. When the media query condition is matched, the callback is triggered. The sample code is as follows: -```ts -onPortrait(mediaQueryResult) { - if (mediaQueryResult.matches) { - // do something here - } else { - // do something here - } -} -listener.on('change', onPortrait) -``` + ```ts + onPortrait(mediaQueryResult) { + if (mediaQueryResult.matches) { + // do something here + } else { + // do something here + } + } + listener.on('change', onPortrait) + ``` ## Media Query Conditions @@ -92,23 +92,23 @@ At MediaQuery Level 4, range query is imported so that you can use the operators | Type | Description | | ----------------- | ------------------------------------------------------------ | -| height | Height of the display area on the application page. | -| min-height | Minimum height of the display area on the application page. | -| max-height | Maximum height of the display area on the application page. | -| width | Width of the display area on the app page. | -| min-width | Minimum width of the display area on the application page. | -| max-width | Maximum width of the display area on the application page. | -| resolution | Resolution of the device. The unit can be dpi, dppx, or dpcm.
- **dpi** indicates the number of physical pixels per inch. 1 dpi ≈ 0.39 dpcm.
- **dpcm** indicates the number of physical pixels per centimeter. 1 dpcm ≈ 2.54 dpi.
- **dppx** indicates the number of physical pixels in each pixel. (This unit is calculated based on this formula: 96 px = 1 inch, which is different from the calculation method of the px unit on the page.) 1 dppx = 96 dpi.| -| min-resolution | Minimum device resolution. | -| max-resolution | Maximum device resolution. | +| height | Height of the display area on the application page. | +| min-height | Minimum height of the display area on the application page. | +| max-height | Maximum height of the display area on the application page. | +| width | Width of the display area on the application page. | +| min-width | Minimum width of the display area on the application page. | +| max-width | Maximum width of the display area on the application page. | +| resolution | Resolution of the device. The unit can be dpi, dppx, or dpcm.
- **dpi** indicates the number of physical pixels per inch. 1 dpi ≈ 0.39 dpcm.
- **dpcm** indicates the number of physical pixels per centimeter. 1 dpcm ≈ 2.54 dpi.
- **dppx** indicates the number of physical pixels in each pixel. (This unit is calculated based on this formula: 96 px = 1 inch, which is different from the calculation method of the px unit on the page.) 1 dppx = 96 dpi.| +| min-resolution | Minimum device resolution. | +| max-resolution | Maximum device resolution. | | orientation | Screen orientation.
Options are as follows:
- orientation: portrait
- orientation: landscape| -| device-height | Height of the device. | -| min-device-height | Minimum height of the device. | -| max-device-height | Maximum height of the device. | -| device-width | Width of the device. | -| min-device-width | Minimum width of the device. | -| max-device-width | Maximum width of the device. | -| device-type | Type of the device.
Value range: **default** | +| device-height | Height of the device. | +| min-device-height | Minimum height of the device. | +| max-device-height | Maximum height of the device. | +| device-width | Width of the device. | +| device-type | Type of the device.
Options: **default** and tablet | +| min-device-width | Minimum width of the device. | +| max-device-width | Maximum width of the device. | | round-screen | Screen type. The value **true** means that the screen is round, and **false** means the opposite. | | dark-mode | Whether the device is in dark mode. The value **true** means that the device is in dark mode, and **false** means the opposite. | diff --git a/en/device-dev/Readme-EN.md b/en/device-dev/Readme-EN.md index 048e956eb631431d1806199f7bb5f106f9034f76..09d4af6ebf56653027512d19c644711a90f7b2df 100644 --- a/en/device-dev/Readme-EN.md +++ b/en/device-dev/Readme-EN.md @@ -40,7 +40,6 @@ - [AI Framework](subsystems/subsys-ai-aiframework-devguide.md) - [Data Management](subsystems/subsys-data-relational-database-overview.md) - [Sensor](subsystems/subsys-sensor-overview.md) - - [USB](subsystems/subsys-usbservice-overview.md) - [Application Framework](subsystems/subsys-application-framework-overview.md) - [OTA Update](subsystems/subsys-ota-guide.md) - [Telephony](subsystems/subsys-tel-overview.md) diff --git a/en/device-dev/website.md b/en/device-dev/website.md index ea70ddb256ecf8b273da770317aac926fbb5fd6f..0880175f99c9a1a61b30f2ce181358ae22284c92 100644 --- a/en/device-dev/website.md +++ b/en/device-dev/website.md @@ -178,6 +178,7 @@ - [Exception Debugging](kernel/kernel-mini-memory-exception.md) - [Trace](kernel/kernel-mini-memory-trace.md) - [LMS](kernel/kernel-mini-memory-lms.md) + - [Shell](kernel/kernel-mini-debug-shell.md) - Appendix - [Kernel Coding Specification](kernel/kernel-mini-appx-code.md) - [Standard Libraries](kernel/kernel-mini-appx-lib.md) @@ -426,10 +427,6 @@ - [Sensor Overview](subsystems/subsys-sensor-overview.md) - [Sensor Usage Guidelines](subsystems/subsys-sensor-guide.md) - [Sensor Usage Example](subsystems/subsys-sensor-demo.md) - - USB - - [USB Overview](subsystems/subsys-usbservice-overview.md) - - [USB Usage Guidelines](subsystems/subsys-usbservice-guide.md) - - [USB Usage Example](subsystems/subsys-usbservice-demo.md) - Application Framework - [Overview](subsystems/subsys-application-framework-overview.md) - [Setting Up a Development Environment](subsystems/subsys-application-framework-envbuild.md) diff --git a/zh-cn/application-dev/application-models/arkts-ui-widget-interaction-overview.md b/zh-cn/application-dev/application-models/arkts-ui-widget-interaction-overview.md index 947af74c94943117de9fdd59b7bd9c1e6d210ef5..dc785d9c544b324faab02dc4a0666fa4e096e9a6 100644 --- a/zh-cn/application-dev/application-models/arkts-ui-widget-interaction-overview.md +++ b/zh-cn/application-dev/application-models/arkts-ui-widget-interaction-overview.md @@ -1,7 +1,7 @@ # 卡片数据交互说明 -ArkTS卡片框架提供了updateForm()接口和requestForm()接口主动触发卡片的页面刷新。**（介绍下LocalStorageProp在这个过程中起到的作用）** +ArkTS卡片框架提供了updateForm()接口和requestForm()接口主动触发卡片的页面刷新。 ![WidgetLocalStorageProp](figures/WidgetLocalStorageProp.png) diff --git a/zh-cn/application-dev/application-models/extensionability-overview.md b/zh-cn/application-dev/application-models/extensionability-overview.md index fe1b760cad8a6a40e0e80595116d4c7522026698..98409360b568920071a7580e16227297e40afacc 100644 --- a/zh-cn/application-dev/application-models/extensionability-overview.md +++ b/zh-cn/application-dev/application-models/extensionability-overview.md @@ -45,7 +45,7 @@ ExtensionAbility组件是基于特定场景（例如服务卡片、输入法等 ## 实现指定类型的ExtensionAbility组件 -以实现卡片[FormExtensionAbility](../reference/apis/js-apis-app-form-formExtensionAbility.md)为例进行说明。卡片框架提供了[FormExtensionAbility](../reference/apis/js-apis-app-form-formExtensionAbility.md)基类，开发者通过派生此基类（如MyFormExtensionAbility），实现回调（如创建卡片的onCreate()回调、更新卡片的onUpdateForm()回调等）来实现具体卡片功能，具体见开发指导见[服务卡片FormExtensionAbility](widget-development-stage.md)。 +以实现卡片[FormExtensionAbility](../reference/apis/js-apis-app-form-formExtensionAbility.md)为例进行说明。卡片框架提供了[FormExtensionAbility](../reference/apis/js-apis-app-form-formExtensionAbility.md)基类，开发者通过派生此基类（如MyFormExtensionAbility），实现回调（如创建卡片的onCreate()回调、更新卡片的onUpdateForm()回调等）来实现具体卡片功能，具体见开发指导见[服务卡片FormExtensionAbility](service-widget-overview.md)。 卡片FormExtensionAbility实现方不用关心使用方何时去请求添加、删除卡片，FormExtensionAbility实例及其所在的ExtensionAbility进程的整个生命周期，都是由卡片管理系统服务FormManagerService进行调度管理。 diff --git a/zh-cn/application-dev/application-models/js-ui-widget-development.md b/zh-cn/application-dev/application-models/js-ui-widget-development.md index e66332d72ff4ffdc0bcbec2b060bef21db98dafe..34a0af5ea36388dfbfa74b22f26581d192110e82 100644 --- a/zh-cn/application-dev/application-models/js-ui-widget-development.md +++ b/zh-cn/application-dev/application-models/js-ui-widget-development.md @@ -57,13 +57,6 @@ FormExtensionAbility类拥有如下API接口，具体的API介绍详见[接口 | onConfigurationUpdate(config: Configuration): void | 当系统配置更新时调用。 | | onShareForm?(formId: string): { [key: string]: any } | 卡片提供方接收卡片分享的通知接口。 | -FormExtensionAbility类还拥有成员context，为FormExtensionContext类，具体的API介绍详见[接口文档](../reference/apis/js-apis-inner-application-formExtensionContext.md)。 - -| 接口名 | 描述 | -| -------- | -------- | -| startAbility(want: Want, callback: AsyncCallback<void>): void | 回调形式拉起一个卡片所属应用的UIAbility（系统接口，三方应用不支持调用，需申请后台拉起权限）。 | -| startAbility(want: Want): Promise<void> | Promise形式拉起一个卡片所属应用的UIAbility（系统接口，三方应用不支持调用，需申请后台拉起权限）。 | - formProvider类有如下API接口，具体的API介绍详见[接口文档](../reference/apis/js-apis-app-form-formProvider.md)。 | 接口名 | 描述 | @@ -324,7 +317,7 @@ export default class EntryFormAbility extends FormExtension { } ``` -具体的持久化方法可以参考[轻量级数据存储开发指导](../database/database-preference-guidelines.md)。 +具体的持久化方法可以参考[轻量级数据存储开发指导](../database/app-data-persistence-overview.md)。 需要注意的是，卡片使用方在请求卡片时传递给提供方应用的Want数据中存在临时标记字段，表示此次请求的卡片是否为临时卡片： diff --git a/zh-cn/application-dev/application-models/service-widget-overview.md b/zh-cn/application-dev/application-models/service-widget-overview.md index 2df4807cdec519a0dab3f79cd40c12b2a42c015f..fa58595b04ff56145b7f11f8df3dd32e69ec306a 100644 --- a/zh-cn/application-dev/application-models/service-widget-overview.md +++ b/zh-cn/application-dev/application-models/service-widget-overview.md @@ -54,14 +54,3 @@ ArkTS卡片与JS卡片具备不同的实现原理及特征，在场景能力上 | 逻辑代码执行（不包含import能力） | 不支持 | 支持 | 相比于JS卡片，ArkTS卡片在能力和场景方面更加丰富，因此无论开发何种用途的卡片，都推荐使用ArkTS卡片，因为它可以提高开发效率并实现动态化。但如果只需要做静态页面展示的卡片，可以考虑使用JS卡片。 - -## 限制 - -为了降低FormExtensionAbility能力被三方应用滥用的风险，在FormExtensionAbility中限制以下接口的调用 - -- @ohos.ability.particleAbility.d.ts -- @ohos.backgroundTaskManager.d.ts -- @ohos.resourceschedule.backgroundTaskManager.d.ts -- @ohos.multimedia.camera.d.ts -- @ohos.multimedia.audio.d.ts -- @ohos.multimedia.media.d.ts \ No newline at end of file diff --git a/zh-cn/application-dev/database/sync-app-data-across-devices-overview.md b/zh-cn/application-dev/database/sync-app-data-across-devices-overview.md index 5cac356b79fa7848cd794418212c945d23c91ded..c4d09d08da110e5f5e8c658a41ad808f47317bcb 100644 --- a/zh-cn/application-dev/database/sync-app-data-across-devices-overview.md +++ b/zh-cn/application-dev/database/sync-app-data-across-devices-overview.md @@ -36,7 +36,7 @@ ## 跨设备同步访问控制机制 -数据跨设备同步时，数据管理基于设备等级和[数据安全标签](access-control-by-device-and-data-level.md#基本概念)进行访问控制。规则为，数据只允许向数据安全标签不高于设备安全等级的设备同步数据，具体访问控制矩阵如下： +数据跨设备同步时，数据管理基于设备等级和[数据安全标签](access-control-by-device-and-data-level.md#数据安全标签)进行访问控制。规则为，数据只允许向数据安全标签不高于设备安全等级的设备同步数据，具体访问控制矩阵如下： |设备安全级别|可同步的数据安全标签| |---|---| diff --git a/zh-cn/application-dev/reference/apis/js-apis-bundleManager.md b/zh-cn/application-dev/reference/apis/js-apis-bundleManager.md index ce2ed77a0d1e8b184f8a483a93643637d6602631..28f6e081dde750c878f11d11c5ce9523d1240e17 100644 --- a/zh-cn/application-dev/reference/apis/js-apis-bundleManager.md +++ b/zh-cn/application-dev/reference/apis/js-apis-bundleManager.md @@ -97,12 +97,12 @@ Ability组件信息标志，指示需要获取的Ability组件信息的内容。 | 名称 | 值 | 说明 | |:----------------:|:---:|-----| -| FORM | 0 | [FormExtensionAbility](../../application-models/widget-development-stage.md)：卡片扩展能力，提供卡片开发能力。 | +| FORM | 0 | [FormExtensionAbility](../../application-models/service-widget-overview.md)：卡片扩展能力，提供卡片开发能力。 | | WORK_SCHEDULER | 1 | [WorkSchedulerExtensionAbility](../../task-management/work-scheduler-dev-guide.md)：延时任务扩展能力，允许应用在系统闲时执行实时性不高的任务。 | | INPUT_METHOD | 2 | [InputMethodExtensionAbility](js-apis-inputmethod-extension-ability.md)：输入法扩展能力，用于开发输入法应用。 | | SERVICE | 3 | [ServiceExtensionAbility](../../application-models/serviceextensionability.md)：后台服务扩展能力，提供后台运行并对外提供相应能力。 | | ACCESSIBILITY | 4 | [AccessibilityExtensionAbility](js-apis-application-accessibilityExtensionAbility.md)：无障碍服务扩展能力，支持访问与操作前台界面。 | -| DATA_SHARE | 5 | [DataShareExtensionAbility](../../database/database-datashare-guidelines.md)：数据共享扩展能力，用于对外提供数据读写服务。 | +| DATA_SHARE | 5 | [DataShareExtensionAbility](../../database/share-data-by-datashareextensionability.md)：数据共享扩展能力，用于对外提供数据读写服务。 | | FILE_SHARE | 6 | FileShareExtensionAbility：文件共享扩展能力，用于应用间的文件分享。预留能力，当前暂未支持。 | | STATIC_SUBSCRIBER| 7 | [StaticSubscriberExtensionAbility](js-apis-application-staticSubscriberExtensionAbility.md)：静态广播扩展能力，用于处理静态事件，比如开机事件。 | | WALLPAPER | 8 | WallpaperExtensionAbility：壁纸扩展能力，用于实现桌面壁纸。预留能力，当前暂未支持。 | diff --git a/zh-cn/application-dev/reference/apis/js-apis-effectKit.md b/zh-cn/application-dev/reference/apis/js-apis-effectKit.md index 5610c212819c32fc322225e6824da36fbc87a736..f2b678070965feb3482655cfe52f12f6aa57844f 100644 --- a/zh-cn/application-dev/reference/apis/js-apis-effectKit.md +++ b/zh-cn/application-dev/reference/apis/js-apis-effectKit.md @@ -29,7 +29,7 @@ createEffect(source: image.PixelMap): Filter | 参数名 | 类型 | 必填 | 说明 | | ------- | ----------------- | ---- | -------- | -| source | [image.PixelMap](js-apis-image.md#pixelmap7) | 是 | image模块创建的PixelMap实例。 | +| source | [image.PixelMap](js-apis-image.md#pixelmap7) | 是 | image模块创建的PixelMap实例。可通过图片解码或直接创建获得，具体可见[图片开发指导](../../media/image-overview.md)。 | **返回值：** @@ -61,7 +61,7 @@ createColorPicker(source: image.PixelMap): Promise\ | 参数名 | 类型 | 必填 | 说明 | | -------- | ----------- | ---- | -------------------------- | -| source | [image.PixelMap](js-apis-image.md#pixelmap7) | 是 | image模块创建的PixelMap实例。 | +| source | [image.PixelMap](js-apis-image.md#pixelmap7) | 是 | image模块创建的PixelMap实例。可通过图片解码或直接创建获得，具体可见[图片开发指导](../../media/image-overview.md)。 | **返回值：** @@ -95,7 +95,7 @@ createColorPicker(source: image.PixelMap, callback: AsyncCallback\) | 参数名 | 类型 | 必填 | 说明 | | -------- | ------------------ | ---- | -------------------------- | -| source | [image.PixelMap](js-apis-image.md#pixelmap7) | 是 |image模块创建的PixelMap实例。 | +| source | [image.PixelMap](js-apis-image.md#pixelmap7) | 是 |image模块创建的PixelMap实例。可通过图片解码或直接创建获得，具体可见[图片开发指导](../../media/image-overview.md)。 | | callback | AsyncCallback\<[ColorPicker](#colorpicker)> | 是 | 回调函数。返回创建的ColorPicker实例。 | **示例：** diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-state-management.md b/zh-cn/application-dev/reference/arkui-ts/ts-state-management.md index 9e777fcbe54b3fb0f98a1952f8d2202939effa03..defb0b218c35b1c0e5b5c5e9d2fa8009d330ce29 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-state-management.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-state-management.md @@ -352,7 +352,7 @@ let res: boolean = AppStorage.IsMutable('simpleProp'); static Size(): number -返回LocalStorage中的属性数量。 +返回AppStorage中的属性数量。 **返回值：** @@ -487,7 +487,7 @@ let res1: boolean = storage.set('PropB', 47); // false ### setOrCreate9+ -setOrCreate<T>(propName: string, newValue?: T): boolean +setOrCreate<T>(propName: string, newValue: T): boolean propName如果已经在LocalStorage中存在，则设置propName对应是属性的值为newValue。如果不存在，则创建propName属性，初始化为newValue。 @@ -496,7 +496,7 @@ propName如果已经在LocalStorage中存在，则设置propName对应是属性 | 参数名 | 类型 | 必填 | 参数描述 | | -------- | ------ | ---- | ----------------------- | | propName | string | 是 | LocalStorage中的属性名。 | -| newValue | T | 否 | 属性值，不能为undefined或者null。 | +| newValue | T | 是 | 属性值，不能为undefined或者null。 | **返回值：** @@ -573,7 +573,7 @@ var link2: SubscribedAbstractProperty = storage.setAndLink('PropA', 50); ### prop9+ -prop<T>(propName: string): SubscribedAbstractProperty<T> +prop<S>(propName: string): SubscribedAbstractProperty<S> 如果给定的propName在LocalStorage存在，则返回与LocalStorage中propName对应属性的单向绑定数据。如果LocalStorage中不存在propName，则返回undefined。单向绑定数据的修改不会被同步回LocalStorage中。 @@ -587,7 +587,7 @@ prop<T>(propName: string): SubscribedAbstractProperty<T> | 类型 | 描述 | | ----------------------------------- | ---------------------------------------- | -| SubscribedAbstractProperty<T> | SubscribedAbstractProperty<T>的实例，如果AppStorage不存在对应的propName，在返回undefined。 | +| SubscribedAbstractProperty<S> | SubscribedAbstractProperty<S>的实例，如果AppStorage不存在对应的propName，在返回undefined。 | ```ts @@ -600,7 +600,7 @@ prop1.set(1); // one-way sync: prop1.get()=1; but prop2.get() == 47 ### setAndProp9+ -setAndProp<T>(propName: string, defaultValue: T): SubscribedAbstractProperty<T> +setAndProp<S>(propName: string, defaultValue: S): SubscribedAbstractProperty<S> propName在LocalStorage存在，则返回该propName对应的属性的单向绑定数据。如果不存在，则使用defaultValue在LocalStorage创建和初始化propName对应的属性，返回其单向绑定数据。 @@ -609,13 +609,13 @@ propName在LocalStorage存在，则返回该propName对应的属性的单向绑 | 参数名 | 类型 | 必填 | 参数描述 | | ------------ | ------ | ---- | ---------------------------------------- | | propName | string | 是 | LocalStorage中的属性名。 | -| defaultValue | T | 是 | 当propName在AppStorage中不存在，使用default在AppStorage中初始化对应的propName。 | +| defaultValue | S | 是 | 当propName在AppStorage中不存在，使用default在AppStorage中初始化对应的propName。 | **返回值：** | 类型 | 描述 | | ----------------------------------- | ---------------------------------------- | -| SubscribedAbstractProperty<T> | SubscribedAbstractProperty<T>的实例，和AppStorage中propName对应属性的单向绑定的数据。 | +| SubscribedAbstractProperty<S> | SubscribedAbstractProperty<S>的实例，和AppStorage中propName对应属性的单向绑定的数据。 | ```ts @@ -762,20 +762,6 @@ let prop1 = AppStorage.Prop('PropA'); prop1.set(1); // prop1.get()=1 ``` -### aboutToBeDeleted10+ - -abstract aboutToBeDeleted(): void - -取消SubscribedAbstractProperty实例对AppStorage/LocalStorage单/双向同步关系。 - - -```ts -AppStorage.SetOrCreate('PropA', 47); -let link = AppStorage.SetAndLink('PropB', 49); // PropA -> 47, PropB -> 49 -link.aboutToBeDeleted(); -link.set(50); // PropB -> 49, link.get() --> undefined -``` - ## PersistentStorage diff --git a/zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-file.md b/zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-file.md index 76f57c4f3118b417549835e71ec8232ad2efff84..cfe46dcd3b83e79e90b8b4b29479214e3b179932 100644 --- a/zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-file.md +++ b/zh-cn/application-dev/reference/js-service-widget-ui/js-service-widget-file.md @@ -60,4 +60,4 @@ JS服务卡片(entry/src/main/js/Widget)的典型开发目录结构如下： FA卡片需要在应用配置文件config.json中进行配置。详细的配置内容请参考[FA卡片配置文件说明](../../application-models/widget-development-fa.md#配置卡片配置文件)。 -Stage卡片需要在应用配置文件module.json5中的extensionAbilities标签下，配置ExtensionAbility相关信息。详细的配置内容请参考[Stage卡片配置文件说明](../../application-models/arkts-ui-widget-configuration.md)。 \ No newline at end of file +Stage卡片需要在应用配置文件module.json5中的extensionAbilities标签下，配置ExtensionAbility相关信息。详细的配置内容请参考[Stage卡片配置文件说明](../../application-models/arkts-ui-widget-configuration.md)。 diff --git a/zh-cn/release-notes/api-change/Beta5 to v3.2-Release/Readme-CN.md b/zh-cn/release-notes/api-change/Beta5 to v3.2-Release/Readme-CN.md index 6301907a6b2f6c9e111e319a12edbfb62fb00e61..655f26f623bcf6418a99b254cdbe66c7886b0308 100644 --- a/zh-cn/release-notes/api-change/Beta5 to v3.2-Release/Readme-CN.md +++ b/zh-cn/release-notes/api-change/Beta5 to v3.2-Release/Readme-CN.md @@ -8,7 +8,6 @@ - [包管理](js-apidiff-bundle.md) - [网络及通信](js-apidiff-communication.md) - [语言编译器运行时](js-apidiff-compiler-and-runtime.md) -- [定制](js-apidiff-customization.md) - [DFX](js-apidiff-dfx.md) - [分布式数据](js-apidiff-distributed-data.md) - [文件管理](js-apidiff-file-management.md) diff --git a/zh-cn/release-notes/release-definitions/Release-version-definitions.md b/zh-cn/release-notes/release-definitions/Release-version-definitions.md index 6308d04fb2adcfe78e600c631cb0965dd276b220..0b33014c71cc7aaa59abec15fa6a6b33a5f2dde8 100644 --- a/zh-cn/release-notes/release-definitions/Release-version-definitions.md +++ b/zh-cn/release-notes/release-definitions/Release-version-definitions.md @@ -4,7 +4,6 @@ 为了保障OpenHarmony社区版本的平滑演进和历史发布版本的持续稳定可靠，会定期从Master主干拉出LTS/Release/Beta等类型分支，并按照OpenHarmony生命周期定义对其进行管理。 -![1.png](figures/1.png) ### Master （主干分支） diff --git a/zh-cn/website.md b/zh-cn/website.md index 04498ecb4e5a3b69f5d22cde59701cf15d530daf..530fcb8234a9370846468c6adceb13e3f6558ac0 100644 --- a/zh-cn/website.md +++ b/zh-cn/website.md @@ -74,7 +74,7 @@ - [用户IAM](release-notes/api-change/v3.2-Release/js-apidiff-user-iam.md) - [Web](release-notes/api-change/v3.2-Release/js-apidiff-web.md) - [窗口](release-notes/api-change/v3.2-Release/js-apidiff-window.md) - - OpenHarmony 3.2 Release (相比3.1 Beta5) + - OpenHarmony 3.2 Release (相比3.2 Beta5) - JS API差异报告 - [元能力](release-notes/api-change/Beta5%20to%20v3.2-Release/js-apidiff-ability.md) - [帐号](release-notes/api-change/Beta5%20to%20v3.2-Release/js-apidiff-account.md) @@ -84,7 +84,6 @@ - [包管理](release-notes/api-change/Beta5%20to%20v3.2-Release/js-apidiff-bundle.md) - [网络及通信](release-notes/api-change/Beta5%20to%20v3.2-Release/js-apidiff-communication.md) - [语言编译器运行时](release-notes/api-change/Beta5%20to%20v3.2-Release/js-apidiff-compiler-and-runtime.md) - - [定制](release-notes/api-change/Beta5%20to%20v3.2-Release/js-apidiff-customization.md) - [DFX](release-notes/api-change/Beta5%20to%20v3.2-Release/js-apidiff-dfx.md) - [分布式数据](release-notes/api-change/Beta5%20to%20v3.2-Release/js-apidiff-distributed-data.md) - [文件管理](release-notes/api-change/Beta5%20to%20v3.2-Release/js-apidiff-file-management.md)