diff --git a/en/application-dev/application-models/arkts-ui-widget-configuration.md b/en/application-dev/application-models/arkts-ui-widget-configuration.md index f0f003e608c995461ad1e84c65ed2a09b87febb7..ea9832f92d32dfe0c2a4160f3ac6f8e904d323fa 100644 --- a/en/application-dev/application-models/arkts-ui-widget-configuration.md +++ b/en/application-dev/application-models/arkts-ui-widget-configuration.md @@ -16,7 +16,7 @@ Widget-related configuration includes **FormExtensionAbility** configuration and "extensionAbilities": [ { "name": "EntryFormAbility", - "srcEntry": "./ets/entryformability/EntryFormAbility.ts", + "srcEntry": "./ets/entryformability/EntryFormAbility.ets", "label": "$string:EntryFormAbility_label", "description": "$string:EntryFormAbility_desc", "type": "form", @@ -42,9 +42,9 @@ Widget-related configuration includes **FormExtensionAbility** configuration and | description | Description of the widget. The value can be a string or a resource index to descriptions in multiple languages. The value is a string with a maximum of 255 bytes.| String| Yes (initial value: left empty)| | src | Full path of the UI code corresponding to the widget. For an ArkTS widget, the full path must contain the widget file name extension, for example, **./ets/widget/pages/WidgetCard.ets**. For a JS widget, the full path does not need to contain the widget file name extension, for example, **./js/widget/pages/WidgetCard**.| String| No| | uiSyntax | Type of the widget.
- **arkts**: ArkTS widget
- **hml**: JS widget| String| Yes (initial value: **hml**)| - | window | Window-related configurations.| Object| Yes| + | window | Window-related configurations.| Object| YYes (initial value: see Table 2)| | isDefault | Whether the widget is a default one. Each UIAbility has only one default widget.
- **true**: The widget is the default one.
- **false**: The widget is not the default one.| Boolean| No| - | colorMode | Color mode of the widget.
- **auto**: auto-adaptive color mode
- **dark**: dark color mode
- **light**: light color mode| String| Yes (initial value: **auto**)| + | colorMode | Color mode of the widget.
- **auto**: following the system color mode
- **dark**: dark color mode
- **light**: light color mode| String| Yes (initial value: **auto**)| | supportDimensions | Grid styles supported by the widget.
- **1 * 2**: indicates a grid with one row and two columns.
- **2 * 2**: indicates a grid with two rows and two columns.
- **2 * 4**: indicates a grid with two rows and four columns.
- **4 * 4**: indicates a grid with four rows and four columns.| String array| No| | defaultDimension | Default grid style of the widget. The value must be available in the **supportDimensions** array of the widget.| String| No| | updateEnabled | Whether the widget can be updated periodically.
- **true**: The widget can be updated at a specified interval (**updateDuration**) or at the scheduled time (**scheduledUpdateTime**). **updateDuration** takes precedence over **scheduledUpdateTime**. If both are specified, the value specified by **updateDuration** is used.
- **false**: The widget cannot be updated periodically.| Boolean| No| @@ -56,6 +56,13 @@ Widget-related configuration includes **FormExtensionAbility** configuration and | dataProxyEnabled | Whether the widget supports the [update-through-proxy](./arkts-ui-widget-update-by-proxy.md) feature.
- **true**: The widget supports the update-through-proxy feature.
- **false**: The widget does not support the update-through-proxy feature.
If this tag is set to **true**, the settings for the scheduled update time will still take effect, but the settings for the update interval and next update time will not.| Boolean| Yes (initial value: **false**)| | isDynamic | Whether the widget is a dynamic widget. This tag only applies to ArkTS widgets.
- **true**: The widget is a dynamic widget.
- **false**: The widget is a static widget. In this case, the widget is displayed as a static image after being added.| Boolean| Yes (initial value: **true**)| + **Table 2** Internal structure of the window object + + | Field| Description| Data Type| Default Value Allowed| + | -------- | -------- | -------- | -------- | + | designWidth | Baseline width for page design. The size of an element is scaled by the actual device width.| Number| Yes (initial value: **720px**)| + | autoDesignWidth | Whether to automatically calculate the baseline width for page design. If it is set to **true**, the **designWidth** attribute will be ignored, and the baseline width will be calculated based on the device width and screen density.| Boolean| Yes (initial value: **false**)| + Example configuration: diff --git a/en/application-dev/application-models/arkts-ui-widget-page-animation.md b/en/application-dev/application-models/arkts-ui-widget-page-animation.md index 0cb8e356c61155d367e55c0f39bbf491d03e2e12..ff479a47e17cadc04c38ecdc3931b5aa1b3d687f 100644 --- a/en/application-dev/application-models/arkts-ui-widget-page-animation.md +++ b/en/application-dev/application-models/arkts-ui-widget-page-animation.md @@ -1,7 +1,7 @@ # Using Animations in the Widget -To make your ArkTS widget more engaging, you can apply animations to it, including [explicit animation](../reference/arkui-ts/ts-explicit-animation.md), [attribute animation](../reference/arkui-ts/ts-animatorproperty.md), and [component transition](../reference/arkui-ts/ts-transition-animation-component.md). Just note the following restrictions when using the animations in ArkTS widgets. +To make your ArkTS widget more engaging, you can apply animations to it, including [explicit animation](../reference/arkui-ts/ts-explicit-animation.md), [property animation](../reference/arkui-ts/ts-animatorproperty.md), and [component transition](../reference/arkui-ts/ts-transition-animation-component.md). Just note the following restrictions when using the animations in ArkTS widgets. **Table 1** Restrictions on animation parameters diff --git a/en/application-dev/application-models/arkts-ui-widget-working-principles.md b/en/application-dev/application-models/arkts-ui-widget-working-principles.md index 25cb66f1b05eaf845c11ab05350f2e705de6cec8..a8599ca8827c2d41c3ff1be032151c1f6debead9 100644 --- a/en/application-dev/application-models/arkts-ui-widget-working-principles.md +++ b/en/application-dev/application-models/arkts-ui-widget-working-principles.md @@ -35,7 +35,7 @@ As a quick entry to applications, ArkTS widgets outperform JS widgets in the fol ![WidgetProject](figures/WidgetProject.png) - More widget features - - Animation: ArkTS widgets support the [attribute animation](../reference/arkui-ts/ts-animatorproperty.md) and [explicit animation](../reference/arkui-ts/ts-explicit-animation.md) capabilities, which can be leveraged to deliver a more engaging experience. + - Animation: ArkTS widgets support the [property animation](../reference/arkui-ts/ts-animatorproperty.md) and [explicit animation](../reference/arkui-ts/ts-explicit-animation.md) capabilities, which can be leveraged to deliver a more engaging experience. - Custom drawing: ArkTS widgets allow you to draw graphics with the [\](../reference/arkui-ts/ts-components-canvas-canvas.md) component to present information more vividly. - Logic code execution: The capability to run logic code in widgets means that service logic can be self-closed in widgets, expanding the use cases of widgets. diff --git a/en/application-dev/napi/figures/onDestroy.png b/en/application-dev/napi/figures/onDestroy.png new file mode 100644 index 0000000000000000000000000000000000000000..41f10a3a0a1ecafb673f5013199977a42bc9b531 Binary files /dev/null and b/en/application-dev/napi/figures/onDestroy.png differ diff --git a/en/application-dev/napi/figures/onLoad.png b/en/application-dev/napi/figures/onLoad.png new file mode 100644 index 0000000000000000000000000000000000000000..361cd48e2ddd5e14b86644628c09874d411c37f9 Binary files /dev/null and b/en/application-dev/napi/figures/onLoad.png differ diff --git a/en/application-dev/napi/native-window-guidelines.md b/en/application-dev/napi/native-window-guidelines.md index 4f39be0a9b311d28b1a6551eac728484893a948f..f6f4e44b5edd8f40757105b4c050d4c9b2b0363d 100644 --- a/en/application-dev/napi/native-window-guidelines.md +++ b/en/application-dev/napi/native-window-guidelines.md @@ -23,81 +23,88 @@ For details about the APIs, see [native_window](../reference/native-apis/_native The following describes how to use the native APIs provided by **NativeWindow** to request a graphics buffer, write the produced graphics content to the buffer, and flush the buffer to the graphics queue. +**Adding Dynamic Link Libraries** + +Add the following libraries to **CMakeLists.txt**: +```txt +libace_ndk.z.so +libnative_window.so +``` + **Header File** ```c++ +#include #include ``` -1. Obtain an **OHNativeWindow** instance, which can be obtained by running the APIs provided by [OH_NativeXComponent_Callback](../reference/native-apis/_o_h___native_x_component___callback.md). - 1. Define **XComponent** in an .ets file. +1. Obtain an **OHNativeWindow** instance. + + You can call the APIs provided by [OH_NativeXComponent_Callback](../reference/native-apis/_o_h___native_x_component___callback.md) to obtain an **OHNativeWindow** instance. An example code snippet is provided below. For details about how to use the **\**, see [XComponent Development](xcomponent-guidelines.md). + 1. Add an **\** to the .ets file. ```ts - XComponent({ id: 'xcomponentId', type: 'surface', libraryname: 'nativerender'}) - .onLoad((context) => { - this.context = context; - }) - .onDestroy(() => { - }) + XComponent({ id: 'xcomponentId', type: 'surface', libraryname: 'entry'}) + .width(360) + .height(360) + ``` + 2. Obtain **NativeXComponent** at the native C++ layer. + ```c++ + napi_value exportInstance = nullptr; + // Parse the attribute of the wrapped NativeXComponent pointer. + napi_get_named_property(env, exports, OH_NATIVE_XCOMPONENT_OBJ, &exportInstance); + OH_NativeXComponent *nativeXComponent = nullptr; + // Use the napi_unwrap API to parse the NativeXComponent instance pointer. + napi_unwrap(env, exportInstance, reinterpret_cast(&nativeXComponent)); + ``` + 3. Define **OH_NativeXComponent_Callback**. + ```c++ + // Define the callback. + void OnSurfaceCreatedCB(OH_NativeXComponent* component, void* window) + { + // Obtain an OHNativeWindow instance. + OHNativeWindow* nativeWindow = static_cast(window); + // ... + } + void OnSurfaceChangedCB(OH_NativeXComponent* component, void* window) + { + // Obtain an OHNativeWindow instance. + OHNativeWindow* nativeWindow = static_cast(window); + // ... + } + void OnSurfaceDestroyedCB(OH_NativeXComponent* component, void* window) + { + // Obtain an OHNativeWindow instance. + OHNativeWindow* nativeWindow = static_cast(window); + // ... + } + void DispatchTouchEventCB(OH_NativeXComponent* component, void* window) + { + // Obtain an OHNativeWindow instance. + OHNativeWindow* nativeWindow = static_cast(window); + // ... + } + ``` + ```c++ + // Initialize OH_NativeXComponent_Callback. + OH_NativeXComponent_Callback callback; + callback.OnSurfaceCreated = OnSurfaceCreatedCB; + callback.OnSurfaceChanged = OnSurfaceChangedCB; + callback.OnSurfaceDestroyed = OnSurfaceDestroyedCB; + callback.DispatchTouchEvent = DispatchTouchEventCB; ``` - 2. Obtain **NativeXComponent** at the native C++ layer. - ```c++ - napi_value exportInstance = nullptr; - napi_get_named_property(env, exports, OH_NATIVE_XCOMPONENT_OBJ, &exportInstance); - - OH_NativeXComponent *nativeXComponent = nullptr; - napi_unwrap(env, exportInstance, reinterpret_cast(&nativeXComponent)); - - char idStr[OH_XCOMPONENT_ID_LEN_MAX + 1] = { }; - uint64_t idSize = OH_XCOMPONENT_ID_LEN_MAX + 1; - OH_NativeXComponent_GetXComponentId(nativeXComponent, idStr, &idSize); - ``` - 3. Define **OH_NativeXComponent_Callback**. - ```c++ - // Define the callback. - void OnSurfaceCreatedCB(OH_NativeXComponent* component, void* window) - { - // Obtain an OHNativeWindow instance. - OHNativeWindow* nativeWindow = window; - // ... - } - void OnSurfaceChangedCB(OH_NativeXComponent* component, void* window) - { - // Obtain an OHNativeWindow instance. - OHNativeWindow* nativeWindow = window; - // ... - } - void OnSurfaceDestroyedCB(OH_NativeXComponent* component, void* window) - { - // Obtain an OHNativeWindow instance. - OHNativeWindow* nativeWindow = window; - // ... - } - void DispatchTouchEventCB(OH_NativeXComponent* component, void* window) - { - // Obtain an OHNativeWindow instance. - OHNativeWindow* nativeWindow = window; - // ... - } - ``` - ```c++ - // Initialize OH_NativeXComponent_Callback. - OH_NativeXComponent_Callback callback_; - callback_->OnSurfaceCreated = OnSurfaceCreatedCB; - callback_->OnSurfaceChanged = OnSurfaceChangedCB; - callback_->OnSurfaceDestroyed = OnSurfaceDestroyedCB; - callback_->DispatchTouchEvent = DispatchTouchEventCB; - ``` 4. Register **OH_NativeXComponent_Callback** with **NativeXComponent**. - ```c++ - OH_NativeXComponent_RegisterCallback(nativeXComponent, &callback_); - ``` + ```c++ + // Register the callback. + OH_NativeXComponent_RegisterCallback(nativeXComponent, &callback); + ``` 2. Set the attributes of an **OHNativeWindowBuffer** by using **OH_NativeWindow_NativeWindowHandleOpt**. ```c++ // Set the width and height of the OHNativeWindowBuffer. - code = SET_BUFFER_GEOMETRY; + int32_t code = SET_BUFFER_GEOMETRY; int32_t width = 0x100; int32_t height = 0x100; - ret = OH_NativeWindow_NativeWindowHandleOpt(nativeWindow, code, width, height); + // The nativeWindow instance is obtained from the callback in the previous step. + int32_t ret = OH_NativeWindow_NativeWindowHandleOpt(nativeWindow, code, width, height); // Set the step of the OHNativeWindowBuffer. code = SET_STRIDE; int32_t stride = 0x8; @@ -109,18 +116,27 @@ The following describes how to use the native APIs provided by **NativeWindow** OHNativeWindowBuffer* buffer = nullptr; int fenceFd; // Obtain the OHNativeWindowBuffer instance by calling OH_NativeWindow_NativeWindowRequestBuffer. - OH_NativeWindow_NativeWindowRequestBuffer(nativeWindow_, &buffer, &fenceFd); - // Obtain the buffer handle by calling OH_NativeWindow_GetNativeBufferHandleFromNative. - BufferHandle* bufferHandle = OH_NativeWindow_GetNativeBufferHandleFromNative(buffer); + OH_NativeWindow_NativeWindowRequestBuffer(nativeWindow, &buffer, &fenceFd); + // Obtain the buffer handle by calling OH_NativeWindow_GetBufferHandleFromNative. + BufferHandle* bufferHandle = OH_NativeWindow_GetBufferHandleFromNative(buffer); + ``` + +4. Map memory. + ```c++ + #include + + // Use mmap() to obtain the memory virtual address of buffer handle. + void* mappedAddr = mmap(bufferHandle->virAddr, bufferHandle->size, PROT_READ | PROT_WRITE, MAP_SHARED, bufferHandle->fd, 0); + if (mappedAddr == MAP_FAILED) { + // mmap failed + } ``` -4. Write the produced content to the **OHNativeWindowBuffer**. +5. Write the produced content to the **OHNativeWindowBuffer**. ```c++ - auto image = static_cast(buffer->sfbuffer->GetVirAddr()); static uint32_t value = 0x00; value++; - - uint32_t *pixel = static_cast(image); + uint32_t *pixel = static_cast(mappedAddr); // Use the address obtained by mmap() to access the memory. for (uint32_t x = 0; x < width; x++) { for (uint32_t y = 0; y < height; y++) { *pixel++ = value; @@ -133,5 +149,15 @@ The following describes how to use the native APIs provided by **NativeWindow** // Set the refresh region. If Rect in Region is a null pointer or rectNumber is 0, all contents in the OHNativeWindowBuffer are changed. Region region{nullptr, 0}; // Flush the buffer to the consumer through OH_NativeWindow_NativeWindowFlushBuffer, for example, by displaying it on the screen. - OH_NativeWindow_NativeWindowFlushBuffer(nativeWindow_, buffer, fenceFd, region); + OH_NativeWindow_NativeWindowFlushBuffer(nativeWindow, buffer, fenceFd, region); ``` +6. Unmap memory. + ```c++ + // Unmap the memory when the memory is no longer required. + int result = munmap(mappedAddr, bufferHandle->size); + if (result == -1) { + // munmap failed + } + ``` + + \ No newline at end of file diff --git a/en/application-dev/napi/neural-network-runtime-guidelines.md b/en/application-dev/napi/neural-network-runtime-guidelines.md index 0c86fd05801197bdd63a885c2071f258687a768e..344ae4f1d623f67fcd3b093e8dec6653b806c4f2 100644 --- a/en/application-dev/napi/neural-network-runtime-guidelines.md +++ b/en/application-dev/napi/neural-network-runtime-guidelines.md @@ -19,18 +19,21 @@ The environment requirements for the Neural Network Runtime are as follows: - Development environment: Ubuntu 18.04 or later. - Access device: a standard device running OpenHarmony. The built-in hardware accelerator driver has been connected to the Neural Network Runtime through an HDI API. -The Neural Network Runtime is opened to external systems through OpenHarmony Native APIs. Therefore, you need to use the Native development suite of the OpenHarmony to compile Neural Network Runtime applications. You can download the **ohos-sdk** package of the corresponding version from [Daily Build](http://ci.openharmony.cn/dailys/dailybuilds) in the OpenHarmony community and then decompress the package to obtain the Native development suite of the corresponding platform. Take Linux as an example. The package of the Native development suite is named `native-linux-{version number}.zip`. +The Neural Network Runtime is opened to external systems through OpenHarmony Native APIs. Therefore, you need to use the Native development suite of the OpenHarmony to compile Neural Network Runtime applications. + ### Environment Setup 1. Start the Ubuntu server. -2. Copy the downloaded package of the Native development suite to the root directory of the current user. +2. Copy the package of the Native development suite to the root directory of the current user. 3. Decompress the package of the Native development suite. + ```shell unzip native-linux-{version number}.zip ``` The directory structure after decompression is as follows. The content in the directory may vary depending on version iteration. Use the Native APIs of the latest version. + ```text native/ ─ ─ build // Cross-compilation toolchain @@ -470,22 +473,19 @@ The development process of the Neural Network Runtime consists of three phases: > The IR graphs of the model need to be passed to the hardware driver layer, so that the HDI service compiles the IR graphs into a computing graph dedicated to hardware. The compilation process is time-consuming. The Neural Network Runtime supports the computing graph cache feature. It can cache the computing graphs compiled by the HDI service to the device storage. If the same model is compiled on the same acceleration chip next time, you can specify the cache path so that the Neural Network Runtime can directly load the computing graphs in the cache file, reducing the compilation time. Check the cached files in the cache directory. + ```shell ls /data/local/tmp ``` The command output is as follows: + ```text # 0.nncache cache_info.nncache ``` If the cache is no longer used, manually delete the cache files. + ```shell rm /data/local/tmp/*nncache - ``` - -## Samples - -The following sample is provided to help you understand how to connect a third-party AI inference framework to the Neural Network Runtime: -- [Development Guide for Connecting TensorFlow Lite to NNRt Delegate](https://gitee.com/openharmony/neural_network_runtime/tree/master/example/deep_learning_framework) - + ``` \ No newline at end of file diff --git a/en/application-dev/napi/xcomponent-guidelines.md b/en/application-dev/napi/xcomponent-guidelines.md new file mode 100644 index 0000000000000000000000000000000000000000..dd365dd461a3bf868451b047aecd1c8f68c5b390 --- /dev/null +++ b/en/application-dev/napi/xcomponent-guidelines.md @@ -0,0 +1,902 @@ +# XComponent Development + +## When to Use + +**NativeXComponent** provides an instance for the **\** at the native layer, which can be used as a bridge for binding with the **\** at the JS layer. The NDK APIs provided by the **\** depend on this instance. The provided APIs include those for obtaining a native window, obtaining the layout or event information of the **\**, registering the lifecycle callbacks of the **\**, and registering the callbacks for the touch, mouse, and key events of the **\**. You can use the provided APIs in the following scenarios: + +- Register the lifecycle and event callbacks of the **\**. +- In these callbacks, you can initialize the environment, obtain the current state, and respond to various events. +- Use the native window and EGL APIs to develop custom drawing content, and apply for and submit buffers to the graphics queue. + +## Available APIs + +| API| Description.| +| -------- | -------- | +|OH_NativeXComponent_GetXComponentId(OH_NativeXComponent* component, char* id, uint64_t* size)|Obtains the ID of the **\**.| +|OH_NativeXComponent_GetXComponentSize(OH_NativeXComponent* component, const void* window, uint64_t* width, uint64_t* height)|Obtains the size of the surface held by the **\**.| +|OH_NativeXComponent_GetXComponentOffset(OH_NativeXComponent* component, const void* window, double* x, double* y)|Obtains the offset of the surface held by the **\** relative to the upper left corner of the window.| +|OH_NativeXComponent_GetTouchEvent(OH_NativeXComponent* component, const void* window, OH_NativeXComponent_TouchEvent* touchEvent)|Obtains the touch event triggered by the **\**.| +|OH_NativeXComponent_GetTouchPointToolType(OH_NativeXComponent* component, uint32_t pointIndex, OH_NativeXComponent_TouchPointToolType* toolType)|Obtains the tool type of the **\** touch point.| +|OH_NativeXComponent_GetTouchPointTiltX(OH_NativeXComponent* component, uint32_t pointIndex, float* tiltX)|Obtains the tilt angle of the **\** touch point relative to the x-axis.| +|OH_NativeXComponent_GetTouchPointTiltY(OH_NativeXComponent* component, uint32_t pointIndex, float* tiltY)|Obtains the tilt angle of the **\** touch point relative to the y-axis.| +|OH_NativeXComponent_GetMouseEvent(OH_NativeXComponent* component, const void* window, OH_NativeXComponent_MouseEvent* mouseEvent)|Obtains the mouse event triggered by the **\**.| +|OH_NativeXComponent_RegisterCallback(OH_NativeXComponent* component, OH_NativeXComponent_Callback* callback)|Registers the lifecycle and touch event callback for this **OH_NativeXComponent** instance.| +|OH_NativeXComponent_RegisterMouseEventCallback(OH_NativeXComponent* component, OH_NativeXComponent_MouseEvent_Callback* callback)|Registers the mouse event callback for this **OH_NativeXComponent** instance.| +|OH_NativeXComponent_RegisterFocusEventCallback(OH_NativeXComponent* component, void (\*callback)(OH_NativeXComponent* component, void* window))|Registers the focus obtaining event callback function for this **OH_NativeXComponent** instance.| +|OH_NativeXComponent_RegisterKeyEventCallback(OH_NativeXComponent* component, void (\*callback)(OH_NativeXComponent* component, void* window))|Registers the key event callback for this **OH_NativeXComponent** instance.| +|OH_NativeXComponent_RegisterBlurEventCallback(OH_NativeXComponent* component, void (\*callback)(OH_NativeXComponent* component, void* window))|Registers the focus loss event callback for this **OH_NativeXComponent** instance.| +|OH_NativeXComponent_GetKeyEvent(OH_NativeXComponent* component, OH_NativeXComponent_KeyEvent\** keyEvent)|Obtains the key event triggered by the **\**.| +|OH_NativeXComponent_GetKeyEventAction(OH_NativeXComponent_KeyEvent* keyEvent, OH_NativeXComponent_KeyAction* action)|Obtains the action of a key event.| +|OH_NativeXComponent_GetKeyEventCode(OH_NativeXComponent_KeyEvent* keyEvent, OH_NativeXComponent_KeyCode* code)|Obtains the key code value of a key event.| +|OH_NativeXComponent_GetKeyEventSourceType(OH_NativeXComponent_KeyEvent* keyEvent, OH_NativeXComponent_EventSourceType* sourceType)|Obtains the input source type of a key event.| +|OH_NativeXComponent_GetKeyEventDeviceId(OH_NativeXComponent_KeyEvent* keyEvent, int64_t* deviceId)|Obtains the device ID of a key event.| +|OH_NativeXComponent_GetKeyEventTimestamp(OH_NativeXComponent_KeyEvent* keyEvent, int64_t* timestamp)|Obtains the timestamp of a key event.| + +## Lifecycle Description + +You can use the **\** to develop EGL/OpenGL ES rendering by using the following code on the ArkTS side: + +```typescript +XComponent({ id: 'xcomponentId1', type: 'surface', libraryname: 'nativerender' }) + .onLoad((context) => {}) + .onDestroy(() => {}) +``` + +### **onLoad** Event + +Trigger time: when the surface of the **\** is ready. + +**context** parameter: where the native API exposed on the module is mounted. Its usage is similar to the usage of a **context** instance obtained after the module is directly loaded using **import context from "libnativerender.so"**. + +Time sequence: subject to the surface. The figure below shows the time sequence of the **onLoad** event and the **OnSurfaceCreated** event at the native layer. + +![onLoad](./figures/onLoad.png) + +### **onDestroy** Event + +Trigger time: when the **\** is destroyed, in the same manner as that when an ArkUI component is destroyed. The figure below shows the time sequence of the **onDestroy** event and the **OnSurfaceDestroyed** event at the native layer. + +![onDestroy](./figures/onDestroy.png) + +## How to Develop +The following describes how to use the **\** to call the native APIs to create the EGL/GLES environment, draw graphics on the main page, and change graphics colors. + +1. Define the **\** on the GUI. + + ```typescript + // ... + // Define XComponent in an .ets file. + XComponent({ + id: 'xcomponentId', + type: XComponentType.SURFACE, + libraryname: 'nativerender' + }) + .focusable(true) // Set the component to be able to respond to key events. + .onLoad((xComponentContext) => { + this.xComponentContext = xComponentContext; + }) + .onDestroy(() => { + console.log("onDestroy"); + }) + // ... + ``` + +2. Register the N-API module. For details, see [Using Native APIs in Application Projects](https://gitee.com/openharmony/docs/blob/master/en/application-dev/napi/napi-guidelines.md). + + ```c++ + // In the napi_init.cpp file, use the Init method to register the target function to transfer the encapsulated C++ methods for the JS side to call. + EXTERN_C_START + static napi_value Init(napi_env env, napi_value exports) + { + // ... + // Expose the getContext() API to the JS side. + napi_property_descriptor desc[] = { + { "getContext", nullptr, PluginManager::GetContext, nullptr, nullptr, nullptr, napi_default, nullptr } + }; + if (napi_define_properties(env, exports, sizeof(desc) / sizeof(desc[0]), desc) != napi_ok) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "Init", "napi_define_properties failed"); + return nullptr; + } + // Check whether the environment variables in the method contain the instance. If the instance exists, register the drawing-related API. + PluginManager::GetInstance()->Export(env, exports); + return exports; + } + EXTERN_C_END + + // Write the API description. You can modify the corresponding parameters as required. + static napi_module nativerenderModule = { + .nm_version = 1, + .nflag_s = 0, + .nm_filename = nullptr, + // Entry function + .nm_register_func = Init, + // Module name + .nm_modname = "nativerender", + .nm_priv = ((void *)0), + .reserved = { 0 } + }; + + // The method decorated by __attribute__((constructor)) is automatically called by the system. The N-API napi_module_register() is used to transfer the module description for module registration. + extern "C" __attribute__((constructor)) void RegisterModule(void) + { + napi_module_register(&nativerenderModule); + } + + // Use the napi_define_properties method in the N-APIs to expose the drawPattern() method to the JS side and call the drawPattern() method on the JS side to draw content. + void PluginRender::Export(napi_env env, napi_value exports) + { + // ... + // Register the function as the JS API drawPattern. + napi_property_descriptor desc[] = { + { "drawPattern", nullptr, PluginRender::NapiDrawPattern, nullptr, nullptr, nullptr, napi_default, nullptr } + }; + if (napi_define_properties(env, exports, sizeof(desc) / sizeof(desc[0]), desc) != napi_ok) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "PluginRender", "Export: napi_define_properties failed"); + } + } + ``` + +3. Register the **\** event callback and use the N-API to implement it. + + (1) Define the callbacks for the touch event of the **\** and for when a surface is successfully created, changed, or destroyed. + + ```c++ + // Define the OnSurfaceCreatedCB() function to encapsulate the initialization environment and drawing background. + void OnSurfaceCreatedCB(OH_NativeXComponent *component, void *window) + { + // ... + // Obtain the ID of the , that is, the id parameter in the struct on the JS side. + char idStr[OH_XCOMPONENT_ID_LEN_MAX + 1] = { '\0' }; + uint64_t idSize = OH_XCOMPONENT_ID_LEN_MAX + 1; + if (OH_NativeXComponent_GetXComponentId(component, idStr, &idSize) != OH_NATIVEXCOMPONENT_RESULT_SUCCESS) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "Callback", + "OnSurfaceCreatedCB: Unable to get XComponent id"); + return; + } + + // Initialize the environment and draw the background. + std::string id(idStr); + auto render = PluginRender::GetInstance(id); + uint64_t width; + uint64_t height; + // Obtain the size of the surface held by the . + int32_t xSize = OH_NativeXComponent_GetXComponentSize(component, window, &width, &height); + if ((xSize == OH_NATIVEXCOMPONENT_RESULT_SUCCESS) && (render != nullptr)) { + if (render->eglCore_->EglContextInit(window, width, height)) { + render->eglCore_->Background(); + } + } + } + + // Define the OnSurfaceChangedCB() function. + void OnSurfaceChangedCB(OH_NativeXComponent *component, void *window) + { + // ... + // Obtain the ID of the . + char idStr[OH_XCOMPONENT_ID_LEN_MAX + 1] = { '\0' }; + uint64_t idSize = OH_XCOMPONENT_ID_LEN_MAX + 1; + if (OH_NativeXComponent_GetXComponentId(component, idStr, &idSize) != OH_NATIVEXCOMPONENT_RESULT_SUCCESS) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "Callback", + "OnSurfaceChangedCB: Unable to get XComponent id"); + return; + } + + std::string id(idStr); + auto render = PluginRender::GetInstance(id); + if (render != nullptr) { + // Encapsulate the OnSurfaceChanged method. + render->OnSurfaceChanged(component, window); + } + } + + // Define the OnSurfaceDestroyedCB() function and encapsulate in it the Release() method in the PluginRender class for releasing resources. + void OnSurfaceDestroyedCB(OH_NativeXComponent *component, void *window) + { + // ... + // Obtain the ID of the . + char idStr[OH_XCOMPONENT_ID_LEN_MAX + 1] = { '\0' }; + uint64_t idSize = OH_XCOMPONENT_ID_LEN_MAX + 1; + if (OH_NativeXComponent_GetXComponentId(component, idStr, &idSize) != OH_NATIVEXCOMPONENT_RESULT_SUCCESS) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "Callback", + "OnSurfaceDestroyedCB: Unable to get XComponent id"); + return; + } + + std::string id(idStr); + // Release resources. + PluginRender::Release(id); + } + + // Define the DispatchTouchEventCB() function, which is triggered when a touch event is responded to. + void DispatchTouchEventCB(OH_NativeXComponent *component, void *window) + { + // ... + // Obtain the ID of the . + char idStr[OH_XCOMPONENT_ID_LEN_MAX + 1] = { '\0' }; + uint64_t idSize = OH_XCOMPONENT_ID_LEN_MAX + 1; + if (OH_NativeXComponent_GetXComponentId(component, idStr, &idSize) != OH_NATIVEXCOMPONENT_RESULT_SUCCESS) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "Callback", + "DispatchTouchEventCB: Unable to get XComponent id"); + return; + } + + std::string id(idStr); + PluginRender *render = PluginRender::GetInstance(id); + if (render != nullptr) { + // Encapsulate the OnTouchEvent method. + render->OnTouchEvent(component, window); + } + } + + // Define the DispatchMouseEventCB() function, which is triggered when a mouse event is responded to. + void DispatchMouseEventCB(OH_NativeXComponent *component, void *window) { + OH_LOG_Print(LOG_APP, LOG_INFO, LOG_PRINT_DOMAIN, "Callback", "DispatchMouseEventCB"); + int32_t ret; + char idStr[OH_XCOMPONENT_ID_LEN_MAX + 1] = {}; + uint64_t idSize = OH_XCOMPONENT_ID_LEN_MAX + 1; + ret = OH_NativeXComponent_GetXComponentId(component, idStr, &idSize); + if (ret != OH_NATIVEXCOMPONENT_RESULT_SUCCESS) { + return; + } + + std::string id(idStr); + auto render = PluginRender::GetInstance(id); + if (render) { + // Encapsulate the OnMouseEvent method. + render->OnMouseEvent(component, window); + } + } + + // Define the DispatchHoverEventCB() function, which is triggered when the mouse pointer hover event is responded to. + void DispatchHoverEventCB(OH_NativeXComponent *component, bool isHover) { + OH_LOG_Print(LOG_APP, LOG_INFO, LOG_PRINT_DOMAIN, "Callback", "DispatchHoverEventCB"); + int32_t ret; + char idStr[OH_XCOMPONENT_ID_LEN_MAX + 1] = {}; + uint64_t idSize = OH_XCOMPONENT_ID_LEN_MAX + 1; + ret = OH_NativeXComponent_GetXComponentId(component, idStr, &idSize); + if (ret != OH_NATIVEXCOMPONENT_RESULT_SUCCESS) { + return; + } + + std::string id(idStr); + auto render = PluginRender::GetInstance(id); + if (render) { + // Encapsulate the OnHoverEvent method. + render->OnHoverEvent(component, isHover); + } + } + + // Define the OnFocusEventCB() function, which is triggered when a focus obtaining event is responded to. + void OnFocusEventCB(OH_NativeXComponent *component, void *window) { + OH_LOG_Print(LOG_APP, LOG_INFO, LOG_PRINT_DOMAIN, "Callback", "OnFocusEventCB"); + int32_t ret; + char idStr[OH_XCOMPONENT_ID_LEN_MAX + 1] = {}; + uint64_t idSize = OH_XCOMPONENT_ID_LEN_MAX + 1; + ret = OH_NativeXComponent_GetXComponentId(component, idStr, &idSize); + if (ret != OH_NATIVEXCOMPONENT_RESULT_SUCCESS) { + return; + } + + std::string id(idStr); + auto render = PluginRender::GetInstance(id); + if (render) { + // Encapsulate the OnFocusEvent method. + render->OnFocusEvent(component, window); + } + } + + // Define the OnBlurEventCB() function, which is triggered when the focus loss event is responded to. + void OnBlurEventCB(OH_NativeXComponent *component, void *window) { + OH_LOG_Print(LOG_APP, LOG_INFO, LOG_PRINT_DOMAIN, "Callback", "OnBlurEventCB"); + int32_t ret; + char idStr[OH_XCOMPONENT_ID_LEN_MAX + 1] = {}; + uint64_t idSize = OH_XCOMPONENT_ID_LEN_MAX + 1; + ret = OH_NativeXComponent_GetXComponentId(component, idStr, &idSize); + if (ret != OH_NATIVEXCOMPONENT_RESULT_SUCCESS) { + return; + } + + std::string id(idStr); + auto render = PluginRender::GetInstance(id); + if (render) { + // Encapsulate the OnBlurEvent method. + render->OnBlurEvent(component, window); + } + } + + // Define the OnKeyEventCB() function, which is triggered when a key event is responded to. + void OnKeyEventCB(OH_NativeXComponent *component, void *window) { + OH_LOG_Print(LOG_APP, LOG_INFO, LOG_PRINT_DOMAIN, "Callback", "OnKeyEventCB"); + int32_t ret; + char idStr[OH_XCOMPONENT_ID_LEN_MAX + 1] = {}; + uint64_t idSize = OH_XCOMPONENT_ID_LEN_MAX + 1; + ret = OH_NativeXComponent_GetXComponentId(component, idStr, &idSize); + if (ret != OH_NATIVEXCOMPONENT_RESULT_SUCCESS) { + return; + } + std::string id(idStr); + auto render = PluginRender::GetInstance(id); + if (render) { + // Encapsulate the OnKeyEvent method. + render->OnKeyEvent(component, window); + } + } + + // Define an OnSurfaceChanged() method. + void PluginRender::OnSurfaceChanged(OH_NativeXComponent* component, void* window) + { + // ... + std::string id(idStr); + PluginRender* render = PluginRender::GetInstance(id); + double offsetX; + double offsetY; + // Obtain the offset of the surface held by the relative to the upper left corner of the window. + OH_NativeXComponent_GetXComponentOffset(component, window, &offsetX, &offsetY); + OH_LOG_Print(LOG_APP, LOG_INFO, LOG_PRINT_DOMAIN, "OH_NativeXComponent_GetXComponentOffset", + "offsetX = %{public}lf, offsetY = %{public}lf", offsetX, offsetY); + uint64_t width; + uint64_t height; + OH_NativeXComponent_GetXComponentSize(component, window, &width, &height); + if (render != nullptr) { + render->eglCore_->UpdateSize(width, height); + } + } + + // Define an OnTouchEvent() method. + void PluginRender::OnTouchEvent(OH_NativeXComponent* component, void* window) + { + // ... + OH_NativeXComponent_TouchEvent touchEvent; + // Obtain the touch event triggered by the . + OH_NativeXComponent_GetTouchEvent(component, window, &touchEvent); + std::string id(idStr); + PluginRender* render = PluginRender::GetInstance(id); + if (render != nullptr && touchEvent.type == OH_NativeXComponent_TouchEventType::OH_NATIVEXCOMPONENT_UP) { + render->eglCore_->ChangeColor(); + hasChangeColor_ = 1; + } + float tiltX = 0.0f; + float tiltY = 0.0f; + OH_NativeXComponent_TouchPointToolType toolType = + OH_NativeXComponent_TouchPointToolType::OH_NATIVEXCOMPONENT_TOOL_TYPE_UNKNOWN; + // Obtain the tool type of the touch point. + OH_NativeXComponent_GetTouchPointToolType(component, 0, &toolType); + // Obtain the tilt angle of the touch point relative to the x-axis. + OH_NativeXComponent_GetTouchPointTiltX(component, 0, &tiltX); + // Obtain the tilt angle of the touch point relative to the y-axis. + OH_NativeXComponent_GetTouchPointTiltY(component, 0, &tiltY); + OH_LOG_Print(LOG_APP, LOG_INFO, LOG_PRINT_DOMAIN, "OnTouchEvent", + "touch info: toolType = %{public}d, tiltX = %{public}lf, tiltY = %{public}lf", toolType, tiltX, tiltY); + } + + // Define an OnMouseEvent() method. + void PluginRender::OnMouseEvent(OH_NativeXComponent *component, void *window) { + OH_LOG_Print(LOG_APP, LOG_INFO, LOG_PRINT_DOMAIN, "PluginRender", "OnMouseEvent"); + OH_NativeXComponent_MouseEvent mouseEvent; + // Obtain the mouse event triggered by the . + int32_t ret = OH_NativeXComponent_GetMouseEvent(component, window, &mouseEvent); + if (ret == OH_NATIVEXCOMPONENT_RESULT_SUCCESS) { + OH_LOG_Print(LOG_APP, LOG_INFO, LOG_PRINT_DOMAIN, "PluginRender", "MouseEvent Info: x = %{public}f, y = %{public}f, action = %{public}d, button = %{public}d", mouseEvent.x, mouseEvent.y, mouseEvent.action, mouseEvent.button); + } else { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "PluginRender", "GetMouseEvent error"); + } + } + + // Define an OnMouseEvent() method. + void PluginRender::OnKeyEvent(OH_NativeXComponent *component, void *window) { + OH_LOG_Print(LOG_APP, LOG_INFO, LOG_PRINT_DOMAIN, "PluginRender", "OnKeyEvent"); + + OH_NativeXComponent_KeyEvent *keyEvent = nullptr; + // Obtain the key event triggered by the . + if (OH_NativeXComponent_GetKeyEvent(component, &keyEvent) >= 0) { + OH_NativeXComponent_KeyAction action; + // Obtain the action of a key event. + OH_NativeXComponent_GetKeyEventAction(keyEvent, &action); + OH_NativeXComponent_KeyCode code; + // Obtain the key code value of a key event. + OH_NativeXComponent_GetKeyEventCode(keyEvent, &code); + OH_NativeXComponent_EventSourceType sourceType; + // Obtain the input source type of a key event. + OH_NativeXComponent_GetKeyEventSourceType(keyEvent, &sourceType); + int64_t deviceId; + // Obtain the device ID of a key event. + OH_NativeXComponent_GetKeyEventDeviceId(keyEvent, &deviceId); + int64_t timeStamp; + // Obtain the timestamp of a key event. + OH_NativeXComponent_GetKeyEventTimestamp(keyEvent, &timeStamp); + OH_LOG_Print(LOG_APP, LOG_INFO, LOG_PRINT_DOMAIN, "PluginRender", "KeyEvent Info: action=%{public}d, code=%{public}d, sourceType=%{public}d, deviceId=%{public}ld, timeStamp=%{public}ld", action, code, sourceType, deviceId, timeStamp); + } else { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "PluginRender", "GetKeyEvent error"); + } + } + ``` + + (2) Register the **\** event callback and call the method defined in step 3.1 when the **\** event is triggered. + + ```c++ + void PluginRender::RegisterCallback(OH_NativeXComponent *nativeXComponent) { + // Set the callback of the component creation event. When the component is created, related operations are triggered to initialize the environment and draw the background. + renderCallback_.OnSurfaceCreated = OnSurfaceCreatedCB; + // Set the callback of the component change event. When the component changes, related operations are triggered. + renderCallback_.OnSurfaceChanged = OnSurfaceChangedCB; + // Set the callback of the component destruction event. When the component is destroyed, related operations are triggered to release the requested resources. + renderCallback_.OnSurfaceDestroyed = OnSurfaceDestroyedCB; + // Set the callback of the touch event. When the touch event is triggered, the N-API is called to call the original C++ method. + renderCallback_.DispatchTouchEvent = DispatchTouchEventCB; + // Register OH_NativeXComponent_Callback with NativeXComponent. + OH_NativeXComponent_RegisterCallback(nativeXComponent, &renderCallback_); + + // Set the callback of the mouse event. When the event is triggered, the N-API is called to call the original C++ method. + mouseCallback_.DispatchMouseEvent = DispatchMouseEventCB; + // Set the callback of the mouse event. When the event is triggered, the N-API is called to call the original C++ method. + mouseCallback_.DispatchHoverEvent = DispatchHoverEventCB; + // Register OH_NativeXComponent_MouseEvent_Callback with NativeXComponent. + OH_NativeXComponent_RegisterMouseEventCallback(nativeXComponent, &mouseCallback_); + + // Register the OnFocusEventCB method with NativeXComponent. + OH_NativeXComponent_RegisterFocusEventCallback(nativeXComponent, OnFocusEventCB); + // Register the OnKeyEventCB method with NativeXComponent. + OH_NativeXComponent_RegisterKeyEventCallback(nativeXComponent, OnKeyEventCB); + // Register the OnBlurEventCB method with NativeXComponent. + OH_NativeXComponent_RegisterBlurEventCallback(nativeXComponent, OnBlurEventCB); + } + ``` + + (3) Define the **NapiDrawPattern** method, which will be called by the **drawPattern()** method exposed to the JS side. + + ```c++ + napi_value PluginRender::NapiDrawPattern(napi_env env, napi_callback_info info) + { + // ... + // Obtain environment variables. + napi_value thisArg; + if (napi_get_cb_info(env, info, nullptr, nullptr, &thisArg, nullptr) != napi_ok) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "PluginRender", "NapiDrawPattern: napi_get_cb_info fail"); + return nullptr; + } + + // Obtain the XComponent instance from the environment variables. + napi_value exportInstance; + if (napi_get_named_property(env, thisArg, OH_NATIVE_XCOMPONENT_OBJ, &exportInstance) != napi_ok) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "PluginRender", + "NapiDrawPattern: napi_get_named_property fail"); + return nullptr; + } + + // Use napi_unwrap to obtain the pointer to the XComponent instance. + OH_NativeXComponent *nativeXComponent = nullptr; + if (napi_unwrap(env, exportInstance, reinterpret_cast(&nativeXComponent)) != napi_ok) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "PluginRender", "NapiDrawPattern: napi_unwrap fail"); + return nullptr; + } + + // Obtain the ID of the XComponent instance. + char idStr[OH_XCOMPONENT_ID_LEN_MAX + 1] = { '\0' }; + uint64_t idSize = OH_XCOMPONENT_ID_LEN_MAX + 1; + if (OH_NativeXComponent_GetXComponentId(nativeXComponent, idStr, &idSize) != OH_NATIVEXCOMPONENT_RESULT_SUCCESS) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "PluginRender", + "NapiDrawPattern: Unable to get XComponent id"); + return nullptr; + } + + std::string id(idStr); + PluginRender *render = PluginRender::GetInstance(id); + if (render) { + // Call the drawing method. + render->eglCore_->Draw(); + OH_LOG_Print(LOG_APP, LOG_INFO, LOG_PRINT_DOMAIN, "PluginRender", "render->eglCore_->Draw() executed"); + } + return nullptr; + } + ``` + +4. Initialize the environment, including initializing the available EGLDisplay, determining the available surface configuration, creating the rendering area surface, and creating and associating the context. + + ```c++ + void EGLCore::UpdateSize(int width, int height) + { + width_ = width; + height_ = height; + if (width_ > 0) { + // Calculate the width percentage of the drawn rectangle. + width_Percent_ = FIFTY_PERCENT * height_ / width_; + } + } + + bool EGLCore::EglContextInit(void *window, int width, int height) + { + // ... + UpdateSize(width, height); + eglWindow_ = static_cast(window); + + // Initialize the display. + eglDisplay_ = eglGetDisplay(EGL_DEFAULT_DISPLAY); + if (eglDisplay_ == EGL_NO_DISPLAY) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "eglGetDisplay: unable to get EGL display"); + return false; + } + + // Initialize the EGL. + EGLint majorVersion; + EGLint minorVersion; + if (!eglInitialize(eglDisplay_, &majorVersion, &minorVersion)) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", + "eglInitialize: unable to get initialize EGL display"); + return false; + } + + // Select the configuration. + const EGLint maxConfigSize = 1; + EGLint numConfigs; + if (!eglChooseConfig(eglDisplay_, ATTRIB_LIST, &eglConfig_, maxConfigSize, &numConfigs)) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "eglChooseConfig: unable to choose configs"); + return false; + } + + // Create an environment. + return CreateEnvironment(); + } + ``` + + ```c++ + bool EGLCore::CreateEnvironment() + { + // ... + // Create a surface. + eglSurface_ = eglCreateWindowSurface(eglDisplay_, eglConfig_, eglWindow_, NULL); + + // ... + // Create a context. + eglContext_ = eglCreateContext(eglDisplay_, eglConfig_, EGL_NO_CONTEXT, CONTEXT_ATTRIBS); + if (!eglMakeCurrent(eglDisplay_, eglSurface_, eglSurface_, eglContext_)) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "eglMakeCurrent failed"); + return false; + } + + // Create a program. + program_ = CreateProgram(VERTEX_SHADER, FRAGMENT_SHADER); + if (program_ == PROGRAM_ERROR) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "CreateProgram: unable to create program"); + return false; + } + return true; + } + ``` + +5. Implement the rendering function. + + (1) Draw the background. + + ```c++ + // Draw the background color #f4f4f4. + const GLfloat BACKGROUND_COLOR[] = { 244.0f / 255, 244.0f / 255, 244.0f / 255, 1.0f }; + + // Draw the background vertex. + const GLfloat BACKGROUND_RECTANGLE_VERTICES[] = { + -1.0f, 1.0f, + 1.0f, 1.0f, + 1.0f, -1.0f, + -1.0f, -1.0f + }; + ``` + + ```c++ + // Draw the background color. + void EGLCore::Background() + { + GLint position = PrepareDraw(); + if (position == POSITION_ERROR) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "Background get position failed"); + return; + } + + if (!ExecuteDraw(position, BACKGROUND_COLOR, BACKGROUND_RECTANGLE_VERTICES, + sizeof(BACKGROUND_RECTANGLE_VERTICES))) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "Background execute draw failed"); + return; + } + + if (!FinishDraw()) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "Background FinishDraw failed"); + return; + } + } + + // Prepare for drawing and obtain the value of position. When the creation is successful, the value of position starts from 0. + GLint EGLCore::PrepareDraw() + { + if ((eglDisplay_ == nullptr) || (eglSurface_ == nullptr) || (eglContext_ == nullptr) || + (!eglMakeCurrent(eglDisplay_, eglSurface_, eglSurface_, eglContext_))) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "PrepareDraw: param error"); + return POSITION_ERROR; + } + + glViewport(DEFAULT_X_POSITION, DEFAULT_Y_POSITION, width_, height_); + glClearColor(GL_RED_DEFAULT, GL_GREEN_DEFAULT, GL_BLUE_DEFAULT, GL_ALPHA_DEFAULT); + glClear(GL_COLOR_BUFFER_BIT); + glUseProgram(program_); + + return glGetAttribLocation(program_, POSITION_NAME); + } + + // Draw a specified color in the specified area based on the input parameters. + bool EGLCore::ExecuteDraw(GLint position, const GLfloat *color, const GLfloat shapeVertices[], + unsigned long vertSize) + { + if ((position > 0) || (color == nullptr) || (vertSize / sizeof(shapeVertices[0]) != SHAPE_VERTICES_SIZE)) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "ExecuteDraw: param error"); + return false; + } + + glVertexAttribPointer(position, POINTER_SIZE, GL_FLOAT, GL_FALSE, 0, shapeVertices); + glEnableVertexAttribArray(position); + glVertexAttrib4fv(1, color); + glDrawArrays(GL_TRIANGLE_FAN, 0, TRIANGLE_FAN_SIZE); + glDisableVertexAttribArray(position); + + return true; + } + + // End the drawing operation. + bool EGLCore::FinishDraw() + { + // Forcibly refresh the buffer. + glFlush(); + glFinish(); + return eglSwapBuffers(eglDisplay_, eglSurface_); + } + ``` + + (2) Draw the shape. + + ```c++ + void EGLCore::Draw() + { + flag_ = false; + OH_LOG_Print(LOG_APP, LOG_INFO, LOG_PRINT_DOMAIN, "EGLCore", "Draw"); + GLint position = PrepareDraw(); + if (position == POSITION_ERROR) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "Draw get position failed"); + return; + } + + // Draw the background. + if (!ExecuteDraw(position, BACKGROUND_COLOR, BACKGROUND_RECTANGLE_VERTICES, + sizeof(BACKGROUND_RECTANGLE_VERTICES))) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "Draw execute draw background failed"); + return; + } + + // Divide the pentagon into five quadrilaterals and calculate the four vertices of one of the quadrilaterals. + GLfloat rotateX = 0; + GLfloat rotateY = FIFTY_PERCENT * height_; + GLfloat centerX = 0; + GLfloat centerY = -rotateY * (M_PI / 180 * 54) * (M_PI / 180 * 18); + GLfloat leftX = -rotateY * (M_PI / 180 * 18); + GLfloat leftY = 0; + GLfloat rightX = rotateY * (M_PI / 180 * 18); + GLfloat rightY = 0; + + // Determine the vertices for drawing the quadrilateral, which are represented by the percentage of the drawing area. + const GLfloat shapeVertices[] = { + centerX / width_, centerY / height_, + leftX / width_, leftY / height_, + rotateX / width_, rotateY / height_, + rightX / width_, rightY / height_ + }; + + if (!ExecuteDrawStar(position, DRAW_COLOR, shapeVertices, sizeof(shapeVertices))) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "Draw execute draw star failed"); + return; + } + + GLfloat rad = M_PI / 180 * 72; + for (int i = 0; i < 4; ++i) + { + // Obtain the vertices of the other four quadrilaterals through rotation. + rotate2d(centerX, centerY, &rotateX, &rotateY,rad); + rotate2d(centerX, centerY, &leftX, &leftY,rad); + rotate2d(centerX, centerY, &rightX, &rightY,rad); + + // Determine the vertices for drawing the quadrilateral, which are represented by the percentage of the drawing area. + const GLfloat shapeVertices[] = { + centerX / width_, centerY / height_, + leftX / width_, leftY / height_, + rotateX / width_, rotateY / height_, + rightX / width_, rightY / height_ + }; + + // Draw the shape. + if (!ExecuteDrawStar(position, DRAW_COLOR, shapeVertices, sizeof(shapeVertices))) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "Draw execute draw star failed"); + return; + } + } + + // End drawing. + if (!FinishDraw()) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "Draw FinishDraw failed"); + return; + } + + flag_ = true; + } + ``` + + (3) Change the colors, by drawing a new shape with the same size but different colors and replacing the original shape with the new shape. + + ```c++ + void EGLCore::ChangeColor() + { + if (!flag_) { + return; + } + OH_LOG_Print(LOG_APP, LOG_INFO, LOG_PRINT_DOMAIN, "EGLCore", "ChangeColor"); + GLint position = PrepareDraw(); + if (position == POSITION_ERROR) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "ChangeColor get position failed"); + return; + } + + // Draw the background. + if (!ExecuteDraw(position, BACKGROUND_COLOR, BACKGROUND_RECTANGLE_VERTICES, + sizeof(BACKGROUND_RECTANGLE_VERTICES))) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "ChangeColor execute draw background failed"); + return; + } + + // Determine the vertices for drawing the quadrilateral, which are represented by the percentage of the drawing area. + GLfloat rotateX = 0; + GLfloat rotateY = FIFTY_PERCENT * height_; + GLfloat centerX = 0; + GLfloat centerY = -rotateY * (M_PI / 180 * 54) * (M_PI / 180 * 18); + GLfloat leftX = -rotateY * (M_PI / 180 * 18); + GLfloat leftY = 0; + GLfloat rightX = rotateY * (M_PI / 180 * 18); + GLfloat rightY = 0; + + // Determine the vertices for drawing the quadrilateral, which are represented by the percentage of the drawing area. + const GLfloat shapeVertices[] = { + centerX / width_, centerY / height_, + leftX / width_, leftY / height_, + rotateX / width_, rotateY / height_, + rightX / width_, rightY / height_ + }; + + // Use the new colors for drawing. + if (!ExecuteDrawStar2(position, CHANGE_COLOR, shapeVertices, sizeof(shapeVertices))) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "Draw execute draw star failed"); + return; + } + + GLfloat rad = M_PI / 180 * 72; + for (int i = 0; i < 4; ++i) + { + // Obtain the vertices of the other four quadrilaterals through rotation. + rotate2d(centerX, centerY, &rotateX, &rotateY,rad); + rotate2d(centerX, centerY, &leftX, &leftY,rad); + rotate2d(centerX, centerY, &rightX, &rightY,rad); + + // Determine the vertices for drawing the quadrilateral, which are represented by the percentage of the drawing area. + const GLfloat shapeVertices[] = { + centerX / width_, centerY / height_, + leftX / width_, leftY / height_, + rotateX / width_, rotateY / height_, + rightX / width_, rightY / height_ + }; + + // Use the new colors for drawing. + if (!ExecuteDrawStar2(position, CHANGE_COLOR, shapeVertices, sizeof(shapeVertices))) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "Draw execute draw star failed"); + return; + } + } + + // End drawing. + if (!FinishDraw()) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "ChangeColor FinishDraw failed"); + } + } + ``` + +6. Release related resources. + + (1) Create the **Release()** method in the **EGLCore** class to release the resources requested during environment initialization, including the window display, rendering area surface, and environment context. + + ```c++ + void EGLCore::Release() + { + // Release the surface. + if ((eglDisplay_ == nullptr) || (eglSurface_ == nullptr) || (!eglDestroySurface(eglDisplay_, eglSurface_))) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "Release eglDestroySurface failed"); + } + // Release the context. + if ((eglDisplay_ == nullptr) || (eglContext_ == nullptr) || (!eglDestroyContext(eglDisplay_, eglContext_))) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "Release eglDestroyContext failed"); + } + // Release the display. + if ((eglDisplay_ == nullptr) || (!eglTerminate(eglDisplay_))) { + OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "Release eglTerminate failed"); + } + } + ``` + + (2) Add the **Release()** method to the **PluginRender** class to release the **EGLCore** and **PluginRender** instances. + + ```c++ + void PluginRender::Release(std::string &id) + { + PluginRender *render = PluginRender::GetInstance(id); + if (render != nullptr) { + render->eglCore_->Release(); + delete render->eglCore_; + render->eglCore_ = nullptr; + delete render; + render = nullptr; + instance_.erase(instance_.find(id)); + } + } + ``` + +7. Use the CMake toolchain to compile the C++ source code into a dynamic link library (DLL) file. + + ```CMake + # Set the minimum CMake version. + cmake_minimum_required(VERSION 3.4.1) + # Project name + project(XComponent) + + set(NATIVERENDER_ROOT_PATH ${CMAKE_CURRENT_SOURCE_DIR}) + add_definitions(-DOHOS_PLATFORM) + # Set the header file search directory. + include_directories( + ${NATIVERENDER_ROOT_PATH} + ${NATIVERENDER_ROOT_PATH}/include + ) + # Add the **nativerender** dynamic library, with the **libnativerender.so** library file. Add the .cpp file. + add_library(nativerender SHARED + render/egl_core.cpp + render/plugin_render.cpp + manager/plugin_manager.cpp + napi_init.cpp + ) + + find_library( + EGL-lib + EGL + ) + + find_library( + GLES-lib + GLESv3 + ) + + find_library( + hilog-lib + hilog_ndk.z + ) + + find_library( + libace-lib + ace_ndk.z + ) + + find_library( + libnapi-lib + ace_napi.z + ) + + find_library( + libuv-lib + uv + ) + # Add the library to be linked. + target_link_libraries(nativerender PUBLIC + ${EGL-lib} ${GLES-lib} ${hilog-lib} ${libace-lib} ${libnapi-lib} ${libuv-lib}) + ``` + +## + + + +- diff --git a/en/application-dev/quick-start/Readme-EN.md b/en/application-dev/quick-start/Readme-EN.md index 7e6d0acac8ef49b1d6cb38a294d490c6f9a6144c..1d079b36d7af3cf7682659edc9362e6e802e258b 100644 --- a/en/application-dev/quick-start/Readme-EN.md +++ b/en/application-dev/quick-start/Readme-EN.md @@ -2,7 +2,7 @@ - Getting Started - [Before You Start](start-overview.md) - - [Getting Started with ArkTS in Stage Model](start-with-ets-stage.md) + - [Building the First ArkTS Application in Stage Model](start-with-ets-stage.md) - Development Fundamentals - Application Package Fundamentals - [Application Package Overview](application-package-overview.md) @@ -41,8 +41,8 @@ - [Resource Categories and Access](resource-categories-and-access.md) - Learning ArkTS - [Getting Started with ArkTS](arkts-get-started.md) - - [Introduction to ArkTS](arkts/introduction-to-arkts.md) - - [TypeScript to ArkTS Migration Guide](arkts/typescript-to-arkts-migration-guide.md) + - [Introduction to ArkTS](introduction-to-arkts.md) + - [TypeScript to ArkTS Migration Guide](typescript-to-arkts-migration-guide.md) - UI paradigms - Basic Syntax - [Basic Syntax Overview](arkts-basic-syntax-overview.md) @@ -55,6 +55,7 @@ - [\@Styles Decorator: Definition of Resusable Styles](arkts-style.md) - [\@Extend Decorator: Extension of Built-in Components](arkts-extend.md) - [stateStyles Decorator: Polymorphic Style](arkts-statestyles.md) + - [\@AnimatableExtend Decorator: Definition of Animatable Attributes](arkts-animatable-extend.md) - State Management - [State Management Overview](arkts-state-management-overview.md) - Component State Management diff --git a/en/application-dev/quick-start/module-configuration-file.md b/en/application-dev/quick-start/module-configuration-file.md index 60a0baa6a6046da92101a1dcff891a6ed16d774d..5fe815d3e9df1e60501504dab5b38f3b860e9b93 100644 --- a/en/application-dev/quick-start/module-configuration-file.md +++ b/en/application-dev/quick-start/module-configuration-file.md @@ -93,7 +93,6 @@ As shown above, the **module.json5** file contains several tags. | [dependencies](#dependencies)| List of shared libraries on which the current module depends during running.| Object array| Yes (initial value: left empty) | | targetModuleName | Target module of the bundle. The value is a string with a maximum of 31 bytes. It must be unique in the entire application.|String|Yes (if the initial value is used, the target module is not a module with the overlay feature)| | targetPriority | Priority of the module. When **targetModuleName** is set, the module is a module with the overlay feature. The value ranges from 1 to 100.|Number|Yes (initial value: **1**)| -| [proxyDatas(deprecated)](#proxydatasdeprecated) | This API is deprecated since API version 10. You are advised to use **proxydata** instead. List of data proxies provided by the module.| Object array| Yes (initial value: left empty)| | [proxyData](#proxydata) | List of data proxies provided by the module.| Object array| Yes (initial value: left empty)| | isolationMode | Multi-process configuration of the module. The options are as follows:
- **nonisolationFirst**: The module preferentially runs in a non-independent process.
- **isolationFirst**: The module preferentially runs in an independent process.
- **isolationOnly**: The module runs only in an independent process.
- **nonisolationOnly**: The module runs only in non-independent processes.|String|Yes (initial value: **nonisolationFirst**)| | generateBuildHash |Whether the hash value of the HAP or HSP file is generated by the packaging tool. The hash value (if any) is used to determine whether the application needs to be updated when the system is updated in OTA mode but the **versionCode** value of the application remains unchanged.
This tag is enabled only when the **generateBuildHash** tag in the [app.json5](./app-configuration-file.md) file is **false**.**
**NOTE**
This tag applies only to system applications.**|Boolean|Yes (initial value: **false**)| @@ -421,7 +420,7 @@ Example of the **extensionAbilities** structure: ## requestPermissions -The **requestPermissions** tag represents a set of permissions that the application needs to request from the system for running correctly. +The **requestPermissions** tag represents a set of permissions that the application needs to request from the system for running correctly. For details about how to request permissions, see [Applying for Permissions](../security/accesstoken-guidelines.md). > **NOTE** > @@ -738,40 +737,6 @@ Example of the **dependencies** structure: } ``` -## proxyDatas(deprecated) - ->This API is supported since API version 10 and deprecated since API version 10. You are advised to use [proxyData](#proxydata) instead. - -The **proxyDatas** tag provides the list of data proxies provided by the module. It can be configured only for entry and feature modules. - -**Table 21** proxyDatas -| Name | Description | Data Type| Initial Value Allowed| -| ----------- | ------------------------------ | -------- | ---------- | -| uri | URI of the data proxy. The URIs configured for different data proxies must be unique and must be in the *datashareproxy://Current application package name/xxx* format. | String | No| -| requiredReadPermission | Permission required for reading data from the data proxy. For non-system applications, this field is mandatory, and the permission level must be system_basic or system_core. For system applications, this field is optional, and the permission level is not limited. For details about the permission level, see [Application Permission List](../security/permission-list.md).| String | Yes (initial value: left empty)| -| requiredWritePermission | Permission required for writing data to the data proxy. For non-system applications, this field is mandatory, and the permission level must be system_basic or system_core. For system applications, this field is optional, and the permission level is not limited. For details about the permission level, see [Application Permission List](../security/permission-list.md).| String | Yes (initial value: left empty)| -| [metadata](#metadata)| Metadata of the data proxy. Only the **name** and **resource** fields can be configured.| Object| Yes (initial value: left empty)| - -Example of the **proxyDatas** structure: - -```json -{ - "module": { - "proxyDatas": [ - { - "uri":"datashareproxy://com.ohos.datashare/event/Meeting", - "requiredReadPermission": "ohos.permission.GET_BUNDLE_INFO", - "requiredWritePermission": "ohos.permission.GET_BUNDLE_INFO", - "metadata": { - "name": "datashare_metadata", - "resource": "$profile:datashare" - } - } - ] - } -} -``` - ## proxyData The **proxyDatas** tag provides the list of data proxies provided by the module. It can be configured only for entry and feature modules. @@ -780,8 +745,8 @@ The **proxyDatas** tag provides the list of data proxies provided by the module. | Name | Description | Data Type| Initial Value Allowed| | ----------- | ------------------------------ | -------- | ---------- | | uri | URI of the data proxy. The URIs configured for different data proxies must be unique and must be in the *datashareproxy://Current application package name/xxx* format. | String | No| -| requiredReadPermission | Permission required for reading data from the data proxy. For non-system applications, this field is mandatory, and the permission level must be system_basic or system_core. For system applications, this field is optional, and the permission level is not limited. For details about the permission level, see [Application Permission List](../security/permission-list.md).| String | Yes (initial value: left empty)| -| requiredWritePermission | Permission required for writing data to the data proxy. For non-system applications, this field is mandatory, and the permission level must be system_basic or system_core. For system applications, this field is optional, and the permission level is not limited. For details about the permission level, see [Application Permission List](../security/permission-list.md).| String | Yes (initial value: left empty)| +| requiredReadPermission | Permission required for reading data from the data proxy. If it is not specified, other applications will not be able to use the data proxy. For non-system applications, the level of the set permission must be system_basic or system_core. For system applications, the permission level is not limited. For details about the permission level, see [Application Permission List](../security/permission-list.md).| String | Yes (initial value: left empty)| +| requiredWritePermission | Permission required for writing data to the data proxy. If it is not specified, other applications will not be able to use the data proxy. For non-system applications, the level of the set permission must be system_basic or system_core. For system applications, the permission level is not limited. For details about the permission level, see [Application Permission List](../security/permission-list.md).| String | Yes (initial value: left empty)| | [metadata](#metadata)| Metadata of the data proxy. Only the **name** and **resource** fields can be configured.| Object| Yes (initial value: left empty)| Example of the **proxyData** structure: diff --git a/en/application-dev/quick-start/start-overview.md b/en/application-dev/quick-start/start-overview.md index 2bc53666dce570f5c9c5c9c5a0b8c48e353422d2..df1178706cc93fac75f9f443dcff2627b026b9c8 100644 --- a/en/application-dev/quick-start/start-overview.md +++ b/en/application-dev/quick-start/start-overview.md @@ -44,4 +44,4 @@ To help you better understand the preceding basic concepts and application devel 2. Install DevEco Studio and configure the development environment. For details, see [Setting Up the Development Environment](https://developer.harmonyos.com/en/docs/documentation/doc-guides-V3/environment_config-0000001052902427-V3). -When you are done, follow the instructions in [Getting Started with ArkTS in Stage Model](start-with-ets-stage.md). +When you are done, you can set out to [build your first ArkTS application in the stage model](start-with-ets-stage.md). diff --git a/en/application-dev/quick-start/start-with-ets-stage.md b/en/application-dev/quick-start/start-with-ets-stage.md index ec3ab196bb1d0edb494d2a26be688b4b455a714a..789f4c05e28730d4f2851fc507af6bc4a8af1d9b 100644 --- a/en/application-dev/quick-start/start-with-ets-stage.md +++ b/en/application-dev/quick-start/start-with-ets-stage.md @@ -1,4 +1,4 @@ -# Getting Started with ArkTS in Stage Model +# Building the First ArkTS Application in Stage Model > **NOTE** diff --git a/en/application-dev/reference/apis/js-apis-Bundle.md b/en/application-dev/reference/apis/js-apis-Bundle.md index db930ccbe8cc14f368b9e16d29b556074e981482..63b12c68575f0d3c79b71b3cb7f241c35c7a13c8 100644 --- a/en/application-dev/reference/apis/js-apis-Bundle.md +++ b/en/application-dev/reference/apis/js-apis-Bundle.md @@ -646,7 +646,7 @@ This is a system API. ```ts let bundleName = "com.example.myapplication"; -bundleManager.setApplicationEnabled(bundleName, false).then(()=> { +bundle.setApplicationEnabled(bundleName, false).then(()=> { console.info('setApplicationEnabled successfully.'); }).catch(err=> { console.error('setApplicationEnabled failed.'); @@ -767,7 +767,7 @@ This is a system API. ```ts let permission = "ohos.permission.GET_BUNDLE_INFO"; -bundleManager.getPermissionDef(permission, (err, data) => { +bundle.getPermissionDef(permission, (err, data) => { if (err) { console.error('getPermissionDef failed:' + err.message); } else { diff --git a/en/application-dev/reference/apis/js-apis-bundleManager-businessAbilityInfo.md b/en/application-dev/reference/apis/js-apis-bundleManager-businessAbilityInfo.md index 93d9191f2b7897c387c6ce5160b1e2602befbf70..53d01ef7572136107ddfa5727b613ba100fac495 100644 --- a/en/application-dev/reference/apis/js-apis-bundleManager-businessAbilityInfo.md +++ b/en/application-dev/reference/apis/js-apis-bundleManager-businessAbilityInfo.md @@ -9,7 +9,7 @@ The **BusinessAbilityInfo** module provides basic information about a business a **System API**: This is a system API. -**System capability**: SystemCapability.BundleManager.BundleFramework.Core +**System capability**: SystemCapability.Ability.AbilityRuntime.Core | Name | Type | Readable| Writable| Description | | --------------------------------- | ------------------------------------------------------------ | ---- | ---- | -------------------- | diff --git a/en/application-dev/reference/apis/js-apis-bundleMonitor.md b/en/application-dev/reference/apis/js-apis-bundleMonitor.md index 1b543b547a9e3904b664e0f2826aa761402ad82b..fb0316a68118bfdb75b9b3a95be09aa835e3584a 100644 --- a/en/application-dev/reference/apis/js-apis-bundleMonitor.md +++ b/en/application-dev/reference/apis/js-apis-bundleMonitor.md @@ -61,7 +61,7 @@ Subscribes to bundle installation, uninstall, and update events. | Name | Type | Mandatory| Description | | ---------------------------- | -------- | ---- | ------------------ | -| type| [BundleChangedEvent](js-apis-bundleMonitor.md#BundleChangedEvent)| Yes | Type of the event to subscribe to.| +| type| [BundleChangedEvent](js-apis-bundleMonitor.md#bundlechangedevent)| Yes | Type of the event to subscribe to.| | callback | callback\| Yes | Callback used for the subscription.| **Example** @@ -94,7 +94,7 @@ Unsubscribes from bundle installation, uninstall, and update events. | Name | Type | Mandatory| Description | | ---------------------------- | -------- | ---- | ---------------------------------------------------------- | -| type| [BundleChangedEvent](js-apis-bundleMonitor.md#BundleChangedEvent)| Yes | Type of the event to unsubscribe from. | +| type| [BundleChangedEvent](js-apis-bundleMonitor.md#bundlechangedevent)| Yes | Type of the event to unsubscribe from. | | callback | callback\| No | Callback used for the unsubscription. By default, no value is passed, and all callbacks of the current event are unsubscribed from.| **Example** diff --git a/en/application-dev/reference/apis/js-apis-distributedBundleManager.md b/en/application-dev/reference/apis/js-apis-distributedBundleManager.md index 71e153396ecfc529530cf2e9fae3869bd398a0fa..8543fd943e44f8e3927562a10d54f602db9da39a 100644 --- a/en/application-dev/reference/apis/js-apis-distributedBundleManager.md +++ b/en/application-dev/reference/apis/js-apis-distributedBundleManager.md @@ -22,7 +22,7 @@ SystemCapability.BundleManager.DistributedBundleFramework | Permission | Permission Level | Description | | ------------------------------------------ | ------------ | ------------------ | -| ohos.permission.GET_BUNDLE_INFO_PRIVILEGED | system_basic | Permission to query information about all bundles.| +| ohos.permission.GET_BUNDLE_INFO_PRIVILEGED | system_basic | Permission to obtain basic information and other sensitive information about a bundle.| For details, see [Permission Levels](../../security/accesstoken-overview.md#permission-levels). diff --git a/en/application-dev/reference/apis/js-apis-image.md b/en/application-dev/reference/apis/js-apis-image.md index a098cef0c801348beeb9a0b43dfecfb19232e8e4..24c8730727b438c9efd3bfd4244fa55a5a605add 100644 --- a/en/application-dev/reference/apis/js-apis-image.md +++ b/en/application-dev/reference/apis/js-apis-image.md @@ -926,6 +926,115 @@ async function Demo() { } ``` +### marshalling10+ + +marshalling(sequence: rpc.MessageSequence): void + +Marshals this **PixelMap** object and writes it to a **MessageSequence** object. + +**System capability**: SystemCapability.Multimedia.Image.Core + +**Parameters** + +| Name | Type | Mandatory| Description | +| ---------------------- | ------------------------------------------------------ | ---- | ---------------------------------------- | +| sequence | [rpc.MessageSequence](js-apis-rpc.md#messagesequence9) | Yes | **MessageSequence** object. | + +**Error codes** + +For details about the error codes, see [ResponseCode](#responsecode). + +| ID| Error Message| +| ------- | --------------------------------------------| +| 62980115 | If the input parameter invalid | +| 62980097 | If the ipc error | + +**Example** + +```js +import image from '@ohos.multimedia.image' +import rpc from '@ohos.rpc' +class MySequence { + pixel_map; + constructor(pixelmap) { + this.pixel_map = pixelmap; + } + marshalling(messageSequence) { + this.pixel_map.marshalling(messageSequence); + return true; + } + async unmarshalling(messageSequence) { + await image.unmarshalling(messageSequence).then(async (pixelMap) => { + this.pixel_map = pixelMap; + }) + return true; + } +} +async function Demo() { + let parcelable = new MySequence(pixelmap); + let data = rpc.MessageSequence.create(); + data.writeParcelable(parcelable); +} +``` + +### unmarshalling10+ + +unmarshalling(sequence: rpc.MessageSequence): Promise\ + +Unmarshals a **MessageSequence** object to obtain a **PixelMap** object. + +**System capability**: SystemCapability.Multimedia.Image.Core + +**Parameters** + +| Name | Type | Mandatory| Description | +| ---------------------- | ----------------------------------------------------- | ---- | ---------------------------------------- | +| sequence | [rpc.MessageSequence](js-apis-rpc.md#messagesequence9) | Yes | **MessageSequence** object that stores the **PixelMap** information. | + +**Return value** + +| Type | Description | +| -------------------------------- | --------------------- | +| Promise\<[PixelMap](#pixelmap7)> | Promise used to return the **PixelMap** object.| + +**Error codes** + +For details about the error codes, see [ResponseCode](#responsecode). + +| ID| Error Message| +| ------- | --------------------------------------------| +| 62980115 | If the input parameter invalid | +| 62980097 | If the ipc error | + +**Example** + +```js +import image from '@ohos.multimedia.image' +import rpc from '@ohos.rpc' +class MySequence { + pixel_map; + constructor(pixelmap) { + this.pixel_map = pixelmap; + } + marshalling(messageSequence) { + this.pixel_map.marshalling(messageSequence); + return true; + } + async unmarshalling(messageSequence) { + await image.unmarshalling(messageSequence).then(async (pixelMap) => { + this.pixel_map = pixelMap; + }) + return true; + } +} +async function Demo() { + let pixel_map = undefined; + let ret = new MySequence(pixel_map); + let data = rpc.MessageSequence.create(); + await data.readParcelable(ret); +} +``` + ### release7+ release():Promise\ @@ -1590,7 +1699,7 @@ Creates an array of **PixelMap** objects based on image decoding parameters. Thi | Type | Description | | -------------------------------- | --------------------- | -| Promise> | Promise used to return an array of **PixeMap** objects.| +| Promise> | Promise used to return an array of **PixelMap** objects.| **Example** @@ -1618,7 +1727,7 @@ Creates an array of **PixelMap** objects based on the default parameters. This A | Name | Type | Mandatory| Description | | -------- | ------------------------------------- | ---- | -------------------------- | -| callback | AsyncCallback> | Yes | Callback used to return an array of **PixeMap** objects.| +| callback | AsyncCallback> | Yes | Callback used to return an array of **PixelMap** objects.| **Example** @@ -1641,7 +1750,7 @@ Creates an array of **PixelMap** objects based on image decoding parameters. Thi | Name | Type | Mandatory| Description | | -------- | -------------------- | ---- | ---------------------------------- | | options | [DecodingOptions](#decodingoptions7) | Yes| Image decoding parameters.| -| callback | AsyncCallback> | Yes | Callback used to return an array of **PixeMap** objects.| +| callback | AsyncCallback> | Yes | Callback used to return an array of **PixelMap** objects.| **Example** @@ -2795,7 +2904,29 @@ Describes the exchangeable image file format (EXIF) data of an image. | SCENE_TYPE9+ | "SceneType" | Shooting scene type, for example, portrait, scenery, motion, and night. | | ISO_SPEED_RATINGS9+ | "ISOSpeedRatings" | ISO sensitivity or ISO speed, for example, 400. | | F_NUMBER9+ | "FNumber" | Aperture, for example, f/1.8. | - +| DATE_TIME10+ | "DateTime" | Date and time. | +| GPS_TIME_STAMP10+ | "GPSTimeStamp" | GPS timestamp. | +| GPS_DATE_STAMP10+ | "GPSDateStamp" | GPS date stamp. | +| IMAGE_DESCRIPTION10+ | "ImageDescription" | Image description. | +| MAKE10+ | "Make" | Vendor. | +| PHOTO_MODE10+ | "PhotoMode " | Photo mode. | +| SENSITIVITY_TYPE10+ | "SensitivityType" | Sensitivity type. | +| STANDARD_OUTPUT_SENSITIVITY10+ | "StandardOutputSensitivity" | Standard output sensitivity. | +| RECOMMENDED_EXPOSURE_INDEX10+ | "RecommendedExposureIndex" | Recommended exposure index. | +| ISO_SPEED10+ | "ISOSpeedRatings" | ISO speed. | +| APERTURE_VALUE10+ | "ApertureValue" | Aperture value. | +| EXPOSURE_BIAS_VALUE10+ | "ExposureBiasValue" | Exposure bias value. | +| METERING_MODE10+ | "MeteringMode" | Metering mode. | +| LIGHT_SOURCE10+ | "LightSource" | Light source. | +| FLASH 10+ | "Flash" | Flash status. | +| FOCAL_LENGTH 10+ | "FocalLength" | Focal length. | +| USER_COMMENT 10+ | "UserComment" | User comment. | +| PIXEL_X_DIMENSION 10+ | "PixelXDimension" | Pixel X dimension. | +| PIXEL_Y_DIMENSION10+ | "PixelYDimension" | Pixel Y dimension. | +| WHITE_BALANCE 10+ | "WhiteBalance" | White balance. | +| FOCAL_LENGTH_IN_35_MM_FILM 10+ | "FocalLengthIn35mmFilm" | Focal length in 35mm film. | +| CAPTURE_MODE 10+ | "HwMnoteCaptureMode" | Capture mode. | +| PHYSICAL_APERTURE 10+ | "HwMnotePhysicalAperture" | Physical aperture. | ## ImageFormat9+ diff --git a/en/application-dev/reference/apis/js-apis-sms.md b/en/application-dev/reference/apis/js-apis-sms.md index e428eaa609d028073417c7759d3b0c645e5f80a7..41a3fe10bbda7d00fc5aa588ed75072a702971bb 100644 --- a/en/application-dev/reference/apis/js-apis-sms.md +++ b/en/application-dev/reference/apis/js-apis-sms.md @@ -135,10 +135,10 @@ For details about the following error codes, see [Telephony Error Codes](../../r **Example** ```js -let sendCallback = function (err, data) { +let sendCallback = function (err, data) { console.log(`sendCallback: err->${JSON.stringify(err)}, data->${JSON.stringify(data)}`); } -let deliveryCallback = function (err, data) { +let deliveryCallback = function (err, data) { console.log(`deliveryCallback: err->${JSON.stringify(err)}, data->${JSON.stringify(data)}`); } let slotId = 0; diff --git a/en/application-dev/reference/apis/js-apis-util.md b/en/application-dev/reference/apis/js-apis-util.md index 940b37ae2ad177ae64adaa6caeef0884f4dd2c8f..4e7b2b7b5914f06bc73dea8b88e2ff46b77c3b31 100755 --- a/en/application-dev/reference/apis/js-apis-util.md +++ b/en/application-dev/reference/apis/js-apis-util.md @@ -2080,7 +2080,7 @@ let result = that.encodeSync(array); ### encodeToStringSync9+ -encodeToStringSync(src: Uint8Array): string +encodeToStringSync(src: Uint8Array, options?: Type): string Encodes the input content. @@ -2091,6 +2091,7 @@ Encodes the input content. | Name| Type | Mandatory| Description | | ------ | ---------- | ---- | ------------------- | | src | Uint8Array | Yes | Uint8Array to encode.| +| options10+ | [Type](#type10) | No | Encoding format.
The following values are available:
- **util.Type.BASIC** (default value): The output can contain 64 printable characters, which are the uppercase letters (A-Z), lowercase letters (a-z), digits (0-9), and the special characters plus sign (+) and slash (/). There is no carriage return or line feed character.
- **util.Type.MIME**: The output can contain 64 printable characters, which are the uppercase letters (A-Z), lowercase letters (a-z), digits (0-9), and the special characters plus sign (+) and slash (/). Each line of the output contains a maximum of 76 characters, ended with '\r\n'.| **Return value** @@ -2102,14 +2103,14 @@ Encodes the input content. ```js let that = new util.Base64Helper(); -let array = new Uint8Array([115,49,51]); -let result = that.encodeToStringSync(array); +let array = new Uint8Array([77,97,110,105,115,100,105,115,116,105,110,103,117,105,115,104,101,100,110,111,116,111,110,108,121,98,121,104,105,115,114,101,97,115,111,110,98,117,116,98,121,116,104,105,115,115,105,110,103,117,108,97,114,112,97,115,115,105,111,110,102,114,111,109,111,116,104,101,114,97,110,105,109,97,108,115,119,104,105,99,104,105,115,97,108,117,115,116,111,102,116,104,101,109,105,110,100,101,120,99,101,101,100,115,116,104,101,115,104,111,114,116,118,101,104,101,109,101,110,99,101,111,102,97,110,121,99,97,114,110,97,108,112,108,101,97,115,117,114,101]); +let result = that.encodeToStringSync(array, util.Type.MIME); ``` ### decodeSync9+ -decodeSync(src: Uint8Array | string): Uint8Array +decodeSync(src: Uint8Array | string, options?: Type): Uint8Array Decodes the input content. @@ -2120,6 +2121,7 @@ Decodes the input content. | Name| Type | Mandatory| Description | | ------ | ------------------------------ | ---- | ----------------------------- | | src | Uint8Array \| string | Yes | Uint8Array or string to decode.| +| options10+ | [Type](#type10) | No | Encoding format.
The following values are available:
- **util.Type.BASIC** (default value): The input can contain 64 printable characters, which are the uppercase letters (A-Z), lowercase letters (a-z), digits (0-9), and the special characters plus sign (+) and slash (/). There is no carriage return or line feed character.
- **util.Type.MIME**: The input can contain 64 printable characters, which are the uppercase letters (A-Z), lowercase letters (a-z), digits (0-9), and the special characters plus sign (+) and slash (/). Each line of the input contains a maximum of 76 characters, ended with '\r\n'.| **Return value** @@ -2131,8 +2133,8 @@ Decodes the input content. ```js let that = new util.Base64Helper(); -let buff = 'czEz'; -let result = that.decodeSync(buff); +let buff = 'TWFuaXNkaXN0aW5ndWlzaGVkbm90b25seWJ5aGlzcmVhc29uYnV0Ynl0aGlzc2luZ3VsYXJwYXNz\r\naW9uZnJvbW90aGVyYW5pbWFsc3doaWNoaXNhbHVzdG9mdGhlbWluZGV4Y2VlZHN0aGVzaG9ydHZl\r\naGVtZW5jZW9mYW55Y2FybmFscGxlYXN1cmU=\r\n'; +let result = that.decodeSync(buff, util.Type.MIME); ``` @@ -2172,7 +2174,7 @@ that.encode(array).then(val=>{ ### encodeToString9+ -encodeToString(src: Uint8Array): Promise<string> +encodeToString(src: Uint8Array, options?: Type): Promise<string> Encodes the input content asynchronously. @@ -2183,6 +2185,7 @@ Encodes the input content asynchronously. | Name| Type | Mandatory| Description | | ------ | ---------- | ---- | ----------------------- | | src | Uint8Array | Yes | Uint8Array to encode asynchronously.| +| options10+ | [Type](#type10) | No | Encoding format.
The following values are available:
- **util.Type.BASIC** (default value): The output can contain 64 printable characters, which are the uppercase letters (A-Z), lowercase letters (a-z), digits (0-9), and the special characters plus sign (+) and slash (/). There is no carriage return or line feed character.
- **util.Type.MIME**: The output can contain 64 printable characters, which are the uppercase letters (A-Z), lowercase letters (a-z), digits (0-9), and the special characters plus sign (+) and slash (/). Each line of the output contains a maximum of 76 characters, ended with '\r\n'.| **Return value** @@ -2194,16 +2197,16 @@ Encodes the input content asynchronously. ```js let that = new util.Base64Helper(); -let array = new Uint8Array([115,49,51]); -that.encodeToString(array).then(val=>{ - console.log(val) +let array = new Uint8Array([77,97,110,105,115,100,105,115,116,105,110,103,117,105,115,104,101,100,110,111,116,111,110,108,121,98,121,104,105,115,114,101,97,115,111,110,98,117,116,98,121,116,104,105,115,115,105,110,103,117,108,97,114,112,97,115,115,105,111,110,102,114,111,109,111,116,104,101,114,97,110,105,109,97,108,115,119,104,105,99,104,105,115,97,108,117,115,116,111,102,116,104,101,109,105,110,100,101,120,99,101,101,100,115,116,104,101,115,104,111,114,116,118,101,104,101,109,101,110,99,101,111,102,97,110,121,99,97,114,110,97,108,112,108,101,97,115,117,114,101]); +that.encodeToString(array, util.Type.MIME).then(val=>{ + // Add information as required. }) ``` ### decode9+ -decode(src: Uint8Array | string): Promise<Uint8Array> +decode(src: Uint8Array | string, options?: Type): Promise<Uint8Array> Decodes the input content asynchronously. @@ -2214,6 +2217,7 @@ Decodes the input content asynchronously. | Name| Type | Mandatory| Description | | ------ | ------------------------------ | ---- | --------------------------------- | | src | Uint8Array \| string | Yes | Uint8Array or string to decode asynchronously.| +| options10+ | [Type](#type10) | No | Encoding format.
The following values are available:
- **util.Type.BASIC** (default value): The input can contain 64 printable characters, which are the uppercase letters (A-Z), lowercase letters (a-z), digits (0-9), and the special characters plus sign (+) and slash (/). There is no carriage return or line feed character.
- **util.Type.MIME**: The input can contain 64 printable characters, which are the uppercase letters (A-Z), lowercase letters (a-z), digits (0-9), and the special characters plus sign (+) and slash (/). Each line of the input contains a maximum of 76 characters, ended with '\r\n'.| **Return value** @@ -2225,15 +2229,25 @@ Decodes the input content asynchronously. ```js let that = new util.Base64Helper(); -let array = new Uint8Array([99,122,69,122]); -let rarray = new Uint8Array([115,49,51]); -that.decode(array).then(val=>{ - for (var i = 0; i < rarray.length; i++) { - console.log(val[i].toString()) - } +let array = 'TWFuaXNkaXN0aW5ndWlzaGVkbm90b25seWJ5aGlzcmVhc29uYnV0Ynl0aGlzc2luZ3VsYXJwYXNz\r\naW9uZnJvbW90aGVyYW5pbWFsc3doaWNoaXNhbHVzdG9mdGhlbWluZGV4Y2VlZHN0aGVzaG9ydHZl\r\naGVtZW5jZW9mYW55Y2FybmFscGxlYXN1cmU=\r\n'; +that.decode(array, util.Type.MIME).then(val=>{ + // Add information as required. }) ``` + +## Type10+ + +Enumerates the Base64 encoding formats. + +**System capability**: SystemCapability.Utils.Lang + +| Name | Value | Description | +| -------- | ------------------------ | ---------------- | +| BASIC | 0 | Basic format.| +| MIME | 1 | MIME format.| + + ## types8+ Provides APIs to check different types of built-in objects, such as ArrayBuffer, Map, and Set, so as to avoid exceptions or crashes caused by type errors. diff --git a/en/application-dev/reference/apis/js-apis-window.md b/en/application-dev/reference/apis/js-apis-window.md index 83ba617046bba8de2547b82015dbfee8ce9be0a7..9ac2bab02f8bf52a52e25091e1779ef255b68204 100644 --- a/en/application-dev/reference/apis/js-apis-window.md +++ b/en/application-dev/reference/apis/js-apis-window.md @@ -859,6 +859,15 @@ Subscribes to the gesture navigation status change event. | type | string | Yes | Event type. The value is fixed at **'gestureNavigationEnabledChange'**, indicating the gesture navigation status change event. | | callback | Callback<boolean> | Yes | Callback used to return the gesture navigation status. The value **true** means that the gesture navigation status is changed to enabled, and **false** means that the gesture navigation status is changed to disabled.| +**Error codes** + +For details about the error codes, see [Window Error Codes](../errorcodes/errorcode-window.md). + +| ID| Error Message| +| ------- | -------------------------------------------- | +| 1300002 | This window state is abnormal. | +| 1300003 | This window manager service works abnormally. | + **Example** ```js @@ -888,6 +897,15 @@ Unsubscribes from the gesture navigation status change event. | type | string | Yes| Event type. The value is fixed at **'gestureNavigationEnabledChange'**, indicating the gesture navigation status change event.| | callback | Callback<boolean> | No| Callback function that has been used for registering the listener. If a value is passed in, the corresponding subscription is canceled. If no value is passed in, all subscriptions to the specified event are canceled.| +**Error codes** + +For details about the error codes, see [Window Error Codes](../errorcodes/errorcode-window.md). + +| ID| Error Message| +| ------- | -------------------------------------------- | +| 1300002 | This window state is abnormal. | +| 1300003 | This window manager service works abnormally. | + **Example** ```js @@ -2744,7 +2762,7 @@ try { ### on('avoidAreaChange')9+ -on(type: 'avoidAreaChange', callback: Callback<{AvoidAreaType, AvoidArea}>): void +on(type: 'avoidAreaChange', callback: Callback<{ type: AvoidAreaType, area: AvoidArea}>): void Subscribes to the event indicating changes to the area where the window cannot be displayed. @@ -2755,7 +2773,7 @@ Subscribes to the event indicating changes to the area where the window cannot b | Name | Type | Mandatory| Description | | -------- |------------------------------------------------------------------| ---- |--------------------------------------| | type | string | Yes | Event type. The value is fixed at **'avoidAreaChange'**, indicating the event of changes to the area where the window cannot be displayed.| -| callback | Callback<{[AvoidAreaType](#avoidareatype7), [AvoidArea](#avoidarea7)}> | Yes | Callback used to return the area and area type.| +| callback | Callback<{ type: [AvoidAreaType](#avoidareatype7), area: [AvoidArea](#avoidarea7) }> | Yes | Callback used to return the area and area type.| **Example** @@ -2772,7 +2790,7 @@ try { ### off('avoidAreaChange')9+ -off(type: 'avoidAreaChange', callback?: Callback<{AvoidAreaType, AvoidArea}>): void +off(type: 'avoidAreaChange', callback?: Callback<{ type: AvoidAreaType, area: AvoidArea }>): void Unsubscribes from the event indicating changes to the area where the window cannot be displayed. @@ -2783,7 +2801,7 @@ Unsubscribes from the event indicating changes to the area where the window cann | Name | Type | Mandatory | Description | | -------- |-----------------------------------------------------------------------------|-----|------------------------------------| | type | string | Yes | Event type. The value is fixed at **'avoidAreaChange'**, indicating the event of changes to the area where the window cannot be displayed.| -| callback | Callback<{[AvoidAreaType](#avoidareatype7), [AvoidArea](#avoidarea7)}> | No | Callback used to return the area and area type. If a value is passed in, the corresponding subscription is canceled. If no value is passed in, all subscriptions to the specified event are canceled.| +| callback | Callback<{ type: [AvoidAreaType](#avoidareatype7), area: [AvoidArea](#avoidarea7) }> | No | Callback used to return the area and area type. If a value is passed in, the corresponding subscription is canceled. If no value is passed in, all subscriptions to the specified event are canceled.| **Example** @@ -3122,7 +3140,16 @@ class TestRemoteObject extends rpc.RemoteObject { } let token = new TestRemoteObject('testObject'); +let windowClass = null; +let config = {name: "dialogWindow", windowType: window.WindowType.TYPE_DIALOG, ctx: this.context}; try { + window.createWindow(config, (err, data) => { + if (err.code) { + console.error('Failed to create the window. Cause: ' + JSON.stringify(err)); + return; + } + windowClass = data; + }); windowClass.bindDialogTarget(token, () => { console.info('Dialog Window Need Destroy.'); }, (err) => { @@ -3195,7 +3222,16 @@ class TestRemoteObject extends rpc.RemoteObject { } let token = new TestRemoteObject('testObject'); +let windowClass = null; +let config = {name: "dialogWindow", windowType: window.WindowType.TYPE_DIALOG, ctx: this.context}; try { + window.createWindow(config, (err, data) => { + if (err.code) { + console.error('Failed to create the window. Cause: ' + JSON.stringify(err)); + return; + } + windowClass = data; + }); let promise = windowClass.bindDialogTarget(token, () => { console.info('Dialog Window Need Destroy.'); }); @@ -3246,7 +3282,16 @@ import window from '@ohos.window'; export default class ServiceExtAbility extends ServiceExtensionAbility { onRequest(want, startId) { console.info('onRequest'); + let windowClass = null; + let config = {name: "dialogWindow", windowType: window.WindowType.TYPE_DIALOG, ctx: this.context}; try { + window.createWindow(config, (err, data) => { + if (err.code) { + console.error('Failed to create the window. Cause: ' + JSON.stringify(err)); + return; + } + windowClass = data; + }); let requestInfo = dialogRequest.getRequestInfo(want) windowClass.bindDialogTarget(requestInfo, () => { console.info('Dialog Window Need Destroy.'); @@ -3258,7 +3303,7 @@ export default class ServiceExtAbility extends ServiceExtensionAbility { console.info('Succeeded in binding dialog target.'); }); } catch(err) { - console.error('getRequestInfo err = ' + JSON.stringify(err)) + console.error('Failed to bind dialog target. Cause:' + JSON.stringify(err)) } } } @@ -3306,7 +3351,16 @@ import window from '@ohos.window'; export default class ServiceExtAbility extends ServiceExtensionAbility { onRequest(want, startId) { console.info('onRequest'); + let windowClass = null; + let config = {name: "dialogWindow", windowType: window.WindowType.TYPE_DIALOG, ctx: this.context}; try { + window.createWindow(config, (err, data) => { + if (err.code) { + console.error('Failed to create the window. Cause: ' + JSON.stringify(err)); + return; + } + windowClass = data; + }); let requestInfo = dialogRequest.getRequestInfo(want) let promise = windowClass.bindDialogTarget(requestInfo, () => { console.info('Dialog Window Need Destroy.'); @@ -3317,7 +3371,7 @@ export default class ServiceExtAbility extends ServiceExtensionAbility { console.error('Failed to bind dialog target. Cause:' + JSON.stringify(err)); }); } catch(err) { - console.error('getRequestInfo err = ' + JSON.stringify(err)) + console.error('Failed to bind dialog target. Cause:' + JSON.stringify(err)) } } } diff --git a/en/application-dev/reference/apis/js-apis-zlib.md b/en/application-dev/reference/apis/js-apis-zlib.md index c1cd550641f09914fe47fafba4a38b84a03513c0..5825347718827b430b434c8cb7a41c8f3b1c4bc8 100644 --- a/en/application-dev/reference/apis/js-apis-zlib.md +++ b/en/application-dev/reference/apis/js-apis-zlib.md @@ -244,7 +244,7 @@ Decompresses a file. This API uses an asynchronous callback to return the result For details about the error codes, see [zlib Error Codes](../errorcodes/errorcode-zlib.md). -| ID| Error Message +| ID| Error Message | | -------- | --------------------------------------| | 900001 | The input source file is invalid. | | 900002 | The input destination file is invalid. | diff --git a/en/application-dev/reference/arkui-ts/Readme-EN.md b/en/application-dev/reference/arkui-ts/Readme-EN.md index e0820748c9835894107fc01fa549602fca25a9b5..dc797984418a04ea512fedca19380592545a3bea 100644 --- a/en/application-dev/reference/arkui-ts/Readme-EN.md +++ b/en/application-dev/reference/arkui-ts/Readme-EN.md @@ -164,8 +164,8 @@ - Advanced Components - [@ohos.multimedia.avCastPicker (AVCastPicker)](ohos-multimedia-avcastpicker.md) - Animation - - [AnimatorProperty](ts-animatorproperty.md) - - [Explicit Animatio](ts-explicit-animation.md) + - [Property Animation](ts-animatorproperty.md) + - [Explicit Animation](ts-explicit-animation.md) - Transition Animation - [Page Transition](ts-page-transition-animation.md) - [Component Transition](ts-transition-animation-component.md) diff --git a/en/application-dev/reference/arkui-ts/figures/NestedScroll2.gif b/en/application-dev/reference/arkui-ts/figures/NestedScroll2.gif new file mode 100644 index 0000000000000000000000000000000000000000..fafe05c79f9a23c1e5f3bc3e5a8aa0a43b01648a Binary files /dev/null and b/en/application-dev/reference/arkui-ts/figures/NestedScroll2.gif differ diff --git a/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001174104386.gif b/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001174104386.gif new file mode 100644 index 0000000000000000000000000000000000000000..07e9d4b49ff85d3a137818b5dc6cafcf6b00640c Binary files /dev/null and b/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001174104386.gif differ diff --git a/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001174422896.gif b/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001174422896.gif new file mode 100644 index 0000000000000000000000000000000000000000..65dce0858d00df7ce62b578ce8de8b3f153d006e Binary files /dev/null and b/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001174422896.gif differ diff --git a/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001219982726.png b/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001219982726.png new file mode 100644 index 0000000000000000000000000000000000000000..5cd212a78358d5443699725e6a963514768cb9e6 Binary files /dev/null and b/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001219982726.png differ diff --git a/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001256978363.gif b/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001256978363.gif deleted file mode 100644 index fa6a5f8e639b2b8b73bdae505da6b67800c5eb63..0000000000000000000000000000000000000000 Binary files a/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001256978363.gif and /dev/null differ diff --git a/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001256978381.gif b/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001256978381.gif deleted file mode 100644 index 1cd6ff13714a55e253e9649c007080b47f02f791..0000000000000000000000000000000000000000 Binary files a/en/application-dev/reference/arkui-ts/figures/en-us_image_0000001256978381.gif and /dev/null differ diff --git a/en/application-dev/reference/arkui-ts/figures/gridDrag.png b/en/application-dev/reference/arkui-ts/figures/gridDrag.png new file mode 100644 index 0000000000000000000000000000000000000000..ab2755200c7ec3877b929c9182256f22b0cc5138 Binary files /dev/null and b/en/application-dev/reference/arkui-ts/figures/gridDrag.png differ diff --git a/en/application-dev/reference/arkui-ts/figures/gridDrag1.png b/en/application-dev/reference/arkui-ts/figures/gridDrag1.png new file mode 100644 index 0000000000000000000000000000000000000000..721ec8950cc43af81afefdcd22afb14f50dfdb0e Binary files /dev/null and b/en/application-dev/reference/arkui-ts/figures/gridDrag1.png differ diff --git a/en/application-dev/reference/arkui-ts/figures/gridDrag2.png b/en/application-dev/reference/arkui-ts/figures/gridDrag2.png new file mode 100644 index 0000000000000000000000000000000000000000..5fbb5f43fbb38a3b10d6455abec94bef4c5f98aa Binary files /dev/null and b/en/application-dev/reference/arkui-ts/figures/gridDrag2.png differ diff --git a/en/application-dev/reference/arkui-ts/figures/list4.gif b/en/application-dev/reference/arkui-ts/figures/list4.gif new file mode 100644 index 0000000000000000000000000000000000000000..d28ffc0be07801b3b8a3050cab0b5c95f6ffda01 Binary files /dev/null and b/en/application-dev/reference/arkui-ts/figures/list4.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 00095beb0f5a5739de8a9ab62da63a1807e475c5..ddc44429c9b5c501af18ace6b65806d776df2942 100644 --- a/en/application-dev/reference/arkui-ts/ts-animatorproperty.md +++ b/en/application-dev/reference/arkui-ts/ts-animatorproperty.md @@ -1,12 +1,12 @@ -# Property Animator +# Property Animation -You can create a property animator to animate certain universal attributes of a component, including **width**, **height**, **backgroundColor**, **opacity**, **scale**, **rotate**, and **translate**. +You can animate certain properties of a component, including **width**, **height**, **backgroundColor**, **opacity**, **scale**, **rotate**, and **translate**. > **NOTE** > > This event is supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version. -animation(value: {duration?: number, tempo?: number, curve?: string | Curve | ICurve, delay?:number, iterations: number, playMode?: PlayMode, onFinish?: () => void}) +animation(value: {duration?: number, tempo?: number, curve?: string | Curve | ICurve, delay?:number, iterations?: number, playMode?: PlayMode, onFinish?: () => void}) Since API version 9, this API is supported in ArkTS widgets. 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 e3681f6afdac7edc34bed701c1905c30857480d8..1c145a93206ecf99984346c0833750bda113d5cf 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 @@ -44,16 +44,16 @@ Since API version 9, this API is supported in ArkTS widgets. In addition to the [universal attributes](ts-universal-attributes-size.md), the following attributes are supported. -| Name | Type| Mandatory| Description| -| ------------- | ------- | ---- | -------- | -| closeEffect | boolean | Yes| Whether to disable the rotation and shadow effects for the component.
Default value: **false**
**NOTE**
This attribute enables or disables the shadow effect only when **trackShadow** is not set.
The shadow effect enabled through this attribute is in the default style.| -| valueColors10+ | Array<[ResourceColor](ts-types.md#resourcecolor) \| [LinearGradient](#lineargradient10)> | Yes| Array of data segment colors. A value of the **ResourceColor** type indicates a solid color, and A value of the **LinearGradient** type indicates a color gradient.| -| trackBackgroundColor10+ | [ResourceColor](ts-types.md#resourcecolor) | Yes| Background color.
The value is in hexadecimal ARGB notation. The first two digits indicate opacity.
Default value: **'#08182431'**| -| strokeWidth10+ | [Length](ts-types.md#Length) | Yes| Stroke width of the border.
Default value: **24**
Unit: vp
**NOTE**
A value less than 0 evaluates to the default value.
This attribute does not take effect when the data panel type is **DataPanelType.Line**.| -| trackShadow10+ | [DataPanelShadowOption](#datapanelshadowoption10) | Yes| Shadow style.
**NOTE**
If this attribute is set to **null**, the shadow effect is disabled.| +| Name | Type| Description| +| ------------- | ------- | -------- | +| closeEffect | boolean | Whether to disable the rotation and shadow effects for the component.
Default value: **false**
**NOTE**
This attribute enables or disables the shadow effect only when **trackShadow** is not set.
The shadow effect enabled through this attribute is in the default style.| +| valueColors10+ | Array<[ResourceColor](ts-types.md#resourcecolor) \| [LinearGradient](#lineargradient10)> | Array of data segment colors. A value of the **ResourceColor** type indicates a solid color, and A value of the **LinearGradient** type indicates a color gradient.| +| trackBackgroundColor10+ | [ResourceColor](ts-types.md#resourcecolor) | Background color.
The value is in hexadecimal ARGB notation. The first two digits indicate opacity.
Default value: **'#08182431'**| +| strokeWidth10+ | [Length](ts-types.md#Length) | Stroke width of the border.
Default value: **24**
Unit: vp
**NOTE**
A value less than 0 evaluates to the default value.
This attribute does not take effect when the data panel type is **DataPanelType.Line**.| +| trackShadow10+ | [DataPanelShadowOptions](#datapanelshadowoptions10) | Shadow style.
**NOTE**
If this attribute is set to **null**, the shadow effect is disabled.| -## DataPanelShadowOption10+ +## DataPanelShadowOptions10+ | Name | Type| Mandatory| Description| | ------------- | ------- | ---- | -------- | | radius | number \| [Resource](ts-types.md#resource)| No| Shadow blur radius.
Default value: **5**
Unit: vp
**NOTE**
A value less than or equal to 0 evaluates to the default value.| diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-imagespan.md b/en/application-dev/reference/arkui-ts/ts-basic-components-imagespan.md index db8fbb1fa0a3e809409aa4afba07eb7696fc539c..9cfb2b31661b0ed834c68aeff4acce07ae0166c0 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-components-imagespan.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-components-imagespan.md @@ -25,11 +25,11 @@ ImageSpan(value: ResourceStr | PixelMap) ## Attributes -Among all the [universal events](ts-universal-attributes-size.md), only **width**, **height**, and **size** are supported. +The [universal attribute](ts-universal-attributes-size.md) methods can be used to set the size, background, and border. | Name| Type| Description| | -------- | -------- | -------- | -| verticalAlign | [ImageSpanAlignment](#imagespanalignment) | Alignment mode of the image with the text.| +| verticalAlign | [ImageSpanAlignment](#imagespanalignment) | Alignment mode of the image with the text.
Default value: **ImageSpanAlignment.BOTTOM**| | objectFit | [ImageFit](ts-appendix-enums.md#imagefit) | Image scale type.
Default value: **ImageFit.Cover**| ## ImageSpanAlignment @@ -57,7 +57,7 @@ struct SpanExample { Text() { Span('This is the Span and ImageSpan component').fontSize(25).textCase(TextCase.Normal) .decoration({ type: TextDecorationType.None, color: Color.Pink }) - }.width('100%') + }.width('100%').textAlign(TextAlign.Center) Text() { ImageSpan($r('app.media.icon')) .width('200px') @@ -85,7 +85,6 @@ struct SpanExample { .decoration({ type: TextDecorationType.Underline, color: Color.Red }).fontSize(50) } .width('100%') - .backgroundColor(Color.Orange) .textIndent(50) }.width('100%').height('100%').padding({ left: 0, right: 0, top: 0 }) } diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-marquee.md b/en/application-dev/reference/arkui-ts/ts-basic-components-marquee.md index e14c0aee93857ea01cdec4f6e2843b273de28e97..c8b19032cf4bc784fa8159692f076b2d5ddf5a75 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-components-marquee.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-components-marquee.md @@ -30,7 +30,7 @@ Since API version 9, this API is supported in ArkTS widgets. | src | string | Yes| Text to scroll.| ## Attributes - +In addition to the universal text attributes **fontColor**, **fontSize**, **fontWeight**, and **fontFamily**, the following attributes are supported. | Name | Type| Description | | ---------- | -------- | ------------------------------------------------------------ | | allowScale | boolean | Whether to allow text to scale.
This attribute is not supported currently.
Default value: **false** | diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-richeditor.md b/en/application-dev/reference/arkui-ts/ts-basic-components-richeditor.md index d69ec2a9e833bec992c52ccd759519d131145487..23d1dd164423c71f692e07fe8600a791f94466e7 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-components-richeditor.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-components-richeditor.md @@ -1,6 +1,6 @@ # RichEditor -The \ is a component that supports interactive text editing and mixture of text and imagery. +The **\** is a component that supports interactive text editing and mixture of text and imagery. > **NOTE** > @@ -114,7 +114,7 @@ Provides the image span style information returned by the backend. | ------ | -------- | ---- | -------------------------------------- | | size | [number, number] | Yes| Width and height of the image.| | verticalAlign | [ImageSpanAlignment](ts-basic-components-imagespan.md#imagespanalignment) | Yes | Vertical alignment mode of the image.| -| objectFit | [ImageFit]((ts-basic-components-imagespan.md#imagefit)) | Yes| Scale mode of the image.| +| objectFit | [ImageFit](ts-basic-components-imagespan.md#imagefit) | Yes| Scale mode of the image.| ## RichEditorOptions @@ -158,7 +158,7 @@ Sets the cursor position. | Name| Type| Mandatory| Description | | ------ | -------- | ---- | -------------------------------------- | -| offset | number | Yes| Offset of the cursor.| +| offset | number | Yes| Offset of the cursor. If the value is out of the text range, the setting fails.| **Return value** @@ -265,8 +265,8 @@ Defines the text span style options. | Name| Type| Mandatory| Description | | ------ | -------- | ---- | -------------------------------------- | -| start | number | No| Start position of the text span whose style needs to be updated. If this parameter is omitted, the value **0** will be used.| -| end | number | No| End position of the text span whose style needs to be updated. If this parameter is omitted, it indicates the end of the text span.| +| start | number | No| Start position of the text span whose style needs to be updated. If this parameter is omitted or set to a negative value, the value **0** will be used.| +| end | number | No| End position of the text span whose style needs to be updated. If this parameter is omitted or set to a value beyond the text range, it indicates the end of the text span.| | textStyle | [RichEditorTextStyle](#richeditortextstyle) | Yes| Text style.| @@ -276,8 +276,8 @@ Defines the image span style options. | Name| Type| Mandatory| Description | | ------ | -------- | ---- | -------------------------------------- | -| start | number | No| Start position of the image span whose style needs to be updated. If this parameter is omitted, the value **0** will be used.| -| end | number | No| End position of the image span whose style needs to be updated. If this parameter is omitted, it indicates the end of the image span.| +| start | number | No| Start position of the image span whose style needs to be updated. If this parameter is omitted or set to a negative value, the value **0** will be used.| +| end | number | No| End position of the image span whose style needs to be updated. If this parameter is omitted or set to a value beyond the text range, it indicates the end of the image span.| | imageStyle | [RichEditorImageSpanStyle](#richeditorimagespanstyle) | Yes| Image style.| @@ -296,12 +296,12 @@ Provides the text style information. | Name| Type| Mandatory| Description | | ------ | -------- | ---- | -------------------------------------- | -| fontColor | [ResourceColor](ts-types.md#resourcecolor) | No| Font color.| -| fontSize | [Length](ts-types.md#length) \| number | No| Font size.| -| fontStyle | [FontStyle](ts-appendix-enums.md#fontstyle) | No| Font style.| -| fontWeight | [FontWeight](ts-appendix-enums.md#fontweight) \| number \| string | No| Font weight.| -| fontFamily | [ResourceStr](ts-types.md#resourcestr) \| number \| string | No| Font family. Default value: **'HarmonyOS Sans'**.
Currently, only the default font is supported.| -| decoration | {
type: [TextDecorationType](ts-appendix-enums.md#textdecorationtype),
color?: [ResourceColor](ts-types.md#resourcecolor)
} \| number \| string | No| Style and color of the text decorative line.| +| fontColor | [ResourceColor](ts-types.md#resourcecolor) | No| Font color.
Default value: **Color.Black**| +| fontSize | [Length](ts-types.md#length) \| number | No| Font size.
Default value: **16fp**| +| fontStyle | [FontStyle](ts-appendix-enums.md#fontstyle) | No| Font style.
Default value: **FontStyle.Normal**| +| fontWeight | [FontWeight](ts-appendix-enums.md#fontweight) \| number \| string | No| Font weight.
Default value: **FontWeight.Normal**| +| fontFamily | [ResourceStr](ts-types.md#resourcestr) \| number \| string | No| Font family. Default value: **'HarmonyOS Sans'**.
Currently, only the default font is supported.
Default font: **'HarmonyOS Sans'**| +| decoration | {
type: [TextDecorationType](ts-appendix-enums.md#textdecorationtype),
color?: [ResourceColor](ts-types.md#resourcecolor)
} | No| Style and color of the text decorative line.
Default value: {
type: TextDecorationType.None,
color: Color.Black
}| ## RichEditorImageSpanOptions @@ -320,8 +320,8 @@ Provides the image span style information. | Name| Type| Mandatory| Description | | ------ | -------- | ---- | -------------------------------------- | | size | [Dimension, Dimension] | No| Width and height of the image.| -| verticalAlign | [ImageSpanAlignment](ts-basic-components-imagespan.md#imagespanalignment) | No | Vertical alignment mode of the image.| -| objectFit | [ImageFit]((ts-basic-components-imagespan.md#imagefit)) | No| Scale mode of the image.| +| verticalAlign | [ImageSpanAlignment](ts-basic-components-imagespan.md#imagespanalignment) | No | Vertical alignment mode of the image.
Default value: **ImageSpanAlignment.BASELINE**| +| objectFit | [ImageFit](ts-appendix-enums.md#imagefit) | No| Scale mode of the image.
Default value: **ImageFit.Cover**| ## RichEditorRange @@ -329,8 +329,8 @@ Provides the span range information. | Name| Type| Mandatory| Description | | ------ | -------- | ---- | -------------------------------------- | -| start | number | No| Start position. If this parameter is omitted, the value **0** will be used.| -| end | number | No| End position. If this parameter is omitted, it indicates the very end.| +| start | number | No| Start position. If this parameter is omitted or set to a negative value, the value **0** will be used.| +| end | number | No| End position of the image span whose style needs to be updated. If this parameter is omitted or set to a value beyond the text range, it indicates the very end.| ## Example diff --git a/en/application-dev/reference/arkui-ts/ts-basic-components-richtext.md b/en/application-dev/reference/arkui-ts/ts-basic-components-richtext.md index 6ab3c683bb77721868f160850eba311054ed5c5c..e7093230c1146b5c18238ea115189f13ce8de2cf 100644 --- a/en/application-dev/reference/arkui-ts/ts-basic-components-richtext.md +++ b/en/application-dev/reference/arkui-ts/ts-basic-components-richtext.md @@ -52,6 +52,19 @@ Among the [universal attributes](ts-universal-attributes-size.md), only the **wi | style | Defines the inline style of an element and is placed inside the tag. Use quotation marks (') to separate the styling text and use semicolons (;) to separate styles, for example, **style='width: 500px;height: 500px;border: 1px solid;margin: 0 auto;'**.| \

This is a heading\

\

This is text\

| | \ | Embeds or references a client-side script, such as JavaScript.| \ | + +## Precautions + +The underlying layer of the **\** component uses the **\** component to provide basic capabilities, including but not limited to HTML page parsing and rendering. However, the **\** component is resources consuming. In scenarios where the **\** component is repeatedly used, for example, when it is repeatedly used in a list, frame freezing or slow response may occur. + +The **\** component complies with the constraints of the **\** component. A typical scenario is as follows: + +The default viewport size of a mobile device is 980 px. This default value ensures that most web pages can be browsed properly on the mobile device. If the width of the **\** component is less than this value, the HTML content specified by **content** may generate a scrollable page that is wrapped by the **\** component. If you want to replace the default value, add the following tags to **content**: + +```html + +``` + ## Example You can preview how this component looks on a real device. The preview is not yet available in the DevEco Studio Previewer. @@ -83,7 +96,7 @@ struct RichTextExample { console.info('RichText onComplete'); }) .width(500) - .height(400) + .height(500) .backgroundColor(0XBDDB69) RichText('layoutWeight(1)') .onStart(() => { @@ -111,7 +124,3 @@ struct RichTextExample { ``` ![richText](figures/richText.png) - -## Precautions - -The underlying layer of the **\** component reuses the **\** component to provide basic capabilities, including but not limited to HTML page parsing and rendering. However, the **\** component is resources consuming. In scenarios where the **\** component is repeatedly used, for example, when it is repeatedly used in a list, frame freezing or slow response may occur. diff --git a/en/application-dev/reference/arkui-ts/ts-container-grid.md b/en/application-dev/reference/arkui-ts/ts-container-grid.md index 2f4cdeb53724cc6d716abff4298e25f3c0f9f5f6..6726cf4455e448bc64f7a54af59d4d2fb9477c6a 100644 --- a/en/application-dev/reference/arkui-ts/ts-container-grid.md +++ b/en/application-dev/reference/arkui-ts/ts-container-grid.md @@ -45,8 +45,8 @@ In addition to the [universal attributes](ts-universal-attributes-size.md), the | Name| Type| Description| | -------- | -------- | -------- | -| columnsTemplate | string | Number of columns in the current grid layout. If this attribute is not set, one column will be used.
For example, **'1fr 1fr 2fr'** indicates three columns, with the first column taking up 1/4 of the parent component's full width, the second column 1/4, and the third column 2/4.
**NOTE**
If this attribute is set to **'0fr'**, the column width is 0, and grid item in the column is not displayed. If this attribute is set to any other invalid value, the grid item is displayed as one column.| -| rowsTemplate | string | Number of rows in the current grid layout. If this attribute is not set, one row will be used.
For example, **'1fr 1fr 2fr'** indicates three rows, with the first row taking up 1/4 of the parent component's full height, the second row 1/4, and the third row 2/4.
**NOTE**
If this attribute is set to **'0fr'**, the row width is 0, and grid item in the row is not displayed. If this attribute is set to any other invalid value, the grid item is displayed as one row.| +| columnsTemplate | string | Number of columns or minimum column width in the grid. If this attribute is not set, one column will be used.
For example, **'1fr 1fr 2fr'** indicates three columns, with the first column taking up 1/4 of the parent component's full width, the second column 1/4, and the third column 2/4.
**'repeat(auto-fit, 90px)'** means to automatically work out the number of columns and the actual column width, with the minimum column width of 90.
**NOTE**
If this attribute is set to **'0fr'**, the column width is 0, and grid item in the column is not displayed. If this attribute is set to any other invalid value, the grid item is displayed as one column.| +| rowsTemplate | string | Number of rows or minimum row height in the grid. If this attribute is not set, one row will be used.
For example, **'1fr 1fr 2fr'** indicates three rows, with the first row taking up 1/4 of the parent component's full height, the second row 1/4, and the third row 2/4.
**'repeat(auto-fit, 90px)'** means to automatically work out the number of rows and the actual v, with the minimum row height of 90.
**NOTE**
If this attribute is set to **'0fr'**, the row width is 0, and grid item in the row is not displayed. If this attribute is set to any other invalid value, the grid item is displayed as one row.| | columnsGap | [Length](ts-types.md#length) | Gap between columns.
Default value: **0**
**NOTE**
A value less than 0 evaluates to the default value.| | rowsGap | [Length](ts-types.md#length) | Gap between rows.
Default value: **0**
**NOTE**
A value less than 0 evaluates to the default value.| | scrollBar | [BarState](ts-appendix-enums.md#barstate) | Scrollbar status.
Default value: **BarState.Off**
**NOTE**
In API version 9 and earlier versions, the default value is **BarState.Off**. In API version 10, the default value is **BarState.Auto**.| @@ -55,8 +55,8 @@ In addition to the [universal attributes](ts-universal-attributes-size.md), the | cachedCount | number | Number of grid items to be preloaded (cached). It works only in [LazyForEach](../../quick-start/arkts-rendering-control-lazyforeach.md). For details, see [Minimizing White Blocks During Swiping](../../ui/arkts-performance-improvement-recommendation.md#minimizing-white-blocks-during-swiping).
Default value: **1**
**NOTE**
The number of the grid items to be cached before and after the currently displayed one equals the value of **cachedCount** multiplied by the number of columns.
Grid items that exceed the display and cache range are released.
A value less than 0 evaluates to the default value.| | editMode 8+ | boolean | Whether to enter editing mode. In editing mode, the user can drag the **\<[GridItem](ts-container-griditem.md)>** in the **\** component.
Default value: **false**| | layoutDirection8+ | [GridDirection](#griddirection8) | Main axis direction of the grid.
Default value: **GridDirection.Row**| -| maxCount8+ | number | When **layoutDirection** is **Row** or **RowReverse**: maximum number of columns that can be displayed.
When **layoutDirection** is **Column** or **ColumnReverse**: maximum number of rows that can be displayed.
Default value: **Infinity**
**NOTE**
If the value of **maxCount** is smaller than that of **minCount**, the default values of **maxCount** and **minCount** are used.
A value less than 0 evaluates to the default value.| -| minCount8+ | number | When **layoutDirection** is **Row** or **RowReverse**: minimum number of columns that can be displayed.
When **layoutDirection** is **Column** or **ColumnReverse**: minimum number of rows that can be displayed.
Default value: **1**
**NOTE**
A value less than 0 evaluates to the default value.| +| maxCount8+ | number | When **layoutDirection** is **Row** or **RowReverse**: maximum number of columns that can be displayed.
When **layoutDirection** is **Column** or **ColumnReverse**: maximum number of rows that can be displayed.
Default value: **Infinity**
**NOTE**
If the value of **maxCount** is smaller than that of **minCount**, the default values of **maxCount** and **minCount** are used.
A value less than 1 evaluates to the default value.| +| minCount8+ | number | When **layoutDirection** is **Row** or **RowReverse**: minimum number of columns that can be displayed.
When **layoutDirection** is **Column** or **ColumnReverse**: minimum number of rows that can be displayed.
Default value: **1**
**NOTE**
A value less than 1 evaluates to the default value.| | cellLength8+ | number | When **layoutDirection** is **Row** or **RowReverse**: fixed height per row.
When **layoutDirection** is **Column** or **ColumnReverse**: fixed width per column.
Default value: size of the first element| | multiSelectable8+ | boolean | Whether to enable mouse frame selection.
Default value: **false**
- **false**: The mouse frame selection is disabled.
- **true**: The mouse frame selection is enabled.| | supportAnimation8+ | boolean | Whether to enable animation. Currently, the grid item drag animation is supported.
Default value: **false**| @@ -187,11 +187,12 @@ struct GridExample { .columnsGap(10) .rowsGap(10) .edgeEffect(EdgeEffect.Spring) + .scrollBar(BarState.On) .onScrollIndex((first: number) => { console.info(first.toString()) }) .onScrollBarUpdate((index: number, offset: number) => { - return {totalOffset: (index / 5) * (80 + 10) - 10 - offset, totalLength: 80 * 5 + 10 * 4} + return {totalOffset: (index / 5) * (80 + 10) - offset, totalLength: 80 * 5 + 10 * 4} }) .width('90%') .backgroundColor(0xFAEEE0) @@ -284,4 +285,17 @@ struct GridExample { } } ``` - \ No newline at end of file + +Below are some examples. + +Below shows how the grid looks when dragging of grid items starts. + +![gridDrag](figures/gridDrag.png) + +Below shows how the grid looks when dragging of grid items is in progress. + +![gridDrag](figures/gridDrag1.png) + +Below shows how the grid looks after grid item 1 and grid item 6 swap their positions. + +![gridDrag](figures/gridDrag2.png) diff --git a/en/application-dev/reference/arkui-ts/ts-container-list.md b/en/application-dev/reference/arkui-ts/ts-container-list.md index 0456b0eabd821d1df0d4996900b88b98d8aed26d..c7eff1d8791375735a9d7dedc2baa217d41a32f1 100644 --- a/en/application-dev/reference/arkui-ts/ts-container-list.md +++ b/en/application-dev/reference/arkui-ts/ts-container-list.md @@ -49,21 +49,23 @@ Since API version 9, this API is supported in ArkTS widgets. In addition to the [universal attributes](ts-universal-attributes-size.md), the following attributes are supported. -| Name | Type | Description | -| ----------------------------------- | ---------------------------------------- | ---------------------------------------- | -| listDirection | [Axis](ts-appendix-enums.md#axis) | Direction in which the list items are arranged.
Default value: **Axis.Vertical**
Since API version 9, this API is supported in ArkTS widgets.| +| Name | Type | Description | +| ----------------------------------- | ------------------------------------------------------------ | ------------------------------------------------------------ | +| listDirection | [Axis](ts-appendix-enums.md#axis) | Direction in which the list items are arranged.
Default value: **Axis.Vertical**
Since API version 9, this API is supported in ArkTS widgets.| | divider | {
strokeWidth: [Length](ts-types.md#length),
color?:[ResourceColor](ts-types.md#resourcecolor),
startMargin?: Length,
endMargin?: Length
} \| null | Style of the divider for the list items. By default, there is no divider.
- **strokeWidth**: stroke width of the divider.
- **color**: color of the divider.
- **startMargin**: distance between the divider and the start edge of the list.
- **endMargin**: distance between the divider and the end edge of the list.
Since API version 9, this API is supported in ArkTS widgets.
The sum of **endMargin** and **startMargin** cannot exceed the column width.
**startMargin** and **endMargin** cannot be set in percentage.
The divider is drawn between list items along the main axis, and not above the first list item and below the last list item.
In multi-column mode, the value of **startMargin** is calculated from the start edge of the cross axis of each column. In other cases, it is calculated from the start edge of the cross axis of the list.| | scrollBar | [BarState](ts-appendix-enums.md#barstate) | Scrollbar status.
Default value: **BarState.Off**
Since API version 9, this API is supported in ArkTS widgets.
**NOTE**
In API version 9 and earlier versions, the default value is **BarState.Off**. In API version 10, the default value is **BarState.Auto**.| | cachedCount | number | Number of list items or list item groups to be preloaded (cached). It works only in [LazyForEach](../../quick-start/arkts-rendering-control-lazyforeach.md). A list item group is calculated as a whole, and all list items of the group are preloaded at the same time. For details, see [Minimizing White Blocks During Swiping](../../ui/arkts-performance-improvement-recommendation.md#minimizing-white-blocks-during-swiping).
Default value: **1**
Since API version 9, this API is supported in ArkTS widgets.
**NOTE**
In single-column mode, the number of the list items to be cached before and after the currently displayed one equals the value of **cachedCount**.
In multi-column mode, the number of the list items to be cached is the value of **cachedCount** multiplied by the number of columns.| | editMode(deprecated) | boolean | Whether to enter editing mode.
This API is deprecated since API version 9. For details about how to implement deletion of a selected list item, see [Example 3](#example-3).
Default value: **false**| -| edgeEffect | [EdgeEffect](ts-appendix-enums.md#edgeeffect) | Scroll effect. The spring effect and shadow effect are supported.
Default value: **EdgeEffect.Spring**
Since API version 9, this API is supported in ArkTS widgets.| -| chainAnimation | boolean | Whether to display chained animations on this list when it slides or its top or bottom is dragged. The list items are separated with even space, and one item animation starts after the previous animation during basic sliding interactions. The chained animation effect is similar with spring physics.
Default value: **false**
- **false**: No chained animations are displayed.
- **true**: Chained animations are displayed.
Since API version 9, this API is supported in ArkTS widgets.
**NOTE**
When chained animations are in motion, the list divider is not displayed.
The following prerequisites must be met for the chained animations to take effect:
- The edge effect of the list is of the Spring type.
- The multi-column mode is not enabled for the list.| +| edgeEffect | [EdgeEffect](ts-appendix-enums.md#edgeeffect) | Edge scrolling effect. The spring effect and shadow effect are supported.
Default value: **EdgeEffect.Spring**
Since API version 9, this API is supported in ArkTS widgets.| +| chainAnimation | boolean | Whether to display chained animations on this list when it slides or its top or bottom is dragged. The list items are separated with even space, and one item animation starts after the previous animation during basic sliding interactions. The chained animation effect is similar with spring physics.
Default value: **false**
- **false**: No chained animations are displayed.
- **true**: Chained animations are displayed.
Since API version 9, this API is supported in ArkTS widgets.
**NOTE**
When chained animations are in motion, the list divider is not displayed.
The following prerequisites must be met for the chained animations to take effect:
- The edge scrolling effect of the list is of the Spring type.
- The multi-column mode is not enabled for the list.| | chainAnimationOptions10+ | [ChainAnimationOptions](#chainanimationoptions10) | Chained animation settings.
**System API**: This is a system API. | | multiSelectable8+ | boolean | Whether to enable mouse frame selection.
Default value: **false**
- **false**: The mouse frame selection is disabled.
- **true**: The mouse frame selection is enabled.
Since API version 9, this API is supported in ArkTS widgets.| -| lanes9+ | number \| [LengthConstrain](ts-types.md#lengthconstrain) | In the following description, **listDirection** is set to **Axis.Vertical**:
Number of columns in which the list items are arranged along the cross axis.
Default value: **1**
The rules are as follows:
- If the value is set to a number, the column width is calculated by dividing the cross-axis width of the **\** component by the specified number.
- If the value is set to {minLength, maxLength}, the number of columns is adjusted adaptively based on the width of the **\** component, ensuring that the width respects the {minLength, maxLength} constraints during adaptation. The **minLength** constraint is prioritized.
- If the value is set to {minLength, maxLength}, and the cross-axis width constraint of the parent component is infinite, the parent component is arranged by column, and the column width is calculated based on the largest list item in the display area.
- Each list item group occupies one row in multi-column mode. Its child list items are arranged based on the **lanes** attribute of the list.
- If the value is set to {minLength, maxLength}, the number of columns is calculated based on the cross-axis width of the list item group. If the cross-axis width of the list item group is different from that of the list, the number of columns in the list item group may be different from that in the list.
This API is supported in ArkTS widgets.| +| lanes9+ | number \| [LengthConstrain](ts-types.md#lengthconstrain),
gutter10+?:[Dimension](ts-types.md#dimension10) | In the following description, **listDirection** is set to **Axis.Vertical**:
Number of columns in which the list items are arranged along the cross axis.
Default value: **1**
The rules are as follows:
- If the value is set to a number, the column width is calculated by dividing the cross-axis width of the **\** component by the specified number.
- If the value is set to {minLength, maxLength}, the number of columns is adjusted adaptively based on the width of the **\** component, ensuring that the width respects the {minLength, maxLength} constraints during adaptation. The **minLength** constraint is prioritized.
- If the value is set to {minLength, maxLength}, and the cross-axis width constraint of the parent component is infinite, the parent component is arranged by column, and the column width is calculated based on the largest list item in the display area.
- Each list item group occupies one row in multi-column mode. Its child list items are arranged based on the **lanes** attribute of the list.
- If the value is set to {minLength, maxLength}, the number of columns is calculated based on the cross-axis width of the list item group. If the cross-axis width of the list item group is different from that of the list, the number of columns in the list item group may be different from that in the list.
If the value is set to the **gutter** type, it indicates the column spacing. It takes effect when the number of columns is greater than 1.
Default value: **0**
This API is supported in ArkTS widgets.| | alignListItem9+ | [ListItemAlign](#listitemalign9) | Alignment mode of list items along the cross axis when: Cross-axis width of the **\** component > Cross-axis width of list items x Value of **lanes**.
Default value: **ListItemAlign.Start**
This API is supported in ArkTS widgets.| | sticky9+ | [StickyStyle](#stickystyle9) | Whether to pin the header to the top or the footer to the bottom in the **\** component. This attribute is used together with the **[\](ts-container-listitemgroup.md)** component.
Default value: **StickyStyle.None**
This API is supported in ArkTS widgets.
**NOTE**
The **sticky** attribute can be set to **StickyStyle.Header** or \| **StickyStyle.Footer** to support both the pin-to-top and pin-to-bottom features.| +| scrollSnapAlign10+ | [ScrollSnapAlign](#scrollsnapalign10) | Alignment mode of list items when scrolling ends.
Default value: **ScrollSnapAlign.NONE**
**NOTE**
This attribute is available only when the heights of list items are the same.| | enableScrollInteraction10+ | boolean | Whether to support scroll gestures. When this attribute is set to **false**, scrolling by finger or mouse is not supported, but the scrolling controller API is not affected.
Default value: **true** | +| nestedScroll10+ | [NestedScrollOptions](ts-container-scroll.md#nestedscrolloptions10) | Nested scrolling options. You can set the nested scrolling mode in the forward and backward directions to implement scrolling linkage with the parent component.| ## ListItemAlign9+ @@ -87,7 +89,7 @@ This API is supported in ArkTS widgets. ## ChainEdgeEffect10+ -Describes the chained animation edge effect. +Describes the chained animation edge scrolling effect. **System API**: This is a system API. @@ -98,7 +100,7 @@ Describes the chained animation edge effect. ## chainAnimationOptions10+ -Provides the chained animation settings, which cover the maximum spacing, minimum spacing, intensity, conductivity, and edge effect. +Provides the chained animation settings, which cover the maximum spacing, minimum spacing, intensity, conductivity, and edge scrolling effect. **System API**: This is a system API. @@ -108,22 +110,38 @@ Provides the chained animation settings, which cover the maximum spacing, minimu | maxSpace | [Length](ts-types.md#length) | Yes | Maximum spacing between the chained animations. | | conductivity | number | No | Conductivity of the chained animations. The value range is [0,1]. A larger value indicates higher conductivity.
Default value: **0.7**| | intensity | number | No | Intensity of the chained animations. The value range is [0,1]. A larger value indicates more obvious animations.
Default value: **0.3**| -| edgeEffect | [ChainEdgeEffect](#chainedgeeffect10)| No | Chained animation edge effect.
Default value: **ChainEdgeEffect.DEFAULT**| +| edgeEffect | [ChainEdgeEffect](#chainedgeeffect10)| No | Chained animation edge scrolling effect.
Default value: **ChainEdgeEffect.DEFAULT**| > **NOTE** > > The default value of the universal attribute [clip](ts-universal-attributes-sharp-clipping.md) is **true** for the **\** component. +## ScrollSnapAlign10+ + +Enumerates the alignment modes of list items when scrolling ends. + +Since API version 10, this API is supported in ArkTS widgets. + +When list items are left-, right-, top-, or bottom-aligned, the items at the end must be completely displayed, without exposure of any blank area of the boundary; the items at the other end can be out of alignment. + +This API is available only when the heights of list items are the same. + +| Name | Description | +| ------ | ------------------------------------------------------------ | +| NONE | No alignment. This is the default value. When scrolling ends, the list items are not aligned. | +| START | The first item in the view is aligned at the start of the list.
**NOTE**
When the list hits the end, the items at the end must be completely displayed. In this case, the items at the start may not be aligned.| +| CENTER | The middle items in the view are aligned in the center of the list.
**NOTE**
The items at the start and end can be aligned in the center of the list. In this case, the list may have a blank area exposed, and the first or last item is aligned to the center.| +| END | The last item in the view is aligned at the end of the list.
**NOTE**
When the list hits the start, the items at the start must be completely displayed. In this case, the items at the end may not be aligned.| ## Events | Name | Description | | ---------------------------------------- | ---------------------------------------- | | onItemDelete(deprecated)(event: (index: number) => boolean) | Triggered when a list item is deleted.
This API is deprecated since API version 9.
- **index**: index of the deleted list item.| -| onScroll(event: (scrollOffset: number, scrollState: ScrollState) => void) | Triggered when the list scrolls.
- **scrollOffset**: scroll offset of each frame. The offset is positive when the list is scrolled up and negative when the list is scrolled down.
- **[scrollState](#scrollstate)**: current scroll state.
This event is not triggered when **ScrollEdge** and **ScrollToIndex** are called by using the controller. In other cases, this event is triggered when scrolling occurs.
Since API version 9, this API is supported in ArkTS widgets.| -| onScrollIndex(event: (start: number, end: number) => void) | Triggered when a child component enters or leaves the list display area.
During index calculation, each **\** component is taken as a whole and assigned an index, and the indexes of the list items within are not included in the calculation.
- **start**: index of the scroll start position.
- **end**: index of the scroll end position.
This event is triggered once when the list is initialized and when the index of the first list item or the next list item in the list display area changes.
When the list edge effect is the spring effect, the **onScrollIndex** event is not triggered when the user scrolls the list to the edge or releases the list to rebound.
Since API version 9, this API is supported in ArkTS widgets.| -| onReachStart(event: () => void) | Triggered when the list reaches the start position.
Since API version 9, this API is supported in ArkTS widgets.
**NOTE**
This event is triggered once when **initialIndex** is **0** during list initialization and once when the list scrolls to the start position. When the list edge effect is the spring effect, this event is triggered once when the list passes the start position and is triggered again when the list returns to the start position.| -| onReachEnd(event: () => void) | Triggered when the list reaches the end position.
Since API version 9, this API is supported in ArkTS widgets.
**NOTE**
When the list edge effect is the spring effect, this event is triggered once when the list passes the end position and is triggered again when the list returns to the end position.| -| onScrollFrameBegin9+(event: (offset: number, state: ScrollState) => { offsetRemain }) | Triggered when the list starts to scroll. The input parameters indicate the amount by which the list will scroll. The event handler then works out the amount by which the list needs to scroll based on the real-world situation and returns the result.
\- **offset**: amount to scroll by, in vp.
\- **state**: current sliding status.
- **offsetRemain**: actual amount by which the list scrolls, in vp.
This event is triggered when the user starts dragging the list or the list starts inertial scrolling. This event is not triggered when the list rebounds or the scrolling controller is used.
This API is supported in ArkTS widgets.
**NOTE**
If **listDirection** is set to **Axis.Vertical**, the return value is the amount by which the list needs to scroll in the vertical direction. If **listDirection** is set to **Axis.Horizontal**, the return value is the amount by which the list needs to scroll in the horizontal direction.| +| onScroll(event: (scrollOffset: number, scrollState: ScrollState) => void) | Triggered when the list scrolls.
- **scrollOffset**: scroll offset of each frame. The offset is positive when the list is scrolled up and negative when the list is scrolled down.
- **[scrollState](#scrollstate)**: current scroll state.
Since API version 9, this API is supported in ArkTS widgets.| +| onScrollIndex(event: (start: number, end: number, center10+: number) => void) | Triggered when a child component enters or leaves the list display area. Since API version 10, this event is also triggered when the child component in the center of the list display area changes.
During index calculation, each **\** component is taken as a whole and assigned an index, and the indexes of the list items within are not included in the calculation.
- **start**: index of the first child component in the list display area.
- **end**: index of the last child component in the list display area.
- **center**: index of the center child component in the list display area.
This event is triggered once when the list is initialized and when the index of the first list item or the next list item in the list display area changes. Since API version 10, this event is also triggered when the child component in the center of the list display area changes.
When the list edge scrolling effect is the spring effect, the **onScrollIndex** event is not triggered when the user scrolls the list to the edge or releases the list to rebound.
Since API version 9, this API is supported in ArkTS widgets.| +| onReachStart(event: () => void) | Triggered when the list reaches the start position.
Since API version 9, this API is supported in ArkTS widgets.
**NOTE**
This event is triggered once when **initialIndex** is **0** during list initialization and once when the list scrolls to the start position. When the list edge scrolling effect is the spring effect, this event is triggered once when the list passes the start position and is triggered again when the list returns to the start position.| +| onReachEnd(event: () => void) | Triggered when the list reaches the end position.
Since API version 9, this API is supported in ArkTS widgets.
**NOTE**
When the list edge scrolling effect is the spring effect, this event is triggered once when the list passes the end position and is triggered again when the list returns to the end position.| +| onScrollFrameBegin9+(event: (offset: number, state: ScrollState) => { offsetRemain }) | Triggered when the list starts to scroll. The input parameters indicate the amount by which the list will scroll. The event handler then works out the amount by which the list needs to scroll based on the real-world situation and returns the result.
\- **offset**: amount to scroll by, in vp.
\- **state**: current scrolling state.
- **offsetRemain**: actual amount by which the list scrolls, in vp.
This event is triggered when the user starts dragging the list or the list starts inertial scrolling. This event is not triggered when the list rebounds or the scrolling controller is used.
This API is supported in ArkTS widgets.
**NOTE**
If **listDirection** is set to **Axis.Vertical**, the return value is the amount by which the list needs to scroll in the vertical direction. If **listDirection** is set to **Axis.Horizontal**, the return value is the amount by which the list needs to scroll in the horizontal direction.| | onScrollStart9+(event: () => void) | Triggered when the list starts scrolling initiated by the user's finger dragging the **\** component or its scrollbar. This event is also triggered when the animation contained in the scrolling triggered by [Scroller](ts-container-scroll.md#scroller) starts.
This API is supported in ArkTS widgets.| | onScrollStop(event: () => void) | Triggered when the list stops scrolling after the user's finger leaves the screen. This event is also triggered when the animation contained in the scrolling triggered by [Scroller](ts-container-scroll.md#scroller) stops.
Since API version 9, this API is supported in ArkTS widgets.| | onItemMove(event: (from: number, to: number) => boolean) | Triggered when a list item moves.
- **from**: index of the item before moving.
- **to**: index of the item after moving.| @@ -139,9 +157,21 @@ Since API version 9, this API is supported in ArkTS widgets. | Name | Description | | ------ | ------------------------------ | -| Idle | Not scrolling. Triggered when the API provided by the controller is used to scroll the list or when the scrollbar is dragged. | -| Scroll | Finger dragging. Triggered when the user drags the list to scroll. | -| Fling | Inertial scrolling. Triggered when inertial scrolling occurs or when the list bounces back after being released from a quick swipe.| +| Idle | Idle. The list enters this state when an API in the controller is used to scroll the list or when the scrollbar is dragged.
**NOTE**
Since API version 10, the list enters this state when it is not scrolling or an API in the controller that does not apply an animation is called.| +| Scroll | Scrolling. The list enters this state when the user drags the list to scroll.
**NOTE**
Since API version 10, the list also enters this state when the user drags the scrollbar or the mouse wheel to scroll the list. | +| Fling | Inertial scrolling. The list enters this state when inertial scrolling occurs or when the list bounces back after being released from a fling.
**NOTE**
Since API version 10, the list enters this state when: inertial scrolling occurs after a fling; the list bounces back after being released from a fling; inertial scrolling occurs after quick dragging of the built-in scrollbar; scrolling occurs after an API in the controller that applies an animation is called.| + +The table below lists the changes in the **ScrollState** enums. + +| Scenario | API version 9 and earlier |API version 10 and later | +| ------ | ------------------------------ |------------------------------ | +| Finger dragging | Scroll | Scroll | +| Inertial scrolling | Fling | Fling | +| Cross-boundary bouncing | Fling | Fling | +| Scrolling by mouse wheel | Idle | Scroll | +| Scrollbar dragging | Idle | Scroll | +| Scrolling by the scrolling controller (with animation) | Idle | Fling | +| Scrolling by the scrolling controller (without animation) | Idle | Idle | > **NOTE** > @@ -184,10 +214,14 @@ struct ListExample { .listDirection(Axis.Vertical) // Arrangement direction .scrollBar(BarState.Off) .divider({ strokeWidth: 2, color: 0xFFFFFF, startMargin: 20, endMargin: 20 }) // Divider - .edgeEffect(EdgeEffect.Spring) // No effect when the list scrolls to the edge. - .onScrollIndex((firstIndex: number, lastIndex: number) => { + .edgeEffect(EdgeEffect.Spring) // Set the edge scrolling effect to Spring. + .onScrollIndex((firstIndex: number, lastIndex: number, centerIndex: number) => { console.info('first' + firstIndex) console.info('last' + lastIndex) + console.info('center' + centerIndex) + }) + .onScroll((scrollOffset: number, scrollState: ScrollState) => { + console.info(`onScroll scrollState = ${ScrollState[scrollState]}, scrollOffset = ${[scrollOffset]}`) }) .width('90%') } @@ -305,3 +339,50 @@ struct ListExample{ ``` ![list](figures/list3.gif) + +### Example 4 + +```ts +// xxx.ets +@Entry +@Component +struct ListExample { + private arr: number[] = Array.apply(this, {length: 20}).map((item, i) => i) + private scrollerForList: Scroller = new Scroller() + + build() { + Column() { + Row() { + List({ space: 20, initialIndex: 0, scroller: this.scrollerForList }) { + ForEach(this.arr, (item) => { + ListItem() { + Text('' + item) + .width('100%').height(100).fontSize(16) + .textAlign(TextAlign.Center) + } + .borderRadius(10).backgroundColor(0xFFFFFF) + .width('60%') + .height('80%') + }, item => item) + } + .chainAnimation(true) + .edgeEffect(EdgeEffect.Spring) + .listDirection(Axis.Horizontal) + .height('100%') + .width('100%') + .scrollSnapAlign(ScrollSnapAlign.CENTER) + .borderRadius(10) + .backgroundColor(0xDCDCDC) + .listDirection(Axis.Horizontal) + .width('100%') + } + .width('100%') + .height('100%') + .backgroundColor(0xDCDCDC) + .padding({ top: 10}) + } + } +} +``` + +![list](figures/list4.gif) diff --git a/en/application-dev/reference/arkui-ts/ts-container-panel.md b/en/application-dev/reference/arkui-ts/ts-container-panel.md index 395f32d6e9ec42c8578e76084631319f935be6b9..b0359c645851f1e28e8f3ab8a3371d3f501df89d 100644 --- a/en/application-dev/reference/arkui-ts/ts-container-panel.md +++ b/en/application-dev/reference/arkui-ts/ts-container-panel.md @@ -103,4 +103,4 @@ struct PanelExample { } ``` -![en-us_image_0000001256978381](figures/en-us_image_0000001256978381.gif) +![en-us_image_0000001174422896](figures/en-us_image_0000001174422896.gif) diff --git a/en/application-dev/reference/arkui-ts/ts-container-scroll.md b/en/application-dev/reference/arkui-ts/ts-container-scroll.md index 8fd15ac0a038142180ee2705ee4b6026ba6ac5e9..8c13e893b7a6ceea454cfbef8511153c5eda4bfb 100644 --- a/en/application-dev/reference/arkui-ts/ts-container-scroll.md +++ b/en/application-dev/reference/arkui-ts/ts-container-scroll.md @@ -35,6 +35,8 @@ In addition to the [universal attributes](ts-universal-attributes-size.md), the | scrollBarColor | string \| number \| [Color](ts-appendix-enums.md#color) | Color of the scrollbar.| | scrollBarWidth | string \| number | Width of the scrollbar. This attribute cannot be set in percentage.
Default value: **4**
Unit: vp
**NOTE**
If the width of the scrollbar exceeds its height, it will change to the default value.| | edgeEffect | [EdgeEffect](ts-appendix-enums.md#edgeeffect) | Scroll effect. For details, see **EdgeEffect**.
Default value: **EdgeEffect.None**| +| enableScrollInteraction10+ | boolean | Whether to support scroll gestures. When this attribute is set to **false**, scrolling by finger or mouse is not supported, but the scrolling controller API is not affected.
Default value: **true** | +| nestedScroll10+ | [NestedScrollOptions](#nestedscrolloptions10) | Nested scrolling options. You can set the nested scrolling mode in the forward and backward directions to implement scrolling linkage with the parent component.| ## ScrollDirection | Name | Description | @@ -42,18 +44,18 @@ In addition to the [universal attributes](ts-universal-attributes-size.md), the | Horizontal | Only horizontal scrolling is supported. | | Vertical | Only vertical scrolling is supported. | | None | Scrolling is disabled. | -| Free(deprecated) | Vertical or horizontal scrolling is supported.
This API is deprecated since API version 9. | +| Free(deprecated) | Vertical or horizontal scrolling is supported.
This API is deprecated since API version 9.| ## Events -| Name | Description | +| Name | Description | | ------------------------------------------------------------ | ------------------------------------------------------------ | -| onScrollFrameBegin9+(event: (offset: number, state: ScrollState) => { offsetRemain }) | Triggered when each frame scrolling starts. The input parameters indicate the amount by which the **\** component will scroll. The event handler then works out the amount by which the component needs to scroll based on the real-world situation and returns the result.
\- **offset**: amount to scroll by.
\- **state**: current scrolling status.
- **offsetRemain**: actual amount by which the component scrolls.
**NOTE**
1. This event is triggered when scrolling is started by the **\** component or other input settings, such as keyboard and mouse operations.
2. This event is not triggered when the controller API is called.
3. This event does not support the out-of-bounds bounce effect.
**NOTE**
The value of **offsetRemain** can be a negative value.
If the **onScrollFrameBegine** event and **scrollBy** method are used to implement nested scrolling, set the **edgeEffect** attribute of the scrollable child component to **None**. For example, if a **\** is nested in the **\** component, **edgeEffect** of the **\** must be set to **EdgeEffect.None**. | -| onScroll(event: (xOffset: number, yOffset: number) => void) | Triggered to return the horizontal and vertical offsets during scrolling when the specified scroll event occurs.
**NOTE**
1. This event is triggered when scrolling is started by the **\** component or other input settings, such as keyboard and mouse operations.
2. This event is triggered when the controller API is called.
3. This event supports the out-of-bounds bounce effect. | -| onScrollEdge(event: (side: Edge) => void) | Triggered when scrolling reaches the edge.
**NOTE**
1. This event is triggered when scrolling reaches the edge after being started by the **\** component or other input settings, such as keyboard and mouse operations.
2. This event is triggered when the controller API is called.
3. This event supports the out-of-bounds bounce effect. | -| onScrollEnd(deprecated) (event: () => void) | Triggered when scrolling stops.
This event is deprecated since API version 9. Use the **onScrollStop** event instead.
**NOTE**
1. This event is triggered when scrolling is stopped by the **\** component or other input settings, such as keyboard and mouse operations.
2. This event is triggered when the controller API is called, accompanied by a transition animation. | -| onScrollStart9+(event: () => void) | Triggered when scrolling starts and is initiated by the user's finger dragging the **\** component or its scrollbar. This event is also triggered when the animation contained in the scrolling triggered by [Scroller](#scroller) starts.
**NOTE**
1. This event is triggered when scrolling is started by the **\** component or other input settings, such as keyboard and mouse operations.
2. This event is triggered when the controller API is called, accompanied by a transition animation. | -| onScrollStop9+(event: () => void) | Triggered when scrolling stops after the user's finger leaves the screen. This event is also triggered when the animation contained in the scrolling triggered by [Scroller](#scroller) stops.
**NOTE**
1. This event is triggered when scrolling is stopped by the **\** component or other input settings, such as keyboard and mouse operations.
2. This event is triggered when the controller API is called, accompanied by a transition animation. | +| onScrollFrameBegin9+(event: (offset: number, state: ScrollState) => { offsetRemain }) | Triggered when each frame scrolling starts. The input parameters indicate the amount by which the **\** component will scroll. The event handler then works out the amount by which the component needs to scroll based on the real-world situation and returns the result.
\- **offset**: amount to scroll by.
\- **state**: current scrolling status.
- **offsetRemain**: actual amount by which the component scrolls.
**NOTE**
1. This event is triggered when scrolling is started by the **\** component or other input settings, such as keyboard and mouse operations.
2. This event is not triggered when the controller API is called.
3. This event does not support the out-of-bounds bounce effect.
**NOTE**
The value of **offsetRemain** can be a negative value.
If the **onScrollFrameBegine** event and **scrollBy** method are used to implement nested scrolling, set the **edgeEffect** attribute of the scrollable child component to **None**. For example, if a **\** is nested in the **\** component, **edgeEffect** of the **\** must be set to **EdgeEffect.None**.| +| onScroll(event: (xOffset: number, yOffset: number) => void) | Triggered to return the horizontal and vertical offsets during scrolling when the specified scroll event occurs.
**NOTE**
1. This event is triggered when scrolling is started by the **\** component or other input settings, such as keyboard and mouse operations.
2. This event is triggered when the controller API is called.
3. This event supports the out-of-bounds bounce effect.| +| onScrollEdge(event: (side: Edge) => void) | Triggered when scrolling reaches the edge.
**NOTE**
1. This event is triggered when scrolling reaches the edge after being started by the **\** component or other input settings, such as keyboard and mouse operations.
2. This event is triggered when the controller API is called.
3. This event supports the out-of-bounds bounce effect.| +| onScrollEnd(deprecated) (event: () => void) | Triggered when scrolling stops.
This event is deprecated since API version 9. Use the **onScrollStop** event instead.
**NOTE**
1. This event is triggered when scrolling is stopped by the **\** component or other input settings, such as keyboard and mouse operations.
2. This event is triggered when the controller API is called, accompanied by a transition animation.| +| onScrollStart9+(event: () => void) | Triggered when scrolling starts and is initiated by the user's finger dragging the **\** component or its scrollbar. This event is also triggered when the animation contained in the scrolling triggered by [Scroller](#scroller) starts.
**NOTE**
1. This event is triggered when scrolling is started by the **\** component or other input settings, such as keyboard and mouse operations.
2. This event is triggered when the controller API is called, accompanied by a transition animation.| +| onScrollStop9+(event: () => void) | Triggered when scrolling stops after the user's finger leaves the screen. This event is also triggered when the animation contained in the scrolling triggered by [Scroller](#scroller) stops.
**NOTE**
1. This event is triggered when scrolling is stopped by the **\** component or other input settings, such as keyboard and mouse operations.
2. This event is triggered when the controller API is called, accompanied by a transition animation.| > **NOTE** > @@ -73,7 +75,7 @@ scroller: Scroller = new Scroller() ### scrollTo -scrollTo(value: { xOffset: number | string, yOffset: number | string, animation?: { duration: number, curve: Curve } }): void +scrollTo(value: { xOffset: number | string, yOffset: number | string, animation?: { duration?: number, curve?: Curve | ICurve } | boolean }): void Scrolls to the specified position. @@ -84,7 +86,7 @@ Scrolls to the specified position. | --------- | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | | xOffset | number \| string | Yes | Horizontal scrolling offset.
**NOTE**
This parameter cannot be set in percentage.
This parameter is valid only when the scroll axis is the x-axis.| | yOffset | number \| string | Yes | Vertical scrolling offset.
**NOTE**
This parameter cannot be set in percentage.
This parameter is valid only when the scroll axis is the y-axis.| -| animation | {
duration: number,
curve: [Curve](ts-appendix-enums.md#curve)
} | No | Animation configuration, which includes the following:
- **duration**: scrolling duration.
- **curve**: scrolling curve.
Default value:
{
duration: 0,
curve: Curve.Ease
}
**NOTE**
A value less than 0 evaluates to the default value.| +| animation | {duration?: number, curve?: [Curve](ts-appendix-enums.md#curve) \| [ICurve](../apis/js-apis-curve.md#icurve)10+ } \| boolean10+ | No | Animation configuration, which includes the following:
- **duration**: scrolling duration.
- **curve**: scrolling curve.
- **boolean**: whether to enable the default spring animation.
Default value:
{
duration: 1000,
curve: Curve.Ease
}
boolean: false
**NOTE**
A value less than 0 evaluates to the default value.
Currently, the **\**, **\**, **\**, and **\** support the **Boolean** type and **ICurve**.| ### scrollEdge @@ -112,7 +114,7 @@ Scrolls to the next or previous page. | Name | Type | Mandatory | Description | | --------- | ------- | ---- | ------------------------------ | | next | boolean | Yes | Whether to turn to the next page. The value **true** means to scroll to the next page, and **false** means to scroll to the previous page.| -| direction(deprecated) | [Axis](ts-appendix-enums.md#axis) | No | Scrolling direction: horizontal or vertical.
This API is deprecated since API version 9. | +| direction(deprecated) | [Axis](ts-appendix-enums.md#axis) | No | Scrolling direction: horizontal or vertical.
This API is deprecated since API version 9. | ### currentOffset @@ -146,7 +148,7 @@ When **smooth** is set to **true**, all passed items are loaded and counted in l | Name | Type| Mandatory| Description | | --------------------- | -------- | ---- | ------------------------------------------------------------ | -| value | number | Yes | Index of the item to be scrolled to in the list. | +| value | number | Yes | Index of the item to be scrolled to in the list.
**NOTE**
If the value set is a negative value or greater than the maximum index of the list items, the value is abnormal, and no scrolling will be performed. | | smooth10+ | boolean | No | Whether to enable the smooth animation for scrolling to the item with the specified index. The value **true** means to enable that the smooth animation, and **false** means the opposite.
Default value: **false**
**NOTE**
Currently, only the **\** component supports this parameter.| | align10+ | [ScrollAlign](#scrollalign10) | No | How the list item to scroll to is aligned with the list.
Default value: **ScrollAlign.START**
**NOTE**
Currently, only the **\** component supports this parameter.| @@ -169,6 +171,22 @@ Scrolls by the specified amount. | dx | Length | Yes | Amount to scroll by in the horizontal direction. The percentage format is not supported.| | dy | Length | Yes | Amount to scroll by in the vertical direction. The percentage format is not supported.| +### isAtEnd10+ + +isAtEnd(): boolean + +Checks whether the component has scrolled to the bottom. + +> **NOTE** +> +> This API is available for the **\**, **\**, **\**, and **\** components. + +**Return value** + +| Type | Description | +| ------- | -------- | +| boolean | The value **true** means that the component has scrolled to the bottom, and **false** means the opposite.| + ## ScrollAlign10+ | Name | Description | @@ -178,11 +196,27 @@ Scrolls by the specified amount. | END | The end edge of the list item is flush with the end edge of the list.| | AUTO | The list item is automatically aligned.
If the list item is fully contained within the display area, no adjustment is performed. Otherwise, the list item is aligned so that its start or end edge is flush with the start or end edge of the list, whichever requires a shorter scrolling distance.| +## NestedScrollOptions10+ +| Name | Type | Description | +| ----- | ------ | ----------------- | +| scrollForward | NestedScrollMode | Nested scrolling option when the component scrolls forward.| +| scrollBackward | NestedScrollMode | Nested scrolling option when the component scrolls backward.| + +## NestedScrollMode10+ +| Name | Description | +| ------ | ------------------------------ | +| SELF_ONLY | The scrolling is contained within the component, and no scroll chaining occurs, that is, the parent component does not scroll when the component scrolling reaches the boundary. | +| SELF_FIRST | The component scrolls first, and when it hits the boundary, the parent component scrolls. When the parent component hits the boundary, its edge effect is displayed. If no edge effect is specified for the parent component, the edge effect of the child component is displayed instead. | +| PARENT_FIRST | The parent component scrolls first, and when it hits the boundary, the component scrolls. When the component hits the boundary, its edge effect is displayed. If no edge effect is specified for the component, the edge effect of the parent component is displayed instead.| +| PARALLEL | The component and its parent component scroll at the same time. When both the component and its parent component hit the boundary, the edge effect of the component is displayed. If no edge effect is specified for the component, the edge effect of the parent component is displayed instead.| + ## Example ### Example 1 ```ts // xxx.ets +import Curves from '@ohos.curves' + @Entry @Component struct ScrollExample { @@ -223,7 +257,7 @@ struct ScrollExample { Button('scroll 150') .height('5%') .onClick(() => { // Click to scroll down to 150.0 vp. - this.scroller.scrollBy(0,150) + this.scroller.scrollBy(0, 150) }) .margin({ top: 10, left: 20 }) Button('scroll 100') @@ -232,24 +266,31 @@ struct ScrollExample { this.scroller.scrollTo({ xOffset: 0, yOffset: this.scroller.currentOffset().yOffset + 100 }) }) .margin({ top: 60, left: 20 }) + Button('scroll 100') + .height('5%') + .onClick(() => {// Click to scroll down by 100.0 vp. An animation is applied to the scrolling. + let curve = Curves.interpolatingSpring(100, 1, 228, 30) // Create a step curve. + this.scroller.scrollTo({ xOffset: 0, yOffset: this.scroller.currentOffset().yOffset + 100, animation: { duration: 1000, curve: curve }}) + }) + .margin({ top: 110, left: 20 }) Button('back top') .height('5%') .onClick(() => { // Click to go back to the top. this.scroller.scrollEdge(Edge.Top) }) - .margin({ top: 110, left: 20 }) + .margin({ top: 160, left: 20 }) Button('next page') .height('5%') .onClick(() => { // Click to go to the next page. this.scroller.scrollPage({ next: true }) }) - .margin({ top: 170, left: 20 }) + .margin({ top: 210, left: 20 }) }.width('100%').height('100%').backgroundColor(0xDCDCDC) } } ``` -![en-us_image_0000001256978363](figures/en-us_image_0000001256978363.gif) +![en-us_image_0000001174104386](figures/en-us_image_0000001174104386.gif) ### Example 2 ```ts @@ -311,3 +352,63 @@ struct NestedScroll { ``` ![NestedScroll](figures/NestedScroll.gif) + +### Example 3 +```ts +@Entry +@Component +struct StickyNestedScroll { + @State message: string = 'Hello World' + @State arr: number[] = [] + + @Styles listCard() { + .backgroundColor(Color.White) + .height(72) + .width("100%") + .borderRadius(12) + } + build() { + Scroll() { + Column() { + Text("Scroll Area") + .width("100%") + .height("40%") + .backgroundColor('#0080DC') + .textAlign(TextAlign.Center) + Tabs({barPosition:BarPosition.Start}) { + TabContent() { + List({space:10}) { + ForEach(this.arr, (item) => { + ListItem() { + Text("item" + item) + .fontSize(16) + }.listCard() + }, item => item) + }.width("100%") + .edgeEffect(EdgeEffect.Spring) + .nestedScroll({ + scrollForward:NestedScrollMode.PARENT_FIRST, + scrollBackward:NestedScrollMode.SELF_FIRST + }) + }.tabBar("Tab1") + TabContent() { + }.tabBar("Tab2") + } + .vertical(false) + .height("100%") + }.width("100%") + } + .edgeEffect(EdgeEffect.Spring) + .backgroundColor('#DCDCDC') + .scrollBar(BarState.Off) + .width('100%') + .height('100%') + } + aboutToAppear() { + for (let i = 0; i < 30; i++) { + this.arr.push(i) + } + } +} +``` +![NestedScroll2](figures/NestedScroll2.gif) diff --git a/en/application-dev/reference/arkui-ts/ts-container-swiper.md b/en/application-dev/reference/arkui-ts/ts-container-swiper.md index 3ebb5c039cfcec05cbe209e7d58a5142a1169c95..52263bc0068469f680c269d4599c281394ca34c9 100644 --- a/en/application-dev/reference/arkui-ts/ts-container-swiper.md +++ b/en/application-dev/reference/arkui-ts/ts-container-swiper.md @@ -50,7 +50,7 @@ In addition to the [universal attributes](ts-universal-attributes-size.md), the | disableSwipe8+ | boolean | Whether to disable the swipe feature.
Default value: **false** | | curve8+ | [Curve](ts-appendix-enums.md#curve) \| string | Animation curve. The ease-in/ease-out curve is used by default. For details about common curves, see [Curve](ts-appendix-enums.md#curve). You can also create custom curves (interpolation curve objects) by using the API provided by the [interpolation calculation](../apis/js-apis-curve.md) module.
Default value: **Curve.Linear**| | indicatorStyle(deprecated) | {
left?: [Length](ts-types.md#length),
top?: [Length](ts-types.md#length),
right?: [Length](ts-types.md#length),
bottom?: [Length](ts-types.md#length),
size?: [Length](ts-types.md#length),
mask?: boolean,
color?: [ResourceColor](ts-types.md),
selectedColor?: [ResourceColor](ts-types.md)
} | Style of the navigation point indicator.
\- **left**: distance between the navigation point indicator and the left edge of the **\** component.
\- **top**: distance between the navigation point indicator and the top edge of the **\** component.
\- **right**: distance between the navigation point indicator and the right edge of the **\** component.
\- **bottom**: distance between the navigation point indicator and the bottom edge of the **\** component.
\- **size**: diameter of the navigation point indicator. The value cannot be in percentage. Default value: **6vp**
\- **mask**: whether to enable the mask for the navigation point indicator.
\- **color**: color of the navigation point indicator.
\- **selectedColor**: color of the selected navigation dot.
This API is supported since API version 8 and is deprecated since API version 10. You are advised to use [indicator](#indicator10) instead.| -| displayCount8+ | number \| string \|
[SwiperAutoFill](#swiperautofill10)10+ | Number of elements to display per page.
Default value: **1**
**NOTE**
If the value is of the string type, it can only be **'auto'**, whose display effect is the same as that of **SwiperDisplayMode.AutoLinear**.
If the value is set to a number less than or equal to 0, the default value **1** is used.
If the value is of the number type, child components stretch (shrink) on the main axis after the swiper width [deducting the result of itemSpace x (displayCount – 1)] is evenly distributed among them on the main axis.
If the value is of the SwiperAutoFill type, the system automatically calculates and changes the number of elements to display per page based on the **\** component width and the **minSize** settings for the child component. If **minSize** is left empty or set to a value less than or equal to 0, the **\** component displays one column.| +| displayCount8+ | number \| string \|
[SwiperAutoFill](#swiperautofill10)10+ | Number of elements to display per page.
Default value: **1**
**NOTE**
If the value is of the string type, it can only be **'auto'**, whose display effect is the same as that of **SwiperDisplayMode.AutoLinear**.
If the value is set to a number less than or equal to 0, the default value **1** is used.
If the value is of the number type, child components stretch (shrink) on the main axis after the swiper width [deducting the result of itemSpace x (displayCount - 1)] is evenly distributed among them on the main axis.
If the value is of the SwiperAutoFill type, the system automatically calculates and changes the number of elements to display per page based on the **\** component width and the **minSize** settings for the child component. If **minSize** is left empty or set to a value less than or equal to 0, the **\** component displays one column.| | effectMode8+ | [EdgeEffect](ts-appendix-enums.md#edgeeffect) | Swipe effect. For details, see **EdgeEffect**.
Default value: **EdgeEffect.Spring**
**NOTE**
The spring effect does not take effect when the controller API is called.| | displayArrow10+ | value:[ArrowStyle](#arrowstyle10) \| boolean,
isHoverShow?: boolean | Arrow style of the navigation point indicator.
- **value**: arrow and background to set. In abnormal scenarios, the default values in the **ArrowStyle** object are used.
\- **isHoverShow**: whether to show the arrow only when the mouse pointer hovers over the navigation point indicator.
Default value: **false**
**NOTE**
When **isHoverShow** is set to **false**, the arrow is always displayed and can be clicked to turn pages.
When **isHoverShow** is set to **true**, the arrow is displayed only when the mouse pointer hovers over the navigation point indicator, and it can be clicked to turn pages.| | nextMargin10+ |
[Length](ts-types.md#length)
| Next margin, used to reveal a small part of the next item.
Default value: **0**
**NOTE**
This attribute is available only when **SwiperDisplayMode** is set to **STRETCH**.
When the main axis runs horizontally and either the next margin or previous margin is greater than the calculated width of the child component, neither the next margin nor previous margin is displayed.
When the main axis runs vertically and either the next margin or previous margin is greater than the calculated height of the child component, neither the next margin nor previous margin is displayed.| @@ -112,8 +112,8 @@ Defines the navigation point indicator of the dot style, which inherits attribut | ------------------ | ---------------------------------------- | ---- | ---------------------------------------- | | itemWidth | [Length](ts-types.md#length) | No | Width of the navigation point indicator of the dot style.
Default value: **6**
Unit: vp| | itemHeight | [Length](ts-types.md#length) | No | Height of the navigation point indicator of the dot style.
Default value: **6**
Unit: vp| -| selectedItemWidth | [Length](ts-types.md#length) | No | Width of the selected indicator dot.
Default value: **6**
Unit: vp| -| selectedItemHeight | [Length](ts-types.md#length) | No | Height of the selected indicator dot.
Default value: **6**
Unit: vp| +| selectedItemWidth | [Length](ts-types.md#length) | No | Width of the selected navigation point indicator of the dot style.
Default value: **6**
Unit: vp| +| selectedItemHeight | [Length](ts-types.md#length) | No | Height of the selected navigation point indicator of the dot style.
Default value: **6**
Unit: vp| | mask | boolean | No | Whether to enable the mask for the navigation point indicator of the dot style.
Default value: **false**| | color | [ResourceColor](ts-types.md#resourcecolor) | No | Color of the navigation point indicator of the dot style.
Default value: **'\#182431'** (10% opacity)| | selectedColor | [ResourceColor](ts-types.md#resourcecolor) | No | Color of the selected indicator dot.
Default value: **'\#007DFF'**| @@ -125,9 +125,9 @@ Defines the navigation point indicator of the digit style, which inherits attrib | Name | Type | Mandatory. | Description | | ----------------- | ---------------------------------------- | ---- | ---------------------------------------- | | fontColor | [ResourceColor](ts-types.md#resourcecolor) | No | Font color of the navigation point indicator of the digit style.
Default value: **'\#ff182431'**| -| selectedFontColor | [ResourceColor](ts-types.md#resourcecolor) | No | Font color of the selected indicator digit.
Default value: **'\#ff182431'**| +| selectedFontColor | [ResourceColor](ts-types.md#resourcecolor) | No | Font color of the selected navigation point indicator of the digit style.
Default value: **'\#ff182431'**| | digitFont | {
size?:[Length](ts-types.md#length)
weight?:number \| [FontWeight](ts-appendix-enums.md#fontweight) \| string
} | No | Font style of the navigation point indicator of the digit style.
\- **size**: font size.
Default value: **14vp**
\- **weight**: font weight.| -| selectedDigitFont | {
size?:[Length](ts-types.md#length)
weight?:number \| [FontWeight](ts-appendix-enums.md#fontweight) \| string
} | No | Font style of the selected indicator digit.
\- **size**: font size.
Default value: **14vp**
\- **weight**: font weight.| +| selectedDigitFont | {
size?:[Length](ts-types.md#length)
weight?:number \| [FontWeight](ts-appendix-enums.md#fontweight) \| string
} | No | Font style of the selected navigation point indicator of the digit style.
\- **size**: font size.
Default value: **14vp**
\- **weight**: font weight.| ## ArrowStyle10+ Describes the left and right arrow attributes. diff --git a/en/application-dev/reference/arkui-ts/ts-container-waterflow.md b/en/application-dev/reference/arkui-ts/ts-container-waterflow.md index 44d2eeda5df735e9f81dbb9713b899cbd66037be..70e392f7164156d01da02d69b9b0e6fdb3f77903 100644 --- a/en/application-dev/reference/arkui-ts/ts-container-waterflow.md +++ b/en/application-dev/reference/arkui-ts/ts-container-waterflow.md @@ -44,6 +44,8 @@ In addition to the [universal attributes](ts-universal-attributes-size.md), the | columnsGap | Length |Gap between columns.
Default value: **0**| | rowsGap | Length |Gap between rows.
Default value: **0**| | layoutDirection | [FlexDirection](ts-appendix-enums.md#flexdirection) |Main axis direction of the layout.
Default value: **FlexDirection.Column**| +| enableScrollInteraction10+ | boolean | Whether to support scroll gestures. When this attribute is set to **false**, scrolling by finger or mouse is not supported, but the scrolling controller API is not affected.
Default value: **true** | +| nestedScroll10+ | [NestedScrollOptions](ts-container-scroll.md#nestedscrolloptions10) | Nested scrolling options. You can set the nested scrolling mode in the forward and backward directions to implement scrolling linkage with the parent component.| The priority of **layoutDirection** is higher than that of **rowsTemplate** and **columnsTemplate**. Depending on the **layoutDirection** settings, there are three layout modes: @@ -68,8 +70,8 @@ In addition to the [universal events](ts-universal-events-click.md), the followi | Name| Description| | -------- | -------- | | onReachStart(event: () => void) | Triggered when the component reaches the start.| -| onReachEnd(event: () => void) | Triggered when the component reaches the end.| - +| onReachEnd(event: () => void) | Triggered when the component reaches the end position.| +| onScrollFrameBegin10+(event: (offset: number, state: ScrollState) => { offsetRemain }) | Triggered when the component starts to scroll. The input parameters indicate the amount by which the component will scroll. The event handler then works out the amount by which the component needs to scroll based on the real-world situation and returns the result.
\- **offset**: amount to scroll by, in vp.
\- **state**: current scrolling state.
- **offsetRemain**: actual amount by which the component scrolls, in vp.
This event is triggered when the user starts dragging the component or the component starts inertial scrolling. This event is not triggered when the component rebounds or the scrolling controller is used.| ## auto-fill diff --git a/en/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md b/en/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md index 1ba996fc0ef670359687c3e94bb6cadf704f92c5..0b61ab7aa573d325cbcc563e584313aebea45085 100644 --- a/en/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md +++ b/en/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md @@ -33,7 +33,7 @@ Since API version 9, this API is supported in ArkTS widgets. | [lineCap](#linecap) | CanvasLineCap | Style of the line endpoints. The options are as follows:
- **butt**: The endpoints of the line are squared off.
- **round**: The endpoints of the line are rounded.
- **square**: The endpoints of the line are squared off, and each endpoint has added a rectangle whose length is the same as the line thickness and whose width is half of the line thickness.
- Default value: **'butt'**
Since API version 9, this API is supported in ArkTS widgets.| | [lineJoin](#linejoin) | CanvasLineJoin | Style of the shape used to join line segments. The options are as follows:
- **round**: The intersection is a sector, whose radius at the rounded corner is equal to the line width.
- **bevel**: The intersection is a triangle. The rectangular corner of each line is independent.
- **miter**: The intersection has a miter corner by extending the outside edges of the lines until they meet. You can view the effect of this attribute in **miterLimit**.
- Default value: **'miter'**
Since API version 9, this API is supported in ArkTS widgets.| | [miterLimit](#miterlimit) | number | Maximum miter length. The miter length is the distance between the inner corner and the outer corner where two lines meet.
- Default value: **10**
Since API version 9, this API is supported in ArkTS widgets.| -| [font](#font) | string | Font style.
Syntax: ctx.font='font-size font-family'
- (Optional) **font-size**: font size and row height. The unit can only be pixels.
(Optional) **font-family**: font family.
Syntax: ctx.font='font-style font-weight font-size font-family'
- (Optional) **font-style**: font style. Available values are **normal** and **italic**.
- (Optional) **font-weight**: font weight. Available values are as follows: **normal**, **bold**, **bolder**, **lighter**, **100**, **200**, **300**, **400**, **500**, **600**, **700**, **800**, **900**.
- (Optional) **font-size**: font size and line height. The unit must be specified and can only be px or vp.
- (Optional) **font-family**: font family. Available values are **sans-serif**, **serif**, and **monospace**.
Default value: **'normal normal 14px sans-serif'**
Since API version 9, this API is supported in ArkTS widgets.| +| [font](#font) | string | Font style.
Syntax: ctx.font='font-size font-family'
- (Optional) **font-size**: font size and line height. The unit can only be pixels.
(Optional) **font-family**: font family.
Syntax: ctx.font='font-style font-weight font-size font-family'
- (Optional) **font-style**: font style. Available values are **normal** and **italic**.
- (Optional) **font-weight**: font weight. Available values are as follows: **normal**, **bold**, **bolder**, **lighter**, **100**, **200**, **300**, **400**, **500**, **600**, **700**, **800**, **900**.
- (Optional) **font-size**: font size and line height. The unit can be px or vp and must be specified.
- (Optional) **font-family**: font family. Available values are **sans-serif**, **serif**, and **monospace**.
Default value: **'normal normal 14px sans-serif'**
Since API version 9, this API is supported in ArkTS widgets.| | [textAlign](#textalign) | CanvasTextAlign | Text alignment mode. Available values are as follows:
- **left**: The text is left-aligned.
- **right**: The text is right-aligned.
- **center**: The text is center-aligned.
- **start**: The text is aligned with the start bound.
- **end**: The text is aligned with the end bound.
**NOTE**

In the **ltr** layout mode, the value **'start'** equals **'left'**. In the **rtl** layout mode, the value **'start'** equals **'right'**.
- Default value: **'left'**
Since API version 9, this API is supported in ArkTS widgets.| | [textBaseline](#textbaseline) | CanvasTextBaseline | Horizontal alignment mode of text. Available values are as follows:
- **alphabetic**: The text baseline is the normal alphabetic baseline.
- **top**: The text baseline is on the top of the text bounding box.
- **hanging**: The text baseline is a hanging baseline over the text.
- **middle**: The text baseline is in the middle of the text bounding box.
**'ideographic'**: The text baseline is the ideographic baseline. If a character exceeds the alphabetic baseline, the ideographic baseline is located at the bottom of the excess character.
- **bottom**: The text baseline is at the bottom of the text bounding box. Its difference from the ideographic baseline is that the ideographic baseline does not consider letters in the next line.
- Default value: **'alphabetic'**
Since API version 9, this API is supported in ArkTS widgets.| | [globalAlpha](#globalalpha) | number | Opacity.
**0.0**: completely transparent.
**1.0**: completely opaque. | @@ -61,7 +61,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct FillStyleExample { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -70,9 +70,41 @@ struct FillStyleExample { .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.fillStyle = '#0000ff' - this.offContext.fillRect(20, 20, 150, 100) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.fillStyle = '#0000ff' + offContext.fillRect(20, 20, 150, 100) + var image = this.offCanvas.transferToImageBitmap() + this.context.transferFromImageBitmap(image) + }) + } + .width('100%') + .height('100%') + } +} +``` + + + +```ts +// xxx.ets +@Entry +@Component +struct FillStyleExample { + private settings: RenderingContextSettings = new RenderingContextSettings(true) + private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) + + build() { + Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { + Canvas(this.context) + .width('100%') + .height('100%') + .backgroundColor('#ffff00') + .onReady(() =>{ + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.fillStyle = 0x0000FF + offContext.fillRect(20, 20, 150, 100) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -94,7 +126,7 @@ struct FillStyleExample { struct LineWidthExample { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -103,9 +135,10 @@ struct LineWidthExample { .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.lineWidth = 5 - this.offContext.strokeRect(25, 25, 85, 105) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.lineWidth = 5 + offContext.strokeRect(25, 25, 85, 105) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -127,7 +160,7 @@ struct LineWidthExample { struct StrokeStyleExample { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -136,10 +169,43 @@ struct StrokeStyleExample { .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.lineWidth = 10 - this.offContext.strokeStyle = '#0000ff' - this.offContext.strokeRect(25, 25, 155, 105) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.lineWidth = 10 + offContext.strokeStyle = '#0000ff' + offContext.strokeRect(25, 25, 155, 105) + var image = this.offCanvas.transferToImageBitmap() + this.context.transferFromImageBitmap(image) + }) + } + .width('100%') + .height('100%') + } +} +``` + + + +```ts +// xxx.ets +@Entry +@Component +struct StrokeStyleExample { + private settings: RenderingContextSettings = new RenderingContextSettings(true) + private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) + + build() { + Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { + Canvas(this.context) + .width('100%') + .height('100%') + .backgroundColor('#ffff00') + .onReady(() =>{ + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.lineWidth = 10 + offContext.strokeStyle = 0x0000ff + offContext.strokeRect(25, 25, 155, 105) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -161,7 +227,7 @@ struct StrokeStyleExample { struct LineCapExample { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -170,13 +236,14 @@ struct LineCapExample { .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.lineWidth = 8 - this.offContext.beginPath() - this.offContext.lineCap = 'round' - this.offContext.moveTo(30, 50) - this.offContext.lineTo(220, 50) - this.offContext.stroke() - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.lineWidth = 8 + offContext.beginPath() + offContext.lineCap = 'round' + offContext.moveTo(30, 50) + offContext.lineTo(220, 50) + offContext.stroke() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -198,7 +265,7 @@ struct LineCapExample { struct LineJoinExample { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -207,14 +274,15 @@ struct LineJoinExample { .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.beginPath() - this.offContext.lineWidth = 8 - this.offContext.lineJoin = 'miter' - this.offContext.moveTo(30, 30) - this.offContext.lineTo(120, 60) - this.offContext.lineTo(30, 110) - this.offContext.stroke() - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.beginPath() + offContext.lineWidth = 8 + offContext.lineJoin = 'miter' + offContext.moveTo(30, 30) + offContext.lineTo(120, 60) + offContext.lineTo(30, 110) + offContext.stroke() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -236,7 +304,7 @@ struct LineJoinExample { struct MiterLimit { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -245,14 +313,15 @@ struct MiterLimit { .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.lineWidth = 8 - this.offContext.lineJoin = 'miter' - this.offContext.miterLimit = 3 - this.offContext.moveTo(30, 30) - this.offContext.lineTo(60, 35) - this.offContext.lineTo(30, 37) - this.offContext.stroke() - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.lineWidth = 8 + offContext.lineJoin = 'miter' + offContext.miterLimit = 3 + offContext.moveTo(30, 30) + offContext.lineTo(60, 35) + offContext.lineTo(30, 37) + offContext.stroke() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -274,7 +343,7 @@ struct MiterLimit { struct Fonts { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -283,9 +352,10 @@ struct Fonts { .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.font = '30px sans-serif' - this.offContext.fillText("Hello World", 20, 60) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.font = '30px sans-serif' + offContext.fillText("Hello World", 20, 60) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -307,7 +377,7 @@ struct Fonts { struct CanvasExample { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -316,24 +386,25 @@ struct CanvasExample { .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.strokeStyle = '#0000ff' - this.offContext.moveTo(140, 10) - this.offContext.lineTo(140, 160) - this.offContext.stroke() - - this.offContext.font = '18px sans-serif' - - this.offContext.textAlign = 'start' - this.offContext.fillText('textAlign=start', 140, 60) - this.offContext.textAlign = 'end' - this.offContext.fillText('textAlign=end', 140, 80) - this.offContext.textAlign = 'left' - this.offContext.fillText('textAlign=left', 140, 100) - this.offContext.textAlign = 'center' - this.offContext.fillText('textAlign=center',140, 120) - this.offContext.textAlign = 'right' - this.offContext.fillText('textAlign=right',140, 140) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.strokeStyle = '#0000ff' + offContext.moveTo(140, 10) + offContext.lineTo(140, 160) + offContext.stroke() + + offContext.font = '18px sans-serif' + + offContext.textAlign = 'start' + offContext.fillText('textAlign=start', 140, 60) + offContext.textAlign = 'end' + offContext.fillText('textAlign=end', 140, 80) + offContext.textAlign = 'left' + offContext.fillText('textAlign=left', 140, 100) + offContext.textAlign = 'center' + offContext.fillText('textAlign=center',140, 120) + offContext.textAlign = 'right' + offContext.fillText('textAlign=right',140, 140) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -355,7 +426,7 @@ struct CanvasExample { struct TextBaseline { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -364,24 +435,25 @@ struct TextBaseline { .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.strokeStyle = '#0000ff' - this.offContext.moveTo(0, 120) - this.offContext.lineTo(400, 120) - this.offContext.stroke() - - this.offContext.font = '20px sans-serif' - - this.offContext.textBaseline = 'top' - this.offContext.fillText('Top', 10, 120) - this.offContext.textBaseline = 'bottom' - this.offContext.fillText('Bottom', 55, 120) - this.offContext.textBaseline = 'middle' - this.offContext.fillText('Middle', 125, 120) - this.offContext.textBaseline = 'alphabetic' - this.offContext.fillText('Alphabetic', 195, 120) - this.offContext.textBaseline = 'hanging' - this.offContext.fillText('Hanging', 295, 120) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.strokeStyle = '#0000ff' + offContext.moveTo(0, 120) + offContext.lineTo(400, 120) + offContext.stroke() + + offContext.font = '20px sans-serif' + + offContext.textBaseline = 'top' + offContext.fillText('Top', 10, 120) + offContext.textBaseline = 'bottom' + offContext.fillText('Bottom', 55, 120) + offContext.textBaseline = 'middle' + offContext.fillText('Middle', 125, 120) + offContext.textBaseline = 'alphabetic' + offContext.fillText('Alphabetic', 195, 120) + offContext.textBaseline = 'hanging' + offContext.fillText('Hanging', 295, 120) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -403,7 +475,7 @@ struct TextBaseline { struct GlobalAlpha { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -412,12 +484,13 @@ struct GlobalAlpha { .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.fillStyle = 'rgb(0,0,255)' - this.offContext.fillRect(0, 0, 50, 50) - this.offContext.globalAlpha = 0.4 - this.offContext.fillStyle = 'rgb(0,0,255)' - this.offContext.fillRect(50, 50, 50, 50) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.fillStyle = 'rgb(0,0,255)' + offContext.fillRect(0, 0, 50, 50) + offContext.globalAlpha = 0.4 + offContext.fillStyle = 'rgb(0,0,255)' + offContext.fillRect(50, 50, 50, 50) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -439,7 +512,7 @@ struct GlobalAlpha { struct LineDashOffset { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -448,11 +521,12 @@ struct LineDashOffset { .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.arc(100, 75, 50, 0, 6.28) - this.offContext.setLineDash([10,20]) - this.offContext.lineDashOffset = 10.0 - this.offContext.stroke() - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.arc(100, 75, 50, 0, 6.28) + offContext.setLineDash([10,20]) + offContext.lineDashOffset = 10.0 + offContext.stroke() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -488,7 +562,7 @@ struct LineDashOffset { struct GlobalCompositeOperation { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -497,17 +571,18 @@ struct GlobalCompositeOperation { .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.fillStyle = 'rgb(255,0,0)' - this.offContext.fillRect(20, 20, 50, 50) - this.offContext.globalCompositeOperation = 'source-over' - this.offContext.fillStyle = 'rgb(0,0,255)' - this.offContext.fillRect(50, 50, 50, 50) - this.offContext.fillStyle = 'rgb(255,0,0)' - this.offContext.fillRect(120, 20, 50, 50) - this.offContext.globalCompositeOperation = 'destination-over' - this.offContext.fillStyle = 'rgb(0,0,255)' - this.offContext.fillRect(150, 50, 50, 50) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.fillStyle = 'rgb(255,0,0)' + offContext.fillRect(20, 20, 50, 50) + offContext.globalCompositeOperation = 'source-over' + offContext.fillStyle = 'rgb(0,0,255)' + offContext.fillRect(50, 50, 50, 50) + offContext.fillStyle = 'rgb(255,0,0)' + offContext.fillRect(120, 20, 50, 50) + offContext.globalCompositeOperation = 'destination-over' + offContext.fillStyle = 'rgb(0,0,255)' + offContext.fillRect(150, 50, 50, 50) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -529,7 +604,7 @@ struct GlobalCompositeOperation { struct ShadowBlur { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -538,11 +613,12 @@ struct ShadowBlur { .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.shadowBlur = 30 - this.offContext.shadowColor = 'rgb(0,0,0)' - this.offContext.fillStyle = 'rgb(255,0,0)' - this.offContext.fillRect(20, 20, 100, 80) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.shadowBlur = 30 + offContext.shadowColor = 'rgb(0,0,0)' + offContext.fillStyle = 'rgb(255,0,0)' + offContext.fillRect(20, 20, 100, 80) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -564,7 +640,7 @@ struct ShadowBlur { struct ShadowColor { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -573,11 +649,12 @@ struct ShadowColor { .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.shadowBlur = 30 - this.offContext.shadowColor = 'rgb(0,0,255)' - this.offContext.fillStyle = 'rgb(255,0,0)' - this.offContext.fillRect(30, 30, 100, 100) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.shadowBlur = 30 + offContext.shadowColor = 'rgb(0,0,255)' + offContext.fillStyle = 'rgb(255,0,0)' + offContext.fillRect(30, 30, 100, 100) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -599,7 +676,7 @@ struct ShadowColor { struct ShadowOffsetX { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -608,12 +685,13 @@ struct ShadowOffsetX { .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.shadowBlur = 10 - this.offContext.shadowOffsetX = 20 - this.offContext.shadowColor = 'rgb(0,0,0)' - this.offContext.fillStyle = 'rgb(255,0,0)' - this.offContext.fillRect(20, 20, 100, 80) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.shadowBlur = 10 + offContext.shadowOffsetX = 20 + offContext.shadowColor = 'rgb(0,0,0)' + offContext.fillStyle = 'rgb(255,0,0)' + offContext.fillRect(20, 20, 100, 80) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -635,7 +713,7 @@ struct ShadowOffsetX { struct ShadowOffsetY { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -644,12 +722,13 @@ struct ShadowOffsetY { .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.shadowBlur = 10 - this.offContext.shadowOffsetY = 20 - this.offContext.shadowColor = 'rgb(0,0,0)' - this.offContext.fillStyle = 'rgb(255,0,0)' - this.offContext.fillRect(30, 30, 100, 100) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.shadowBlur = 10 + offContext.shadowOffsetY = 20 + offContext.shadowColor = 'rgb(0,0,0)' + offContext.fillStyle = 'rgb(255,0,0)' + offContext.fillRect(30, 30, 100, 100) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -672,7 +751,7 @@ struct ImageSmoothingEnabled { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private img:ImageBitmap = new ImageBitmap("common/images/icon.jpg") - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -681,9 +760,10 @@ struct ImageSmoothingEnabled { .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.imageSmoothingEnabled = false - this.offContext.drawImage( this.img,0,0,400,200) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.imageSmoothingEnabled = false + offContext.drawImage(this.img,0,0,400,200) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -725,7 +805,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct FillRect { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -734,8 +814,9 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.fillRect(30,30,100,100) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.fillRect(30,30,100,100) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -774,7 +855,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct StrokeRect { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -783,8 +864,9 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.strokeRect(30, 30, 200, 150) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.strokeRect(30, 30, 200, 150) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -823,7 +905,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct ClearRect { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -832,10 +914,11 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.fillStyle = 'rgb(0,0,255)' - this.offContext.fillRect(20,20,200,200) - this.offContext.clearRect(30,30,150,100) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.fillStyle = 'rgb(0,0,255)' + offContext.fillRect(20,20,200,200) + offContext.clearRect(30,30,150,100) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -874,7 +957,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct FillText { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -883,9 +966,10 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.font = '30px sans-serif' - this.offContext.fillText("Hello World!", 20, 100) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.font = '30px sans-serif' + offContext.fillText("Hello World!", 20, 100) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -924,7 +1008,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct StrokeText { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -933,9 +1017,10 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.font = '55px sans-serif' - this.offContext.strokeText("Hello World!", 20, 60) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.font = '55px sans-serif' + offContext.strokeText("Hello World!", 20, 60) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -995,7 +1080,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct MeasureText { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1004,10 +1089,11 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.font = '50px sans-serif' - this.offContext.fillText("Hello World!", 20, 100) - this.offContext.fillText("width:" + this.context.measureText("Hello World!").width, 20, 200) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.font = '50px sans-serif' + offContext.fillText("Hello World!", 20, 100) + offContext.fillText("width:" + this.context.measureText("Hello World!").width, 20, 200) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -1043,7 +1129,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct Stroke { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1052,13 +1138,14 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.moveTo(25, 25) - this.offContext.lineTo(25, 105) - this.offContext.lineTo(75, 105) - this.offContext.lineTo(75, 25) - this.offContext.strokeStyle = 'rgb(0,0,255)' - this.offContext.stroke() - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.moveTo(25, 25) + offContext.lineTo(25, 105) + offContext.lineTo(75, 105) + offContext.lineTo(75, 25) + offContext.strokeStyle = 'rgb(0,0,255)' + offContext.stroke() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -1088,7 +1175,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct BeginPath { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1097,13 +1184,14 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.beginPath() - this.offContext.lineWidth = 6 - this.offContext.strokeStyle = '#0000ff' - this.offContext.moveTo(15, 80) - this.offContext.lineTo(280, 160) - this.offContext.stroke() - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.beginPath() + offContext.lineWidth = 6 + offContext.strokeStyle = '#0000ff' + offContext.moveTo(15, 80) + offContext.lineTo(280, 160) + offContext.stroke() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -1140,7 +1228,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct MoveTo { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1149,11 +1237,12 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.beginPath() - this.offContext.moveTo(10, 10) - this.offContext.lineTo(280, 160) - this.offContext.stroke() - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.beginPath() + offContext.moveTo(10, 10) + offContext.lineTo(280, 160) + offContext.stroke() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -1190,7 +1279,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct LineTo { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1199,11 +1288,12 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.beginPath() - this.offContext.moveTo(10, 10) - this.offContext.lineTo(280, 160) - this.offContext.stroke() - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.beginPath() + offContext.moveTo(10, 10) + offContext.lineTo(280, 160) + offContext.stroke() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -1233,7 +1323,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct ClosePath { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1242,13 +1332,14 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.beginPath() - this.offContext.moveTo(30, 30) - this.offContext.lineTo(110, 30) - this.offContext.lineTo(70, 90) - this.offContext.closePath() - this.offContext.stroke() - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.beginPath() + offContext.moveTo(30, 30) + offContext.lineTo(110, 30) + offContext.lineTo(70, 90) + offContext.closePath() + offContext.stroke() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -1292,7 +1383,7 @@ Since API version 9, this API is supported in ArkTS widgets. private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private img:ImageBitmap = new ImageBitmap("common/images/icon.jpg") - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1301,10 +1392,11 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - var pattern = this.offContext.createPattern(this.img, 'repeat') - this.offContext.fillStyle = pattern - this.offContext.fillRect(0, 0, 200, 200) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + var pattern = offContext.createPattern(this.img, 'repeat') + offContext.fillStyle = pattern + offContext.fillRect(0, 0, 200, 200) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -1345,7 +1437,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct BezierCurveTo { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1354,11 +1446,12 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.beginPath() - this.offContext.moveTo(10, 10) - this.offContext.bezierCurveTo(20, 100, 200, 100, 200, 20) - this.offContext.stroke() - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.beginPath() + offContext.moveTo(10, 10) + offContext.bezierCurveTo(20, 100, 200, 100, 200, 20) + offContext.stroke() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -1397,7 +1490,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct QuadraticCurveTo { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1406,11 +1499,12 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.beginPath() - this.offContext.moveTo(20, 20) - this.offContext.quadraticCurveTo(100, 100, 200, 20) - this.offContext.stroke() - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.beginPath() + offContext.moveTo(20, 20) + offContext.quadraticCurveTo(100, 100, 200, 20) + offContext.stroke() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -1451,7 +1545,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct Arc { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1460,10 +1554,11 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.beginPath() - this.offContext.arc(100, 75, 50, 0, 6.28) - this.offContext.stroke() - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.beginPath() + offContext.arc(100, 75, 50, 0, 6.28) + offContext.stroke() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -1503,7 +1598,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct ArcTo { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1512,10 +1607,11 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.moveTo(100, 20) - this.offContext.arcTo(150, 20, 150, 70, 50) - this.offContext.stroke() - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.moveTo(100, 20) + offContext.arcTo(150, 20, 150, 70, 50) + offContext.stroke() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -1558,7 +1654,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct CanvasExample { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { Canvas(this.context) @@ -1566,10 +1662,11 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.beginPath() - this.offContext.ellipse(200, 200, 50, 100, Math.PI * 0.25, Math.PI * 0.5, Math.PI * 2) - this.offContext.stroke() - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.beginPath() + offContext.ellipse(200, 200, 50, 100, Math.PI * 0.25, Math.PI * 0.5, Math.PI * 2) + offContext.stroke() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -1608,7 +1705,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct CanvasExample { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1617,9 +1714,10 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.rect(20, 20, 100, 100) // Create a 100*100 rectangle at (20, 20) - this.offContext.stroke() - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.rect(20, 20, 100, 100) // Create a 100*100 rectangle at (20, 20) + offContext.stroke() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -1653,7 +1751,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct Fill { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1662,9 +1760,11 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.rect(20, 20, 100, 100) // Create a 100*100 rectangle at (20, 20) - this.offContext.fill() - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.fillStyle = '#ffffff' + offContext.rect(20, 20, 100, 100) // Create a 100*100 rectangle at (20, 20) + offContext.fill() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -1700,7 +1800,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct Fill { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1709,6 +1809,7 @@ struct Fill { .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ + var offContext = this.offCanvas.getContext("2d", this.settings) let region = new Path2D() region.moveTo(30, 90) region.lineTo(110, 20) @@ -1718,9 +1819,9 @@ struct Fill { region.lineTo(270, 90) region.closePath() // Fill path - this.offContext.fillStyle = '#00ff00' - this.offContext.fill(region, "evenodd") - var image = this.offContext.transferToImageBitmap() + offContext.fillStyle = '#00ff00' + offContext.fill(region, "evenodd") + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -1757,7 +1858,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct Clip { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1766,12 +1867,13 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.rect(0, 0, 100, 200) - this.offContext.stroke() - this.offContext.clip() - this.offContext.fillStyle = "rgb(255,0,0)" - this.offContext.fillRect(0, 0, 200, 200) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.rect(0, 0, 100, 200) + offContext.stroke() + offContext.clip() + offContext.fillStyle = "rgb(255,0,0)" + offContext.fillRect(0, 0, 200, 200) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -1806,7 +1908,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct Clip { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1815,6 +1917,7 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ + var offContext = this.offCanvas.getContext("2d", this.settings) let region = new Path2D() region.moveTo(30, 90) region.lineTo(110, 20) @@ -1823,10 +1926,10 @@ Since API version 9, this API is supported in ArkTS widgets. region.lineTo(190, 20) region.lineTo(270, 90) region.closePath() - this.offContext.clip(region,"evenodd") - this.offContext.fillStyle = "rgb(0,255,0)" - this.offContext.fillRect(0, 0, 600, 600) - var image = this.offContext.transferToImageBitmap() + offContext.clip(region,"evenodd") + offContext.fillStyle = "rgb(0,255,0)" + offContext.fillRect(0, 0, 600, 600) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -1862,7 +1965,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct FilterDemoOff { private settings: RenderingContextSettings = new RenderingContextSettings(true); private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings); - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) private img:ImageBitmap = new ImageBitmap("common/images/example.jpg"); build() { @@ -1872,7 +1975,8 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - let offctx = this.offContext + var offContext = this.offCanvas.getContext("2d", this.settings) + let offctx = offContext let img = this.img offctx.drawImage(img, 0, 0, 100, 100); @@ -1904,7 +2008,7 @@ Since API version 9, this API is supported in ArkTS widgets. offctx.filter = 'blur(5px)'; offctx.drawImage(img, 0, 300, 100, 100); - var image = offctx.transferToImageBitmap() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -1917,20 +2021,6 @@ Since API version 9, this API is supported in ArkTS widgets. ![filterDemo](figures/filterDemo.jpeg) -### getTransform - -getTransform(): Matrix2D - -Obtains the current transformation matrix being applied to the context. This API is a void API. - -Since API version 9, this API is supported in ArkTS widgets. - -**Return value** - -| Type | Description | -| ---------------------------------------- | ----- | -| [Matrix2D](ts-components-canvas-matrix2d.md#Matrix2D) | Matrix object.| - ### resetTransform resetTransform(): void @@ -1956,7 +2046,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct DirectionDemoOff { private settings: RenderingContextSettings = new RenderingContextSettings(true); private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings); - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -1965,7 +2055,8 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - let offctx = this.offContext + var offContext = this.offCanvas.getContext("2d", this.settings) + let offctx = offContext offctx.font = '48px serif'; offctx.textAlign = 'start' offctx.fillText("Hi ltr!", 200, 50); @@ -2010,7 +2101,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct Rotate { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -2019,9 +2110,10 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.rotate(45 * Math.PI / 180) - this.offContext.fillRect(70, 20, 50, 50) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.rotate(45 * Math.PI / 180) + offContext.fillRect(70, 20, 50, 50) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -2058,7 +2150,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct Scale { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -2067,11 +2159,12 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.lineWidth = 3 - this.offContext.strokeRect(30, 30, 50, 50) - this.offContext.scale(2, 2) // Scale to 200% - this.offContext.strokeRect(30, 30, 50, 50) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.lineWidth = 3 + offContext.strokeRect(30, 30, 50, 50) + offContext.scale(2, 2) // Scale to 200% + offContext.strokeRect(30, 30, 50, 50) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -2119,7 +2212,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct Transform { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -2128,15 +2221,16 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.fillStyle = 'rgb(0,0,0)' - this.offContext.fillRect(0, 0, 100, 100) - this.offContext.transform(1, 0.5, -0.5, 1, 10, 10) - this.offContext.fillStyle = 'rgb(255,0,0)' - this.offContext.fillRect(0, 0, 100, 100) - this.offContext.transform(1, 0.5, -0.5, 1, 10, 10) - this.offContext.fillStyle = 'rgb(0,0,255)' - this.offContext.fillRect(0, 0, 100, 100) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.fillStyle = 'rgb(0,0,0)' + offContext.fillRect(0, 0, 100, 100) + offContext.transform(1, 0.5, -0.5, 1, 10, 10) + offContext.fillStyle = 'rgb(255,0,0)' + offContext.fillRect(0, 0, 100, 100) + offContext.transform(1, 0.5, -0.5, 1, 10, 10) + offContext.fillStyle = 'rgb(0,0,255)' + offContext.fillRect(0, 0, 100, 100) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -2177,7 +2271,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct SetTransform { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -2186,12 +2280,13 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.fillStyle = 'rgb(255,0,0)' - this.offContext.fillRect(0, 0, 100, 100) - this.offContext.setTransform(1,0.5, -0.5, 1, 10, 10) - this.offContext.fillStyle = 'rgb(0,0,255)' - this.offContext.fillRect(0, 0, 100, 100) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.fillStyle = 'rgb(255,0,0)' + offContext.fillRect(0, 0, 100, 100) + offContext.setTransform(1,0.5, -0.5, 1, 10, 10) + offContext.fillStyle = 'rgb(0,0,255)' + offContext.fillRect(0, 0, 100, 100) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -2204,6 +2299,86 @@ Since API version 9, this API is supported in ArkTS widgets. ![en-us_image_0000001193872526](figures/en-us_image_0000001193872526.png) +### setTransform + +setTransform(transform?: Matrix2D): void + +Resets the current transformation and creates a new transformation matrix based on the specified **Matrix2D** object. + +Since API version 9, this API is supported in ArkTS widgets. + +**Parameters** + +| Name | Type | Mandatory | Default Value | Description | +| --------- | ---------------------------------------- | ---- | ---- | ----- | +| transform | [Matrix2D](ts-components-canvas-matrix2d.md#Matrix2D) | No | null | Matrix object. | + +### getTransform + +getTransform(): Matrix2D + +Obtains the current transformation matrix being applied to the context. + +Since API version 9, this API is supported in ArkTS widgets. + +**Return value** + +| Type | Description | +| ---------------------------------------- | ----- | +| [Matrix2D](ts-components-canvas-matrix2d.md#Matrix2D) | Matrix object.| + +**Example** + + ```ts + // xxx.ets + @Entry + @Component + struct TransFormDemo { + private settings: RenderingContextSettings = new RenderingContextSettings(true); + private context1: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings); + private offcontext1: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 100, this.settings); + private context2: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings); + private offcontext2: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 100, this.settings); + + build() { + Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { + Text('context1'); + Canvas(this.context1) + .width('230vp') + .height('120vp') + .backgroundColor('#ffff00') + .onReady(() =>{ + this.offcontext1.fillRect(50, 50, 50, 50); + this.offcontext1.setTransform(1.2, Math.PI/8, Math.PI/6, 0.5, 30, -25); + this.offcontext1.fillRect(50, 50, 50, 50); + var image = this.offcontext1.transferToImageBitmap(); + this.context1.transferFromImageBitmap(image); + }) + Text('context2'); + Canvas(this.context2) + .width('230vp') + .height('120vp') + .backgroundColor('#0ffff0') + .onReady(() =>{ + this.offcontext2.fillRect(50, 50, 50, 50); + let storedTransform = this.offcontext1.getTransform(); + console.log("Matrix [scaleX = " + storedTransform.scaleX + ", scaleY = " + storedTransform.scaleY + + ", rotateX = " + storedTransform.rotateX + ", rotateY = " + storedTransform.rotateY + + ", translateX = " + storedTransform.translateX + ", translateY = " + storedTransform.translateY + "]") + this.offcontext2.setTransform(storedTransform); + this.offcontext2.fillRect(50,50,50,50); + var image = this.offcontext2.transferToImageBitmap(); + this.context2.transferFromImageBitmap(image); + }) + } + .width('100%') + .height('100%') + } + } + ``` + + ![en-us_image_0000001219982726.png](figures/en-us_image_0000001219982726.png) + ### translate translate(x: number, y: number): void @@ -2228,7 +2403,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct Translate { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -2237,10 +2412,11 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.fillRect(10, 10, 50, 50) - this.offContext.translate(70, 70) - this.offContext.fillRect(10, 10, 50, 50) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.fillRect(10, 10, 50, 50) + offContext.translate(70, 70) + offContext.fillRect(10, 10, 50, 50) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -2290,7 +2466,7 @@ Since API version 9, this API is supported in ArkTS widgets, except that **Pixel private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) private img:ImageBitmap = new ImageBitmap("common/images/icon.jpg") - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { Canvas(this.context) @@ -2298,8 +2474,9 @@ Since API version 9, this API is supported in ArkTS widgets, except that **Pixel .height('100%') .backgroundColor('#ffff00') .onReady(() => { - this.offContext.drawImage( this.img,0,0,400,200) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.drawImage( this.img,0,0,400,200) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -2422,7 +2599,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct GetImageData { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) private img:ImageBitmap = new ImageBitmap("/common/images/1234.png") build() { @@ -2432,10 +2609,11 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.drawImage(this.img,0,0,130,130) - var imagedata = this.offContext.getImageData(50,50,130,130) - this.offContext.putImageData(imagedata,150,150) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.drawImage(this.img,0,0,130,130) + var imagedata = offContext.getImageData(50,50,130,130) + offContext.putImageData(imagedata,150,150) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -2479,7 +2657,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct PutImageData { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { Canvas(this.context) @@ -2487,15 +2665,16 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - var imageData = this.offContext.createImageData(100, 100) + var offContext = this.offCanvas.getContext("2d", this.settings) + var imageData = offContext.createImageData(100, 100) for (var i = 0; i < imageData.data.length; i += 4) { imageData.data[i + 0] = 255 imageData.data[i + 1] = 0 imageData.data[i + 2] = 255 imageData.data[i + 3] = 255 } - this.offContext.putImageData(imageData, 10, 10) - var image = this.offContext.transferToImageBitmap() + offContext.putImageData(imageData, 10, 10) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -2529,7 +2708,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct SetLineDash { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -2538,10 +2717,11 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.arc(100, 75, 50, 0, 6.28) - this.offContext.setLineDash([10,20]) - this.offContext.stroke() - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.arc(100, 75, 50, 0, 6.28) + offContext.setLineDash([10,20]) + offContext.stroke() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -2577,7 +2757,7 @@ Since API version 9, this API is supported in ArkTS widgets. @State message: string = 'Hello World' private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Row() { Column() { @@ -2586,7 +2766,8 @@ Since API version 9, this API is supported in ArkTS widgets. .fontWeight(FontWeight.Bold) .onClick(()=>{ console.error('before getlinedash clicked') - let res = this.offContext.getLineDash() + var offContext = this.offCanvas.getContext("2d", this.settings) + let res = offContext.getLineDash() console.error(JSON.stringify(res)) }) Canvas(this.context) @@ -2594,11 +2775,12 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() => { - this.offContext.arc(100, 75, 50, 0, 6.28) - this.offContext.setLineDash([10,20]) - this.offContext.stroke() - let res = this.offContext.getLineDash() - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.arc(100, 75, 50, 0, 6.28) + offContext.setLineDash([10,20]) + offContext.stroke() + let res = offContext.getLineDash() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -2642,7 +2824,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct ToDataURL { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -2651,7 +2833,8 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - var dataURL = this.offContext.toDataURL() + var offContext = this.offCanvas.getContext("2d", this.settings) + var dataURL = offContext.toDataURL() }) } .width('100%') @@ -2683,7 +2866,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct ImageSmoothingQualityDemoOff { private settings: RenderingContextSettings = new RenderingContextSettings(true); private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings); - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) private img:ImageBitmap = new ImageBitmap("common/images/example.jpg"); build() { @@ -2693,12 +2876,13 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - let offctx = this.offContext + var offContext = this.offCanvas.getContext("2d", this.settings) + let offctx = offContext offctx.imageSmoothingEnabled = true offctx.imageSmoothingQuality = 'high' offctx.drawImage(this.img, 0, 0, 400, 200) - var image = offctx.transferToImageBitmap() + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -2732,7 +2916,7 @@ Creates an **ImageBitmap** object on the most recently rendered image of the **O struct PutImageData { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -2741,15 +2925,16 @@ Creates an **ImageBitmap** object on the most recently rendered image of the **O .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - var imageData = this.offContext.createImageData(100, 100) + var offContext = this.offCanvas.getContext("2d", this.settings) + var imageData = offContext.createImageData(100, 100) for (var i = 0; i < imageData.data.length; i += 4) { imageData.data[i + 0] = 255 imageData.data[i + 1] = 0 imageData.data[i + 2] = 255 imageData.data[i + 3] = 255 } - this.offContext.putImageData(imageData, 10, 10) - var image = this.offContext.transferToImageBitmap() + offContext.putImageData(imageData, 10, 10) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -2777,7 +2962,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct CanvasExample { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -2786,12 +2971,13 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.save() // save the default state - this.offContext.fillStyle = "#00ff00" - this.offContext.fillRect(20, 20, 100, 100) - this.offContext.restore() // restore to the default state - this.offContext.fillRect(150, 75, 100, 100) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.save() // save the default state + offContext.fillStyle = "#00ff00" + offContext.fillRect(20, 20, 100, 100) + offContext.restore() // restore to the default state + offContext.fillRect(150, 75, 100, 100) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -2820,7 +3006,7 @@ Since API version 9, this API is supported in ArkTS widgets. struct CanvasExample { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -2829,12 +3015,13 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - this.offContext.save() // save the default state - this.offContext.fillStyle = "#00ff00" - this.offContext.fillRect(20, 20, 100, 100) - this.offContext.restore() // restore to the default state - this.offContext.fillRect(150, 75, 100, 100) - var image = this.offContext.transferToImageBitmap() + var offContext = this.offCanvas.getContext("2d", this.settings) + offContext.save() // save the default state + offContext.fillStyle = "#00ff00" + offContext.fillRect(20, 20, 100, 100) + offContext.restore() // restore to the default state + offContext.fillRect(150, 75, 100, 100) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -2872,8 +3059,8 @@ Since API version 9, this API is supported in ArkTS widgets. struct CreateLinearGradient { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { Canvas(this.context) @@ -2881,13 +3068,14 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - var grad = this.offContext.createLinearGradient(50,0, 300,100) + var offContext = this.offCanvas.getContext("2d", this.settings) + var grad = offContext.createLinearGradient(50,0, 300,100) grad.addColorStop(0.0, '#ff0000') grad.addColorStop(0.5, '#ffffff') grad.addColorStop(1.0, '#00ff00') - this.offContext.fillStyle = grad - this.offContext.fillRect(0, 0, 400, 400) - var image = this.offContext.transferToImageBitmap() + offContext.fillStyle = grad + offContext.fillRect(0, 0, 400, 400) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -2928,8 +3116,8 @@ Since API version 9, this API is supported in ArkTS widgets. struct CreateRadialGradient { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { Canvas(this.context) @@ -2937,13 +3125,14 @@ Since API version 9, this API is supported in ArkTS widgets. .height('100%') .backgroundColor('#ffff00') .onReady(() =>{ - var grad = this.offContext.createRadialGradient(200,200,50, 200,200,200) + var offContext = this.offCanvas.getContext("2d", this.settings) + var grad = offContext.createRadialGradient(200,200,50, 200,200,200) grad.addColorStop(0.0, '#ff0000') grad.addColorStop(0.5, '#ffffff') grad.addColorStop(1.0, '#00ff00') - this.offContext.fillStyle = grad - this.offContext.fillRect(0, 0, 440, 440) - var image = this.offContext.transferToImageBitmap() + offContext.fillStyle = grad + offContext.fillRect(0, 0, 440, 440) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } @@ -2978,8 +3167,7 @@ Creates a conic gradient. struct OffscreenCanvasConicGradientPage { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -2988,13 +3176,14 @@ struct OffscreenCanvasConicGradientPage { .height('100%') .backgroundColor('#ffffff') .onReady(() =>{ - var grad = this.offContext.createConicGradient(0, 50, 80) + var offContext = this.offCanvas.getContext("2d", this.settings) + var grad = offContext.createConicGradient(0, 50, 80) grad.addColorStop(0.0, '#ff0000') grad.addColorStop(0.5, '#ffffff') grad.addColorStop(1.0, '#00ff00') - this.offContext.fillStyle = grad - this.offContext.fillRect(0, 30, 100, 100) - var image = this.offContext.transferToImageBitmap() + offContext.fillStyle = grad + offContext.fillRect(0, 30, 100, 100) + var image = this.offCanvas.transferToImageBitmap() this.context.transferFromImageBitmap(image) }) } 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 e0a3bb339e1db622d902737a7f3a1d4f61d2cf64..e43e8f0007c77fc55206ff51a2cc0ecaa7749549 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 @@ -10,8 +10,8 @@ You can customize the page entrance and exit animations in the **pageTransition* | 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**
- **duration**: animation duration.
Unit: ms
Default value: **1000**
- **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.
Unit: ms
Default value: **0**
**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**.| -| 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**
- **duration**: animation duration.
Unit: ms
Default value: **1000**
- **curve**: animation curve. The value range of the string type is the same as that of **PageTransitionEnter**.
Default value: **Curve.Linear**
- **delay**: animation delay.
Unit: ms
Default value: **0**
**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**.| +| PageTransitionEnter | {
type?: RouteType,
duration?: number,
curve?: [Curve](ts-appendix-enums.md#curve) \| string \| [ICurve](../apis/js-apis-curve.md#icurve)10+,
delay?: number
} | No | Page entrance animation.
- **type**: route type for the page transition effect to take effect.
Default value: **RouteType.None**
- **duration**: animation duration.
Unit: ms
Default value: **1000**
- **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.
Unit: ms
Default value: **0**
**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**.| +| PageTransitionExit | {
type?: RouteType,
duration?: number,
curve?: [Curve](ts-appendix-enums.md#curve) \| string \| [ICurve](../apis/js-apis-curve.md#icurve)10+,
delay?: number
} | No | Page exit animation.
- **type**: route type for the page transition effect to take effect.
Default value: **RouteType.None**
- **duration**: animation duration.
Unit: ms
Default value: **1000**
- **curve**: animation curve. The value range of the string type is the same as that of **PageTransitionEnter**.
Default value: **Curve.Linear**
- **delay**: animation delay.
Unit: ms
Default value: **0**
**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**.| ## RouteType 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 c741d2973743543c25e430e7575c8162053780bf..d37a8923e07eb70eee30e748dd3002cc0edbc7c2 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 @@ -12,7 +12,7 @@ A shared element transition is a transition animation applied to a component tha | 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.
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 default value **1000**.
- **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.| +| sharedTransition | id: string,
{
duration?: number,
curve?: [Curve](ts-appendix-enums.md#curve) \| string \| [ICurve](../apis/js-apis-curve.md#icurve)10+,
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 default value **1000**.
- **curve**: animation curve. The default curve is **Curve.Linear**.
- **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 diff --git a/en/application-dev/reference/native-apis/Readme-EN.md b/en/application-dev/reference/native-apis/Readme-EN.md index 7df15ff27960734f7d9386bdcf807d6cb6d9ecc5..e9198c7331b2ab1709da5917799cf88999903bb9 100644 --- a/en/application-dev/reference/native-apis/Readme-EN.md +++ b/en/application-dev/reference/native-apis/Readme-EN.md @@ -48,6 +48,7 @@ - [native_buffer.h](native__buffer_8h.md) - [native_image.h](native__image_8h.md) - [native_interface_xcomponent.h](native__interface__xcomponent_8h.md) + - [native_xcomponent_key_event.h](native__xcomponent__key__event_8h.md) - [native_vsync.h](native__vsync_8h.md) - [raw_dir.h](raw__dir_8h.md) - [raw_file_manager.h](raw__file__manager_8h.md) diff --git a/en/application-dev/reference/native-apis/_o_h___native_x_component.md b/en/application-dev/reference/native-apis/_o_h___native_x_component.md index 37dd107c618fdd0f6ce9ce2f2e786387c407373d..9f9ceb24f000c898e0ad802f0df1f07a529ce681 100644 --- a/en/application-dev/reference/native-apis/_o_h___native_x_component.md +++ b/en/application-dev/reference/native-apis/_o_h___native_x_component.md @@ -3,117 +3,131 @@ ## Overview -Describes the surface and touch event held by the ArkUI XComponent, which can be used for the EGL/OpenGL ES and media data input and displayed on the ArkUI XComponent. +Describes the surface and touch event held by the ArkUI XComponent, which can be used for the EGL/OpenGL ES and media data input and displayed on the ArkUI XComponent. For details, see [XComponent Development](../../napi/xcomponent-guidelines.md) +**Since** -**Since:** 8 + ## Summary ### Files -| Name | Description | -| -------- | -------- | -| [native_interface_xcomponent.h](native__interface__xcomponent_8h.md) | Declare the APIs used to access the native XComponent.
File to Include: | +| Name | Description | +| ---------------------------------------- | ---------------------------------------- | +| [native_interface_xcomponent.h](native__interface__xcomponent_8h.md) | Declares the APIs for accessing **NativeXComponent**.
File to include: <ace/xcomponent/native_interface_xcomponent.h> | +| [native_xcomponent_key_event.h](native__xcomponent__key__event_8h.md) | Declares the enums used to access **NativeXComponent** key events.
File to include: <ace/xcomponent/native_xcomponent_key_event.h> | ### Structs -| Name | Description | -| -------- | -------- | -| [OH_NativeXComponent_TouchPoint](_o_h___native_x_component___touch_point.md) | Describes the touch point of the touch event. | -| [OH_NativeXComponent_TouchEvent](_o_h___native_x_component___touch_event.md) | Describes the touch event. | -| [OH_NativeXComponent_MouseEvent](_o_h___native_x_component___mouse_event.md) | Describes the mouse event. | -| [OH_NativeXComponent_Callback](_o_h___native_x_component___callback.md) | Registers a callback for the surface lifecycle and touch event. | -| [OH_NativeXComponent_MouseEvent_Callback](_o_h___native_x_component___mouse_event___callback.md) | Registers a callback for the mouse event. | +| Name | Description | +| ---------------------------------------- | --------------------- | +| [OH_NativeXComponent_TouchPoint](_o_h___native_x_component___touch_point.md) | Describes the touch point of the touch event. | +| [OH_NativeXComponent_TouchEvent](_o_h___native_x_component___touch_event.md) | Describes the touch event. | +| [OH_NativeXComponent_MouseEvent](_o_h___native_x_component___mouse_event.md) | Describes the mouse event. | +| [OH_NativeXComponent_Callback](_o_h___native_x_component___callback.md) | Registers callbacks for the surface lifecycle and touch event.| +| [OH_NativeXComponent_MouseEvent_Callback](_o_h___native_x_component___mouse_event___callback.md) | Registers callbacks for the mouse event. | ### Types -| Name | Description | -| -------- | -------- | -| [OH_NativeXComponent](#oh_nativexcomponent) | Provides an encapsulated OH_NativeXComponent instance. | -| [OH_NativeXComponent_Callback](#oh_nativexcomponent_callback) | Registers a callback for the surface lifecycle and touch event. | -| [OH_NativeXComponent_MouseEvent_Callback](#oh_nativexcomponent_mouseevent_callback) | Registers a callback for the mouse event. | +| Name | Description | +| ---------------------------------------- | ------------------------------------ | +| [OH_NativeXComponent](#oh_nativexcomponent) | Provides an encapsulated **OH_NativeXComponent** instance. | +| [OH_NativeXComponent_Callback](#oh_nativexcomponent_callback) | Registers callbacks for the surface lifecycle and touch event. | +| [OH_NativeXComponent_MouseEvent_Callback](#oh_nativexcomponent_mouseevent_callback) | Registers callbacks for the mouse event. | +| [OH_NativeXComponent_KeyEvent](#oh_nativexcomponent_keyevent) | Provides an encapsulated **OH_NativeXComponent_KeyEvent** instance.| ### Enums -| Name | Description | -| -------- | -------- | -| {OH_NATIVEXCOMPONENT_RESULT_SUCCESS = 0,
OH_NATIVEXCOMPONENT_RESULT_FAILED = -1,
OH_NATIVEXCOMPONENT_RESULT_BAD_PARAMETER = -2 } | [Enumerates](#anonymous-enum) the API access states. | -| [OH_NativeXComponent_TouchEventType](#oh_nativexcomponent_toucheventtype) {
OH_NATIVEXCOMPONENT_DOWN = 0,
OH_NATIVEXCOMPONENT_UP,
OH_NATIVEXCOMPONENT_MOVE,
OH_NATIVEXCOMPONENT_CANCEL,
OH_NATIVEXCOMPONENT_UNKNOWN } | Enumerates the touch event types. | -| [OH_NativeXComponent_TouchPointToolType](#oh_nativexcomponent_touchpointtooltype) {
OH_NATIVEXCOMPONENT_TOOL_TYPE_UNKNOWN = 0,
OH_NATIVEXCOMPONENT_TOOL_TYPE_FINGER,
OH_NATIVEXCOMPONENT_TOOL_TYPE_PEN,
OH_NATIVEXCOMPONENT_TOOL_TYPE_RUBBER,
OH_NATIVEXCOMPONENT_TOOL_TYPE_BRUSH,
OH_NATIVEXCOMPONENT_TOOL_TYPE_PENCIL,
OH_NATIVEXCOMPONENT_TOOL_TYPE_AIRBRUSH,
OH_NATIVEXCOMPONENT_TOOL_TYPE_MOUSE,
OH_NATIVEXCOMPONENT_TOOL_TYPE_LENS } | Enumerates the contact point tool types. | -| [OH_NativeXComponent_EventSourceType](#oh_nativexcomponent_eventsourcetype) {
OH_NATIVEXCOMPONENT_SOURCE_TYPE_UNKNOWN = 0,
OH_NATIVEXCOMPONENT_SOURCE_TYPE_MOUSE, OH_NATIVEXCOMPONENT_SOURCE_TYPE_TOUCHSCREEN,
OH_NATIVEXCOMPONENT_SOURCE_TYPE_TOUCHPAD,
OH_NATIVEXCOMPONENT_SOURCE_TYPE_JOYSTICK} | Enumerates the source types of the touch event. | -| [OH_NativeXComponent_MouseEventAction](#oh_nativexcomponent_mouseeventaction) {
OH_NATIVEXCOMPONENT_MOUSE_NONE = 0,
OH_NATIVEXCOMPONENT_MOUSE_PRESS,
OH_NATIVEXCOMPONENT_MOUSE_RELEASE,
OH_NATIVEXCOMPONENT_MOUSE_MOVE } | Enumerates the mouse event actions. | -| [OH_NativeXComponent_MouseEventButton](#oh_nativexcomponent_mouseeventbutton) {
OH_NATIVEXCOMPONENT_NONE_BUTTON = 0,
OH_NATIVEXCOMPONENT_LEFT_BUTTON = 0x01,
OH_NATIVEXCOMPONENT_RIGHT_BUTTON = 0x02,
OH_NATIVEXCOMPONENT_MIDDLE_BUTTON = 0x04,
OH_NATIVEXCOMPONENT_BACK_BUTTON = 0x08,
OH_NATIVEXCOMPONENT_FORWARD_BUTTON = 0x10 } | Enumerates the mouse event buttons. | +| Name | Description | +| ---------------------------------------- | ---------- | +| { OH_NATIVEXCOMPONENT_RESULT_SUCCESS = 0, OH_NATIVEXCOMPONENT_RESULT_FAILED = -1, OH_NATIVEXCOMPONENT_RESULT_BAD_PARAMETER = -2 } | Enumerates the API access states.| +| [OH_NativeXComponent_TouchEventType](#oh_nativexcomponent_toucheventtype) {
OH_NATIVEXCOMPONENT_DOWN = 0, OH_NATIVEXCOMPONENT_UP, OH_NATIVEXCOMPONENT_MOVE, OH_NATIVEXCOMPONENT_CANCEL,
OH_NATIVEXCOMPONENT_UNKNOWN
} | Enumerates the touch event types. | +| [OH_NativeXComponent_TouchPointToolType](#oh_nativexcomponent_touchpointtooltype) {
OH_NATIVEXCOMPONENT_TOOL_TYPE_UNKNOWN = 0, OH_NATIVEXCOMPONENT_TOOL_TYPE_FINGER, OH_NATIVEXCOMPONENT_TOOL_TYPE_PEN, OH_NATIVEXCOMPONENT_TOOL_TYPE_RUBBER,
OH_NATIVEXCOMPONENT_TOOL_TYPE_BRUSH, OH_NATIVEXCOMPONENT_TOOL_TYPE_PENCIL, OH_NATIVEXCOMPONENT_TOOL_TYPE_AIRBRUSH, OH_NATIVEXCOMPONENT_TOOL_TYPE_MOUSE,
OH_NATIVEXCOMPONENT_TOOL_TYPE_LENS
} | Enumerates the touch point tool types. | +| [OH_NativeXComponent_EventSourceType](#oh_nativexcomponent_eventsourcetype) {
OH_NATIVEXCOMPONENT_SOURCE_TYPE_UNKNOWN = 0, OH_NATIVEXCOMPONENT_SOURCE_TYPE_MOUSE, OH_NATIVEXCOMPONENT_SOURCE_TYPE_TOUCHSCREEN, OH_NATIVEXCOMPONENT_SOURCE_TYPE_TOUCHPAD,
OH_NATIVEXCOMPONENT_SOURCE_TYPE_JOYSTICK, OH_NATIVEXCOMPONENT_SOURCE_TYPE_KEYBOARD
} | Enumerates the touch event source types. | +| [OH_NativeXComponent_MouseEventAction](#oh_nativexcomponent_mouseeventaction) { OH_NATIVEXCOMPONENT_MOUSE_NONE = 0, OH_NATIVEXCOMPONENT_MOUSE_PRESS, OH_NATIVEXCOMPONENT_MOUSE_RELEASE, OH_NATIVEXCOMPONENT_MOUSE_MOVE } | Enumerates the mouse event actions. | +| [OH_NativeXComponent_MouseEventButton](#oh_nativexcomponent_mouseeventbutton) {
OH_NATIVEXCOMPONENT_NONE_BUTTON = 0, OH_NATIVEXCOMPONENT_LEFT_BUTTON = 0x01, OH_NATIVEXCOMPONENT_RIGHT_BUTTON = 0x02, OH_NATIVEXCOMPONENT_MIDDLE_BUTTON = 0x04,
OH_NATIVEXCOMPONENT_BACK_BUTTON = 0x08, OH_NATIVEXCOMPONENT_FORWARD_BUTTON = 0x10
} | Enumerates the mouse event buttons. | +| [OH_NativeXComponent_KeyCode](#oh_nativexcomponent_keycode) {
KEY_UNKNOWN = -1, KEY_FN = 0, KEY_HOME = 1, KEY_BACK = 2,KEY_MEDIA_PLAY_PAUSE = 10, KEY_MEDIA_STOP = 11, KEY_MEDIA_NEXT = 12, KEY_MEDIA_PREVIOUS = 13,
KEY_MEDIA_REWIND = 14, KEY_MEDIA_FAST_FORWARD = 15, KEY_VOLUME_UP = 16, KEY_VOLUME_DOWN = 17,
KEY_POWER = 18, KEY_CAMERA = 19, KEY_VOLUME_MUTE = 22, KEY_MUTE = 23,KEY_BRIGHTNESS_UP = 40, KEY_BRIGHTNESS_DOWN = 41, KEY_0 = 2000, KEY_1 = 2001,
KEY_2 = 2002, KEY_3 = 2003, KEY_4 = 2004, KEY_5 = 2005,
KEY_6 = 2006, KEY_7 = 2007, KEY_8 = 2008, KEY_9 = 2009,
KEY_STAR = 2010, KEY_POUND = 2011, KEY_DPAD_UP = 2012, KEY_DPAD_DOWN = 2013,KEY_DPAD_LEFT = 2014, KEY_DPAD_RIGHT = 2015, KEY_DPAD_CENTER = 2016,
KEY_A = 2017,
KEY_B = 2018, KEY_C = 2019, KEY_D = 2020, KEY_E = 2021,
KEY_F = 2022, KEY_G = 2023, KEY_H = 2024, KEY_I = 2025,
KEY_J = 2026, KEY_K = 2027, KEY_L = 2028, KEY_M = 2029,
KEY_N = 2030, KEY_O = 2031, KEY_P = 2032, KEY_Q = 2033,
KEY_R = 2034, KEY_S = 2035, KEY_T = 2036, KEY_U = 2037,
KEY_V = 2038, KEY_W = 2039, KEY_X = 2040, KEY_Y = 2041,
KEY_Z = 2042, KEY_COMMA = 2043, KEY_PERIOD = 2044, KEY_ALT_LEFT = 2045,
KEY_ALT_RIGHT = 2046, KEY_SHIFT_LEFT = 2047, KEY_SHIFT_RIGHT = 2048, KEY_TAB = 2049,
KEY_SPACE = 2050, KEY_SYM = 2051, KEY_EXPLORER = 2052, KEY_ENVELOPE = 2053,
KEY_ENTER = 2054, KEY_DEL = 2055, KEY_GRAVE = 2056, KEY_MINUS = 2057,
KEY_EQUALS = 2058, KEY_LEFT_BRACKET = 2059, KEY_RIGHT_BRACKET = 2060, KEY_BACKSLASH = 2061,
KEY_SEMICOLON = 2062, KEY_APOSTROPHE = 2063, KEY_SLASH = 2064, KEY_AT = 2065,
KEY_PLUS = 2066, KEY_MENU = 2067, KEY_PAGE_UP = 2068, KEY_PAGE_DOWN = 2069,
KEY_ESCAPE = 2070, KEY_FORWARD_DEL = 2071, KEY_CTRL_LEFT = 2072, KEY_CTRL_RIGHT = 2073,
KEY_CAPS_LOCK = 2074, KEY_SCROLL_LOCK = 2075, KEY_META_LEFT = 2076, KEY_META_RIGHT = 2077,
KEY_FUNCTION = 2078, KEY_SYSRQ = 2079, KEY_BREAK = 2080, KEY_MOVE_HOME = 2081,
KEY_MOVE_END = 2082, KEY_INSERT = 2083, KEY_FORWARD = 2084, KEY_MEDIA_PLAY = 2085,
KEY_MEDIA_PAUSE = 2086, KEY_MEDIA_CLOSE = 2087, KEY_MEDIA_EJECT = 2088, KEY_MEDIA_RECORD = 2089,
KEY_F1 = 2090, KEY_F2 = 2091, KEY_F3 = 2092, KEY_F4 = 2093,
KEY_F5 = 2094, KEY_F6 = 2095, KEY_F7 = 2096, KEY_F8 = 2097,
KEY_F9 = 2098, KEY_F10 = 2099, KEY_F11 = 2100, KEY_F12 = 2101,
KEY_NUM_LOCK = 2102, KEY_NUMPAD_0 = 2103, KEY_NUMPAD_1 = 2104, KEY_NUMPAD_2 = 2105,
KEY_NUMPAD_3 = 2106, KEY_NUMPAD_4 = 2107, KEY_NUMPAD_5 = 2108, KEY_NUMPAD_6 = 2109,
KEY_NUMPAD_7 = 2110, KEY_NUMPAD_8 = 2111, KEY_NUMPAD_9 = 2112, KEY_NUMPAD_DIVIDE = 2113,
KEY_NUMPAD_MULTIPLY = 2114, KEY_NUMPAD_SUBTRACT = 2115, KEY_NUMPAD_ADD = 2116, KEY_NUMPAD_DOT = 2117,
KEY_NUMPAD_COMMA = 2118, KEY_NUMPAD_ENTER = 2119, KEY_NUMPAD_EQUALS = 2120, KEY_NUMPAD_LEFT_PAREN = 2121,
KEY_NUMPAD_RIGHT_PAREN = 2122, KEY_VIRTUAL_MULTITASK = 2210, KEY_SLEEP = 2600, KEY_ZENKAKU_HANKAKU = 2601,
KEY_102ND = 2602, KEY_RO = 2603, KEY_KATAKANA = 2604, KEY_HIRAGANA = 2605,
KEY_HENKAN = 2606, KEY_KATAKANA_HIRAGANA = 2607, KEY_MUHENKAN = 2608, KEY_LINEFEED = 2609,
KEY_MACRO = 2610, KEY_NUMPAD_PLUSMINUS = 2611, KEY_SCALE = 2612, KEY_HANGUEL = 2613,
KEY_HANJA = 2614, KEY_YEN = 2615, KEY_STOP = 2616, KEY_AGAIN = 2617,
KEY_PROPS = 2618, KEY_UNDO = 2619, KEY_COPY = 2620, KEY_OPEN = 2621,
KEY_PASTE = 2622, KEY_FIND = 2623, KEY_CUT = 2624, KEY_HELP = 2625,
KEY_CALC = 2626, KEY_FILE = 2627, KEY_BOOKMARKS = 2628, KEY_NEXT = 2629,
KEY_PLAYPAUSE = 2630, KEY_PREVIOUS = 2631, KEY_STOPCD = 2632, KEY_CONFIG = 2634,
KEY_REFRESH = 2635, KEY_EXIT = 2636, KEY_EDIT = 2637, KEY_SCROLLUP = 2638,
KEY_SCROLLDOWN = 2639, KEY_NEW = 2640, KEY_REDO = 2641, KEY_CLOSE = 2642,
KEY_PLAY = 2643, KEY_BASSBOOST = 2644, KEY_PRINT = 2645, KEY_CHAT = 2646,
KEY_FINANCE = 2647, KEY_CANCEL = 2648, KEY_KBDILLUM_TOGGLE = 2649, KEY_KBDILLUM_DOWN = 2650,
KEY_KBDILLUM_UP = 2651, KEY_SEND = 2652, KEY_REPLY = 2653, KEY_FORWARDMAIL = 2654,
KEY_SAVE = 2655, KEY_DOCUMENTS = 2656, KEY_VIDEO_NEXT = 2657, KEY_VIDEO_PREV = 2658,
KEY_BRIGHTNESS_CYCLE = 2659, KEY_BRIGHTNESS_ZERO = 2660, KEY_DISPLAY_OFF = 2661, KEY_BTN_MISC = 2662,
KEY_GOTO = 2663, KEY_INFO = 2664, KEY_PROGRAM = 2665, KEY_PVR = 2666,
KEY_SUBTITLE = 2667, KEY_FULL_SCREEN = 2668, KEY_KEYBOARD = 2669, KEY_ASPECT_RATIO = 2670,
KEY_PC = 2671, KEY_TV = 2672, KEY_TV2 = 2673, KEY_VCR = 2674,
KEY_VCR2 = 2675, KEY_SAT = 2676, KEY_CD = 2677, KEY_TAPE = 2678,
KEY_TUNER = 2679, KEY_PLAYER = 2680, KEY_DVD = 2681, KEY_AUDIO = 2682,
KEY_VIDEO = 2683, KEY_MEMO = 2684, KEY_CALENDAR = 2685, KEY_RED = 2686,
KEY_GREEN = 2687, KEY_YELLOW = 2688, KEY_BLUE = 2689, KEY_CHANNELUP = 2690,
KEY_CHANNELDOWN = 2691, KEY_LAST = 2692, KEY_RESTART = 2693, KEY_SLOW = 2694,
KEY_SHUFFLE = 2695, KEY_VIDEOPHONE = 2696, KEY_GAMES = 2697, KEY_ZOOMIN = 2698,
KEY_ZOOMOUT = 2699, KEY_ZOOMRESET = 2700, KEY_WORDPROCESSOR = 2701, KEY_EDITOR = 2702,
KEY_SPREADSHEET = 2703, KEY_GRAPHICSEDITOR = 2704, KEY_PRESENTATION = 2705, KEY_DATABASE = 2706,
KEY_NEWS = 2707, KEY_VOICEMAIL = 2708, KEY_ADDRESSBOOK = 2709, KEY_MESSENGER = 2710,
KEY_BRIGHTNESS_TOGGLE = 2711, KEY_SPELLCHECK = 2712, KEY_COFFEE = 2713, KEY_MEDIA_REPEAT = 2714,
KEY_IMAGES = 2715, KEY_BUTTONCONFIG = 2716, KEY_TASKMANAGER = 2717, KEY_JOURNAL = 2718,
KEY_CONTROLPANEL = 2719, KEY_APPSELECT = 2720, KEY_SCREENSAVER = 2721, KEY_ASSISTANT = 2722,
KEY_KBD_LAYOUT_NEXT = 2723, KEY_BRIGHTNESS_MIN = 2724, KEY_BRIGHTNESS_MAX = 2725, KEY_KBDINPUTASSIST_PREV = 2726,
KEY_KBDINPUTASSIST_NEXT = 2727, KEY_KBDINPUTASSIST_PREVGROUP = 2728, KEY_KBDINPUTASSIST_NEXTGROUP = 2729, KEY_KBDINPUTASSIST_ACCEPT = 2730,
KEY_KBDINPUTASSIST_CANCEL = 2731, KEY_FRONT = 2800, KEY_SETUP = 2801, KEY_WAKEUP = 2802,
KEY_SENDFILE = 2803, KEY_DELETEFILE = 2804, KEY_XFER = 2805, KEY_PROG1 = 2806,
KEY_PROG2 = 2807, KEY_MSDOS = 2808, KEY_SCREENLOCK = 2809, KEY_DIRECTION_ROTATE_DISPLAY = 2810,
KEY_CYCLEWINDOWS = 2811, KEY_COMPUTER = 2812, KEY_EJECTCLOSECD = 2813, KEY_ISO = 2814,
KEY_MOVE = 2815, KEY_F13 = 2816, KEY_F14 = 2817, KEY_F15 = 2818,
KEY_F16 = 2819, KEY_F17 = 2820, KEY_F18 = 2821, KEY_F19 = 2822,
KEY_F20 = 2823, KEY_F21 = 2824, KEY_F22 = 2825, KEY_F23 = 2826,
KEY_F24 = 2827, KEY_PROG3 = 2828, KEY_PROG4 = 2829, KEY_DASHBOARD = 2830,
KEY_SUSPEND = 2831, KEY_HP = 2832, KEY_SOUND = 2833, KEY_QUESTION = 2834,
KEY_CONNECT = 2836, KEY_SPORT = 2837, KEY_SHOP = 2838, KEY_ALTERASE = 2839,
KEY_SWITCHVIDEOMODE = 2841, KEY_BATTERY = 2842, KEY_BLUETOOTH = 2843, KEY_WLAN = 2844,
KEY_UWB = 2845, KEY_WWAN_WIMAX = 2846, KEY_RFKILL = 2847, KEY_CHANNEL = 3001,
KEY_BTN_0 = 3100, KEY_BTN_1 = 3101, KEY_BTN_2 = 3102, KEY_BTN_3 = 3103,
KEY_BTN_4 = 3104, KEY_BTN_5 = 3105, KEY_BTN_6 = 3106, KEY_BTN_7 = 3107,
KEY_BTN_8 = 3108, KEY_BTN_9 = 3109
} | Enumerates the mouse event key codes. | +| [OH_NativeXComponent_KeyAction](#oh_nativexcomponent_keyaction) { OH_NATIVEXCOMPONENT_KEY_ACTION_UNKNOWN = -1, OH_NATIVEXCOMPONENT_KEY_ACTION_DOWN = 0, OH_NATIVEXCOMPONENT_KEY_ACTION_UP } | Enumerates the key event actions. | ### Functions -| Name | Description | -| -------- | -------- | -| [OH_NativeXComponent_GetXComponentId](#oh_nativexcomponent_getxcomponentid) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, char \*id, uint64_t \*size) | Obtains the ID of the ArkUI XComponent. | -| [OH_NativeXComponent_GetXComponentSize](#oh_nativexcomponent_getxcomponentsize) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, const void \*window, uint64_t \*width, uint64_t \*height) | Obtains the size of the surface held by the ArkUI XComponent. | -| [OH_NativeXComponent_GetXComponentOffset](#oh_nativexcomponent_getxcomponentoffset) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, const void \*window, double \*x, double \*y) | Obtains the offset of the ArkUI XComponent relative to the upper left vertex of the screen. | -| [OH_NativeXComponent_GetTouchEvent](#oh_nativexcomponent_gettouchevent) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, const void \*window, [OH_NativeXComponent_TouchEvent](_o_h___native_x_component___touch_event.md) \*touchEvent) | Obtains the touch event scheduled by the ArkUI XComponent. | -| [OH_NativeXComponent_GetTouchPointToolType](#oh_nativexcomponent_gettouchpointtooltype) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, uint32_t pointIndex, [OH_NativeXComponent_TouchPointToolType](#oh_nativexcomponent_touchpointtooltype) \*toolType) | Obtains the ArkUI XComponent touch point tool type. | -| [OH_NativeXComponent_GetTouchPointTiltX](#oh_nativexcomponent_gettouchpointtiltx) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, uint32_t pointIndex, float \*tiltX) | Obtains the angle between the tilt of the ArkUI XComponent touch point and the x-axis. | -| [OH_NativeXComponent_GetTouchPointTiltY](#oh_nativexcomponent_gettouchpointtilty) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, uint32_t pointIndex, float \*tiltY) | Obtains the angle between the tilt of the ArkUI XComponent touch point and the y-axis. | -| [OH_NativeXComponent_GetMouseEvent](#oh_nativexcomponent_getmouseevent) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, const void \*window, [OH_NativeXComponent_MouseEvent](_o_h___native_x_component___mouse_event.md) \*mouseEvent) | Obtains the mouse event scheduled by ArkUI XComponent. | -| [OH_NativeXComponent_RegisterCallback](#oh_nativexcomponent_registercallback) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, [OH_NativeXComponent_Callback](_o_h___native_x_component___callback.md) \*callback) | Registers a callback for this **OH_NativeXComponent** instance. | -| [OH_NativeXComponent_RegisterMouseEventCallback](#oh_nativexcomponent_registermouseeventcallback) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, [OH_NativeXComponent_MouseEvent_Callback](_o_h___native_x_component___mouse_event___callback.md) \*callback) | Registers a mouse event callback for this **OH_NativeXComponent** instance. | +| Name | Description | +| ---------------------------------------- | -------------------------------------- | +| [OH_NativeXComponent_GetXComponentId](#oh_nativexcomponent_getxcomponentid) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, char \*id, uint64_t \*size) | Obtains the ID of the ArkUI XComponent. | +| [OH_NativeXComponent_GetXComponentSize](#oh_nativexcomponent_getxcomponentsize) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, const void \*window, uint64_t \*width, uint64_t \*height) | Obtains the size of the surface held by the ArkUI XComponent. | +| [OH_NativeXComponent_GetXComponentOffset](#oh_nativexcomponent_getxcomponentoffset) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, const void \*window, double \*x, double \*y) | Obtains the offset of the ArkUI XComponent relative to the upper left vertex of the screen.| +| [OH_NativeXComponent_GetTouchEvent](#oh_nativexcomponent_gettouchevent) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, const void \*window, [OH_NativeXComponent_TouchEvent](_o_h___native_x_component___touch_event.md) \*touchEvent) | Obtains the touch event scheduled by the ArkUI XComponent. | +| [OH_NativeXComponent_GetTouchPointToolType](#oh_nativexcomponent_gettouchpointtooltype) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, uint32_t pointIndex, [OH_NativeXComponent_TouchPointToolType](#oh_nativexcomponent_touchpointtooltype) \*toolType) | Obtains the ArkUI XComponent touch point tool type. | +| [OH_NativeXComponent_GetTouchPointTiltX](#oh_nativexcomponent_gettouchpointtiltx) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, uint32_t pointIndex, float \*tiltX) | Obtains the angle between the Y-Z plane of the ArkUI XComponent touch point and the x-axis. | +| [OH_NativeXComponent_GetTouchPointTiltY](#oh_nativexcomponent_gettouchpointtilty) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, uint32_t pointIndex, float \*tiltY) | Obtains the angle between the X-Z plane of the ArkUI XComponent touch point and the y-axis. | +| [OH_NativeXComponent_GetMouseEvent](#oh_nativexcomponent_getmouseevent) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, const void \*window, [OH_NativeXComponent_MouseEvent](_o_h___native_x_component___mouse_event.md) \*mouseEvent) | Obtains the mouse event scheduled by ArkUI XComponent. | +| [OH_NativeXComponent_RegisterCallback](#oh_nativexcomponent_registercallback) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, [OH_NativeXComponent_Callback](_o_h___native_x_component___callback.md) \*callback) | Registers a callback for this **OH_NativeXComponent** instance. | +| [OH_NativeXComponent_RegisterMouseEventCallback](#oh_nativexcomponent_registermouseeventcallback) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, [OH_NativeXComponent_MouseEvent_Callback](_o_h___native_x_component___mouse_event___callback.md) \*callback) | Registers the mouse event callback for this **OH_NativeXComponent** instance. | +| [OH_NativeXComponent_RegisterFocusEventCallback](#oh_nativexcomponent_registerfocuseventcallback) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, void(\*callback)([OH_NativeXComponent](#oh_nativexcomponent) \*component, void \*window)) | Registers the focus obtaining event callback for this **OH_NativeXComponent** instance. | +| [OH_NativeXComponent_RegisterKeyEventCallback](#oh_nativexcomponent_registerkeyeventcallback) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, void(\*callback)([OH_NativeXComponent](#oh_nativexcomponent) \*component, void \*window)) | Registers the key event callback for this **OH_NativeXComponent** instance. | +| [OH_NativeXComponent_RegisterBlurEventCallback](#oh_nativexcomponent_registerblureventcallback) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, void(\*callback)([OH_NativeXComponent](#oh_nativexcomponent) \*component, void \*window)) | Registers the focus loss event callback for this **OH_NativeXComponent** instance. | +| [OH_NativeXComponent_GetKeyEvent](#oh_nativexcomponent_getkeyevent) ([OH_NativeXComponent](#oh_nativexcomponent) \*component, [OH_NativeXComponent_KeyEvent](#oh_nativexcomponent_keyevent) \*\*keyEvent) | Obtains the key event scheduled by the ArkUI XComponent. | +| [OH_NativeXComponent_GetKeyEventAction](#oh_nativexcomponent_getkeyeventaction) ([OH_NativeXComponent_KeyEvent](#oh_nativexcomponent_keyevent) \*keyEvent, [OH_NativeXComponent_KeyAction](#oh_nativexcomponent_keyaction) \*action) | Obtains the action of the specified key event. | +| [OH_NativeXComponent_GetKeyEventCode](#oh_nativexcomponent_getkeyeventcode) ([OH_NativeXComponent_KeyEvent](#oh_nativexcomponent_keyevent) \*keyEvent, [OH_NativeXComponent_KeyCode](#oh_nativexcomponent_keycode) \*code) | Obtains the key code of the specified key event. | +| [OH_NativeXComponent_GetKeyEventSourceType](#oh_nativexcomponent_getkeyeventsourcetype) ([OH_NativeXComponent_KeyEvent](#oh_nativexcomponent_keyevent) \*keyEvent, [OH_NativeXComponent_EventSourceType](#oh_nativexcomponent_eventsourcetype) \*sourceType) | Obtains the source type of the specified key event. | +| [OH_NativeXComponent_GetKeyEventDeviceId](#oh_nativexcomponent_getkeyeventdeviceid) ([OH_NativeXComponent_KeyEvent](#oh_nativexcomponent_keyevent) \*keyEvent, int64_t \*deviceId) | Obtains the device ID of the specified key event. | +| [OH_NativeXComponent_GetKeyEventTimeStamp](#oh_nativexcomponent_getkeyeventtimestamp) ([OH_NativeXComponent_KeyEvent](#oh_nativexcomponent_keyevent) \*keyEvent, int64_t \*timeStamp) | Obtains the timestamp of the specified key event. | ### Variables -| Name | Description | -| -------- | -------- | -| [OH_XCOMPONENT_ID_LEN_MAX](#oh_xcomponent_id_len_max) = 128 | Maximum length of an ArkUI XComponent ID. | -| [OH_MAX_TOUCH_POINTS_NUMBER](#oh_max_touch_points_number) = 10 | Maximum number of identifiable touch points in a touch event. | -| [OH_NativeXComponent_TouchPoint::id](#id-12) = 0 | Unique identifier of the finger. | -| [OH_NativeXComponent_TouchPoint::screenX](#screenx-13) = 0.0 | X coordinate of the touch point relative to the left edge of the screen. | -| [OH_NativeXComponent_TouchPoint::screenY](#screeny-13) = 0.0 | Y coordinate of the touch point relative to the left edge of the screen. | -| [OH_NativeXComponent_TouchPoint::x](#x-13) = 0.0 | X coordinate of the touch point relative to the left edge of the XComponent. | -| [OH_NativeXComponent_TouchPoint::y](#y-13) = 0.0 | Y coordinate of the touch point relative to the upper edge of the XComponent. | -| [OH_NativeXComponent_TouchPoint::type](#type-12) = OH_NativeXComponent_TouchEventType::OH_NATIVEXCOMPONENT_UNKNOWN | Touch type of the touch event. | -| [OH_NativeXComponent_TouchPoint::size](#size-12) = 0.0 | Contact area between the finger pad and the screen. | -| [OH_NativeXComponent_TouchPoint::force](#force-12) = 0.0 | Pressure of the current touch event. | -| [OH_NativeXComponent_TouchPoint::timeStamp](#timestamp-12) = 0 | Timestamp of the current touch event. | -| [OH_NativeXComponent_TouchPoint::isPressed](#ispressed) = false | Whether the current point is pressed. | -| [OH_NativeXComponent_TouchEvent::id](#id-22) = 0 | Unique identifier of the finger. | -| [OH_NativeXComponent_TouchEvent::screenX](#screenx-23) = 0.0 | X coordinate of the touch point relative to the left edge of the screen. | -| [OH_NativeXComponent_TouchEvent::screenY](#screeny-23) = 0.0 | Y coordinate of the touch point relative to the left edge of the screen. | -| [OH_NativeXComponent_TouchEvent::x](#x-23) = 0.0 | X coordinate of the touch point relative to the left edge of the XComponent. | -| [OH_NativeXComponent_TouchEvent::y](#y-23) = 0.0 | Y coordinate of the touch point relative to the upper edge of the XComponent. | -| [OH_NativeXComponent_TouchEvent::type](#type-22) = OH_NativeXComponent_TouchEventType::OH_NATIVEXCOMPONENT_UNKNOWN | Touch type of the touch event. | -| [OH_NativeXComponent_TouchEvent::size](#size-22) = 0.0 | Contact area between the finger pad and the screen. | -| [OH_NativeXComponent_TouchEvent::force](#force-22) = 0.0 | Pressure of the current touch event. | -| [OH_NativeXComponent_TouchEvent::deviceId](#deviceid) = 0 | ID of the device where the current touch event is triggered. | -| [OH_NativeXComponent_TouchEvent::timeStamp](#timestamp-22) = 0 | Timestamp of the current touch event. | -| [OH_NativeXComponent_TouchEvent::touchPoints](#touchpoints) [OH_MAX_TOUCH_POINTS_NUMBER] | Array of the current touch points. | -| [OH_NativeXComponent_TouchEvent::numPoints](#numpoints) = 0 | Number of current touch points. | -| [OH_NativeXComponent_MouseEvent::x](#x-33) = 0.0 | X coordinate of the clicked point relative to the upper left corner of the component. | -| [OH_NativeXComponent_MouseEvent::y](#y-33) = 0.0 | Y coordinate of the clicked point relative to the upper left corner of the component. | -| [OH_NativeXComponent_MouseEvent::screenX](#screenx-33) = 0.0 | X coordinate of the clicked point relative to the upper left corner of the screen. | -| [OH_NativeXComponent_MouseEvent::screenY](#screeny-33) = 0.0 | Y coordinate of the clicked point relative to the upper left corner of the screen. | -| [OH_NativeXComponent_MouseEvent::timestamp](#timestamp) = 0 | Timestamp of the current mouse event. | -| [OH_NativeXComponent_MouseEvent::action](#action) = [OH_NativeXComponent_MouseEventAction::OH_NATIVEXCOMPONENT_MOUSE_NONE](#oh_nativexcomponent_mouseeventaction) | Current mouse event action. | -| [OH_NativeXComponent_MouseEvent::button](#button) = [OH_NativeXComponent_MouseEventButton::OH_NATIVEXCOMPONENT_NONE_BUTTON](#oh_nativexcomponent_mouseeventbutton) | Mouse event button | -| [OH_NativeXComponent_Callback::OnSurfaceCreated](#onsurfacecreated) | Invoked when a surface is created. | -| [OH_NativeXComponent_Callback::OnSurfaceChanged](#onsurfacechanged) | Invoked when the surface changes. | -| [OH_NativeXComponent_Callback::OnSurfaceDestroyed](#onsurfacedestroyed) | Invoked when the surface is destroyed. | -| [OH_NativeXComponent_Callback::DispatchTouchEvent](#dispatchtouchevent) | Invoked when a touch event is triggered. | -| [OH_NativeXComponent_MouseEvent_Callback::DispatchMouseEvent](#dispatchmouseevent) | Invoked when a mouse event is triggered. | -| [OH_NativeXComponent_MouseEvent_Callback::DispatchHoverEvent](#dispatchhoverevent) | Invoked when a hover event is triggered. | +| Name | Description | +| ---------------------------------------- | ------------------------------ | +| **OH_XCOMPONENT_ID_LEN_MAX** = 128 | Maximum length of the ArkUI XComponent ID. | +| **OH_MAX_TOUCH_POINTS_NUMBER** = 10 | Maximum number of identifiable touch points in a touch event. | +| [OH_NativeXComponent_TouchPoint::id](#id-12) = 0 | Unique identifier of the finger. | +| [OH_NativeXComponent_TouchPoint::screenX](#screenx-13) = 0.0 | X coordinate of the touch point relative to the left edge of the application window where the XComponent is located.| +| [OH_NativeXComponent_TouchPoint::screenY](#screeny-13) = 0.0 | Y coordinate of the touch point relative to the left edge of the application window where the XComponent is located.| +| [OH_NativeXComponent_TouchPoint::x](#x-13) = 0.0 | X coordinate of the touch point relative to the left edge of the XComponent. | +| [OH_NativeXComponent_TouchPoint::y](#y-13) = 0.0 | Y coordinate of the touch point relative to the upper edge of the XComponent. | +| [OH_NativeXComponent_TouchPoint::type](#type-12) = OH_NativeXComponent_TouchEventType::OH_NATIVEXCOMPONENT_UNKNOWN | Touch type of the touch event. | +| [OH_NativeXComponent_TouchPoint::size](#size-12) = 0.0 | Contact area between the finger pad and the screen. | +| [OH_NativeXComponent_TouchPoint::force](#force-12) = 0.0 | Pressure of the touch event. | +| [OH_NativeXComponent_TouchPoint::timeStamp](#timestamp-12) = 0 | Timestamp of the touch point. | +| [OH_NativeXComponent_TouchPoint::isPressed](#ispressed) = false | Whether the current point is pressed. | +| [OH_NativeXComponent_TouchEvent::id](#id-22) = 0 | Unique identifier of the finger. | +| [OH_NativeXComponent_TouchEvent::screenX](#screenx-23) = 0.0 | X coordinate of the touch point relative to the left edge of the screen. | +| [OH_NativeXComponent_TouchEvent::screenY](#screeny-23) = 0.0 | Y coordinate of the touch point relative to the upper edge of the screen. | +| [OH_NativeXComponent_TouchEvent::x](#x-23) = 0.0 | X coordinate of the touch point relative to the left edge of the XComponent. | +| [OH_NativeXComponent_TouchEvent::y](#y-23) = 0.0 | Y coordinate of the touch point relative to the upper edge of the XComponent. | +| [OH_NativeXComponent_TouchEvent::type](#type-22) = OH_NativeXComponent_TouchEventType::OH_NATIVEXCOMPONENT_UNKNOWN | Touch type of the touch event. | +| [OH_NativeXComponent_TouchEvent::size](#size-22) = 0.0 | Contact area between the finger pad and the screen. | +| [OH_NativeXComponent_TouchEvent::force](#force-22) = 0.0 | Pressure of the touch event. | +| [OH_NativeXComponent_TouchEvent::deviceId](#deviceid) = 0 | ID of the device where the current touch event is triggered. | +| [OH_NativeXComponent_TouchEvent::timeStamp](#timestamp-22) = 0 | Timestamp of the touch event. | +| [OH_NativeXComponent_TouchEvent::touchPoints](#touchpoints) [OH_MAX_TOUCH_POINTS_NUMBER] | Array of the touch points. | +| [OH_NativeXComponent_TouchEvent::numPoints](#numpoints) = 0 | Number of current touch points. | +| [OH_NativeXComponent_MouseEvent::x](#x-33) = 0.0 | X coordinate of the clicked point relative to the upper left corner of the component. | +| [OH_NativeXComponent_MouseEvent::y](#y-33)= 0.0 | Y coordinate of the clicked point relative to the upper left corner of the component. | +| [OH_NativeXComponent_MouseEvent::screenX](#screenx-33)= 0.0 | X coordinate of the clicked point relative to the upper left corner of the screen. | +| [OH_NativeXComponent_MouseEvent::screenY](#screeny-33)= 0.0 | Y coordinate of the clicked point relative to the upper left corner of the screen. | +| [OH_NativeXComponent_MouseEvent::timestamp](#timestamp)= 0 | Timestamp of the mouse event. | +| [OH_NativeXComponent_MouseEvent::action](#action)= [OH_NativeXComponent_MouseEventAction::OH_NATIVEXCOMPONENT_MOUSE_NONE](#oh_nativexcomponent_mouseeventaction) | Action of the mouse event. | +| [OH_NativeXComponent_MouseEvent::button](#button)= [OH_NativeXComponent_MouseEventButton::OH_NATIVEXCOMPONENT_NONE_BUTTON](#oh_nativexcomponent_mouseeventbutton) | Enumerates the mouse event buttons. | +| [OH_NativeXComponent_Callback::OnSurfaceCreated](#onsurfacecreated) | Invoked when a surface is created. | +| [OH_NativeXComponent_Callback::OnSurfaceChanged](#onsurfacechanged) | Invoked when the surface changes. | +| [OH_NativeXComponent_Callback::OnSurfaceDestroyed](#onsurfacedestroyed) | Invoked when the surface is destroyed. | +| [OH_NativeXComponent_Callback::DispatchTouchEvent](#dispatchtouchevent) | Invoked when a touch event is triggered. | +| [OH_NativeXComponent_MouseEvent_Callback::DispatchMouseEvent](#dispatchmouseevent) | Invoked when a mouse event is triggered. | +| [OH_NativeXComponent_MouseEvent_Callback::DispatchHoverEvent](#dispatchhoverevent) | Invoked when a hover event is triggered. | ## Type Description -### OH_NativeXComponent +### OH_NativeXComponent ``` typedef struct OH_NativeXComponent OH_NativeXComponent @@ -121,31 +135,44 @@ typedef struct OH_NativeXComponent OH_NativeXComponent **Description** -Provides an encapsulated OH_NativeXComponent instance. +Provides an encapsulated **OH_NativeXComponent** instance. -**Since:** +**Since** 8 ### OH_NativeXComponent_Callback - ``` typedef struct OH_NativeXComponent_Callback OH_NativeXComponent_Callback ``` **Description** -Registers a callback for the surface lifecycle and touch event. +Registers callbacks for the surface lifecycle and touch event. -**Since:** +**Since** 8 -### OH_NativeXComponent_MouseEvent_Callback +### OH_NativeXComponent_KeyEvent + +``` +typedef struct OH_NativeXComponent_KeyEvent OH_NativeXComponent_KeyEvent +``` + +**Description** + +Provides an encapsulated **OH_NativeXComponent_KeyEvent** instance. +**Since** + +10 + + +### OH_NativeXComponent_MouseEvent_Callback ``` typedef struct OH_NativeXComponent_MouseEvent_Callback OH_NativeXComponent_MouseEvent_Callback @@ -153,17 +180,17 @@ typedef struct OH_NativeXComponent_MouseEvent_Callback OH_NativeXComponent_Mouse **Description** -Registers a callback for the mouse event. +Registers callbacks for the mouse event. -**Since:** +**Since** 9 ## Enum Description -### anonymous enum +### anonymous enum ``` anonymous enum @@ -173,43 +200,411 @@ anonymous enum Enumerates the API access states. -| Name | Description | -| ---------------------------------------- | ---------- | -| OH_NATIVEXCOMPONENT_RESULT_SUCCESS | Success result. | -| OH_NATIVEXCOMPONENT_RESULT_FAILED | Failure. | -| OH_NATIVEXCOMPONENT_RESULT_BAD_PARAMETER | Invalid parameter. | +| Value | Description | +| ---------------------------------------- | ----- | +| OH_NATIVEXCOMPONENT_RESULT_SUCCESS | Success.| +| OH_NATIVEXCOMPONENT_RESULT_FAILED | Failure.| +| OH_NATIVEXCOMPONENT_RESULT_BAD_PARAMETER | Invalid parameter.| -**Since:** +**Since** 8 -### OH_NativeXComponent_EventSourceType -OH_NativeXComponent_EventSourceType +### OH_NativeXComponent_EventSourceType - ``` enum OH_NativeXComponent_EventSourceType ``` **Description** -Enumerates the source types of the touch event. +Enumerates the touch event source types. -| Name | Description | -| -------- | -------- | -| OH_NATIVEXCOMPONENT_SOURCE_TYPE_UNKNOWN | Unknown source type. | -| OH_NATIVEXCOMPONENT_SOURCE_TYPE_MOUSE | Source that generates a mouse multi-touch event. | -| OH_NATIVEXCOMPONENT_SOURCE_TYPE_TOUCHSCREEN | Source that generates a touchscreen multi-touch event. | -| OH_NATIVEXCOMPONENT_SOURCE_TYPE_TOUCHPAD | Source that generates a touchpad multi-touch event. | -| OH_NATIVEXCOMPONENT_SOURCE_TYPE_JOYSTICK | Source that generates a joystick multi-touch event. | +| Value | Description | +| ---------------------------------------- | ------------------- | +| OH_NATIVEXCOMPONENT_SOURCE_TYPE_UNKNOWN | Unknown source type. | +| OH_NATIVEXCOMPONENT_SOURCE_TYPE_MOUSE | Source that generates a mouse multi-click event. | +| OH_NATIVEXCOMPONENT_SOURCE_TYPE_TOUCHSCREEN | Source that generates a touchscreen multi-touch event.| +| OH_NATIVEXCOMPONENT_SOURCE_TYPE_TOUCHPAD | Source that generates a touchpad multi-touch event.| +| OH_NATIVEXCOMPONENT_SOURCE_TYPE_JOYSTICK | Source that generates a joystick multi-touch event.| +| OH_NATIVEXCOMPONENT_SOURCE_TYPE_KEYBOARD | Source that generates a key event. | -**Since:** +**Since** 9 -### OH_NativeXComponent_MouseEventAction +### OH_NativeXComponent_KeyAction + +``` +enum OH_NativeXComponent_KeyAction +``` + +**Description** + +Enumerates the key event actions. + +| Value | Description | +| -------------------------------------- | -------- | +| OH_NATIVEXCOMPONENT_KEY_ACTION_UNKNOWN | Unknown key event action.| +| OH_NATIVEXCOMPONENT_KEY_ACTION_DOWN | Button press. | +| OH_NATIVEXCOMPONENT_KEY_ACTION_UP | Button release. | + +**Since** + +10 + + +### OH_NativeXComponent_KeyCode + +``` +enum OH_NativeXComponent_KeyCode +``` + +**Description** + +Enumerates the mouse event key codes. + +| Value | Description | +| ---------------------------- | --------------------------- | +| KEY_UNKNOWN | Unknown key. | +| KEY_FN | Function (Fn) key. | +| KEY_HOME | Function (Home) key. | +| KEY_BACK | Back key. | +| KEY_MEDIA_PLAY_PAUSE | Multimedia key - play/pause. | +| KEY_MEDIA_STOP | Multimedia key - stop. | +| KEY_MEDIA_NEXT | Multimedia key - next song. | +| KEY_MEDIA_PREVIOUS | Multimedia key - previous song. | +| KEY_MEDIA_REWIND | Multimedia key - rewind. | +| KEY_MEDIA_FAST_FORWARD | Multimedia key - fast-forward. | +| KEY_VOLUME_UP | Volume Up key. | +| KEY_VOLUME_DOWN | Volume Down key. | +| KEY_POWER | Power key. | +| KEY_CAMERA | Camera key. | +| KEY_VOLUME_MUTE | Speaker Mute key. | +| KEY_MUTE | Microphone Mute key. | +| KEY_BRIGHTNESS_UP | Brightness key - turn up. | +| KEY_BRIGHTNESS_DOWN | Brightness key - turn down. | +| KEY_0 | Key **0**. | +| KEY_1 | Key **1**. | +| KEY_2 | Key **2**. | +| KEY_3 | Key **3**. | +| KEY_4 | Key **4**. | +| KEY_5 | Key **5**. | +| KEY_6 | Key **6**. | +| KEY_7 | Key **7**. | +| KEY_8 | Key **8**. | +| KEY_9 | Key **9**. | +| KEY_STAR | Key **\***. | +| KEY_POUND | Key **\#**. | +| KEY_DPAD_UP | Navigation key - up. | +| KEY_DPAD_DOWN | Navigation key - down. | +| KEY_DPAD_LEFT | Navigation key - left. | +| KEY_DPAD_RIGHT | Navigation key - right. | +| KEY_DPAD_CENTER | Navigation key - OK. | +| KEY_A | Key **A**. | +| KEY_B | Key **B**. | +| KEY_C | Key **C**. | +| KEY_D | Key **D**. | +| KEY_E | Key **E**. | +| KEY_F | Key **F**. | +| KEY_G | Key **G**. | +| KEY_H | Key **H**. | +| KEY_I | Key **I**. | +| KEY_J | Key **J**. | +| KEY_K | Key **K**. | +| KEY_L | Key **L**. | +| KEY_M | Key **M**. | +| KEY_N | Key **N**. | +| KEY_O | Key **O**. | +| KEY_P | Key **P**. | +| KEY_Q | Key **Q**. | +| KEY_R | Key **R**. | +| KEY_S | Key **S**. | +| KEY_T | Key **T**. | +| KEY_U | Key **U**. | +| KEY_V | Key **V**. | +| KEY_W | Key **W**. | +| KEY_X | Key **X**. | +| KEY_Y | Key **Y**. | +| KEY_Z | Key **Z**. | +| KEY_COMMA | Key **,**. | +| KEY_PERIOD | Key **.**. | +| KEY_ALT_LEFT | Left Alt key. | +| KEY_ALT_RIGHT | Right Alt key. | +| KEY_SHIFT_LEFT | Left Shift key. | +| KEY_SHIFT_RIGHT | Right Shift key. | +| KEY_TAB | Tab key. | +| KEY_SPACE | Space key. | +| KEY_SYM | Symbol key. | +| KEY_EXPLORER | Explorer key, which is used to start the explorer application. | +| KEY_ENVELOPE | Email key, which is used to start the email application. | +| KEY_ENTER | Enter key. | +| KEY_DEL | Delete key. | +| KEY_GRAVE | Key **`**. | +| KEY_MINUS | Key **-**. | +| KEY_EQUALS | Key **=**. | +| KEY_LEFT_BRACKET | Key **[**. | +| KEY_RIGHT_BRACKET | Key **]**. | +| KEY_BACKSLASH | Key **\**. | +| KEY_SEMICOLON | Key **;**. | +| KEY_APOSTROPHE | Key **'**. | +| KEY_SLASH | Key **/**. | +| KEY_AT | Key **\@**. | +| KEY_PLUS | Key **+**. | +| KEY_MENU | Menu key. | +| KEY_PAGE_UP | Page Up key. | +| KEY_PAGE_DOWN | Page Down key. | +| KEY_ESCAPE | ESC key. | +| KEY_FORWARD_DEL | Delete key. | +| KEY_CTRL_LEFT | Left Ctrl key. | +| KEY_CTRL_RIGHT | Right Ctrl key. | +| KEY_CAPS_LOCK | Caps Lock key. | +| KEY_SCROLL_LOCK | Scroll Lock key. | +| KEY_META_LEFT | Left Meta key. | +| KEY_META_RIGHT | Right Meta key. | +| KEY_FUNCTION | Function key. | +| KEY_SYSRQ | System Request/Print Screen key. | +| KEY_BREAK | Break/Pause key. | +| KEY_MOVE_HOME | Move to Home key. | +| KEY_MOVE_END | Move to End key. | +| KEY_INSERT | Insert key. | +| KEY_FORWARD | Forward key. | +| KEY_MEDIA_PLAY | Multimedia key - play. | +| KEY_MEDIA_PAUSE | Multimedia key - pause. | +| KEY_MEDIA_CLOSE | Multimedia key - close. | +| KEY_MEDIA_EJECT | Multimedia key - eject. | +| KEY_MEDIA_RECORD | Multimedia key - record. | +| KEY_F1 | F1 key. | +| KEY_F2 | F2 key. | +| KEY_F3 | F3 key. | +| KEY_F4 | F4 key. | +| KEY_F5 | F5 key. | +| KEY_F6 | F6 key. | +| KEY_F7 | F7 key. | +| KEY_F8 | F8 key. | +| KEY_F9 | F9 key. | +| KEY_F10 | F10 key. | +| KEY_F11 | F11 key. | +| KEY_F12 | F12 key. | +| KEY_NUM_LOCK | Number Lock key. | +| KEY_NUMPAD_0 | Key **0** on numeric keypad. | +| KEY_NUMPAD_1 | Key **1** on numeric keypad. | +| KEY_NUMPAD_2 | Key **2** on numeric keypad. | +| KEY_NUMPAD_3 | Key **3** on numeric keypad. | +| KEY_NUMPAD_4 | Key **4** on numeric keypad. | +| KEY_NUMPAD_5 | Key **5** on numeric keypad. | +| KEY_NUMPAD_6 | Key **6** on numeric keypad. | +| KEY_NUMPAD_7 | Key **7** on numeric keypad. | +| KEY_NUMPAD_8 | Key **8** on numeric keypad. | +| KEY_NUMPAD_9 | Key **9** on numeric keypad. | +| KEY_NUMPAD_DIVIDE | Key **/** on numeric keypad. | +| KEY_NUMPAD_MULTIPLY | Key ***** on numeric keypad. | +| KEY_NUMPAD_SUBTRACT | Key **-** on numeric keypad. | +| KEY_NUMPAD_ADD | Key **+** on numeric keypad. | +| KEY_NUMPAD_DOT | Key **.** on numeric keypad. | +| KEY_NUMPAD_COMMA | Key **,** on numeric keypad. | +| KEY_NUMPAD_ENTER | Enter key on numeric keypad. | +| KEY_NUMPAD_EQUALS | Key **=** on numeric keypad. | +| KEY_NUMPAD_LEFT_PAREN | Key **(** on numeric keypad. | +| KEY_NUMPAD_RIGHT_PAREN | Key **)** on numeric keypad. | +| KEY_VIRTUAL_MULTITASK | Multi-task key. | +| KEY_SLEEP | Sleep key. | +| KEY_ZENKAKU_HANKAKU | Zenkaku/Hankaku key. | +| KEY_102ND | 102nd key. | +| KEY_RO | Ro key. | +| KEY_KATAKANA | Katakana key. | +| KEY_HIRAGANA | Hiragana key. | +| KEY_HENKAN | Henkan key. | +| KEY_KATAKANA_HIRAGANA | Katakana/Hiragana key. | +| KEY_MUHENKAN | Muhenkan key. | +| KEY_LINEFEED | Linefeed key. | +| KEY_MACRO | Macro key. | +| KEY_NUMPAD_PLUSMINUS | Plus/Minus key on the numeric keypad. | +| KEY_SCALE | Scale key. | +| KEY_HANGUEL | Hanguel key. | +| KEY_HANJA | Hanja key. | +| KEY_YEN | Yen key. | +| KEY_STOP | Stop key. | +| KEY_AGAIN | Again key. | +| KEY_PROPS | Props key. | +| KEY_UNDO | Undo key. | +| KEY_COPY | Copy key. | +| KEY_OPEN | Open key. | +| KEY_PASTE | Paste key. | +| KEY_FIND | Find key. | +| KEY_CUT | Cut key. | +| KEY_HELP | Help key. | +| KEY_CALC | Calc key, which is used to start the calculator application. | +| KEY_FILE | File key. | +| KEY_BOOKMARKS | Bookmarks key. | +| KEY_NEXT | Next key. | +| KEY_PLAYPAUSE | Play/Pause key. | +| KEY_PREVIOUS | Previous key. | +| KEY_STOPCD | Stop CD key. | +| KEY_CONFIG | Config key. | +| KEY_REFRESH | Refresh key. | +| KEY_EXIT | Exit key. | +| KEY_EDIT | Edit key. | +| KEY_SCROLLUP | Scroll Up key. | +| KEY_SCROLLDOWN | Scroll Down key. | +| KEY_NEW | New key. | +| KEY_REDO | Redo key. | +| KEY_CLOSE | Close key. | +| KEY_PLAY | Play key. | +| KEY_BASSBOOST | Bass Boost key. | +| KEY_PRINT | Print key. | +| KEY_CHAT | Chat key. | +| KEY_FINANCE | Finance key. | +| KEY_CANCEL | Cancel key. | +| KEY_KBDILLUM_TOGGLE | Keyboard Illumination Toggle key. | +| KEY_KBDILLUM_DOWN | Keyboard Illumination Up key. | +| KEY_KBDILLUM_UP | Keyboard Illumination Down key. | +| KEY_SEND | Send key. | +| KEY_REPLY | Reply key. | +| KEY_FORWARDMAIL | Forward Mail key. | +| KEY_SAVE | Save key. | +| KEY_DOCUMENTS | Documents key. | +| KEY_VIDEO_NEXT | Next Video key. | +| KEY_VIDEO_PREV | Previous Video key. | +| KEY_BRIGHTNESS_CYCLE | Brightness Cycle key. | +| KEY_BRIGHTNESS_ZERO | Brightness Zero key. | +| KEY_DISPLAY_OFF | Display Off Key. | +| KEY_BTN_MISC | Misc Button key. | +| KEY_GOTO | Goto key. | +| KEY_INFO | Info key. | +| KEY_PROGRAM | Program key. | +| KEY_PVR | PVR key. | +| KEY_SUBTITLE | Subtitle key. | +| KEY_FULL_SCREEN | Full Screen key. | +| KEY_KEYBOARD | Keyboard. | +| KEY_ASPECT_RATIO | Aspect Ratio key. | +| KEY_PC | Port Control key. | +| KEY_TV | TV key. | +| KEY_TV2 | TV key 2. | +| KEY_VCR | VCR key. | +| KEY_VCR2 | VCR key 2. | +| KEY_SAT | SAT key. | +| KEY_CD | CD key. | +| KEY_TAPE | Tape key. | +| KEY_TUNER | Tuner key. | +| KEY_PLAYER | Player key. | +| KEY_DVD | DVD key. | +| KEY_AUDIO | Audio key. | +| KEY_VIDEO | Video key. | +| KEY_MEMO | Memo key. | +| KEY_CALENDAR | Calendar key. | +| KEY_RED | Red indicator. | +| KEY_GREEN | Green indicator. | +| KEY_YELLOW | Yellow indicator. | +| KEY_BLUE | Blue indicator. | +| KEY_CHANNELUP | Channel Up key. | +| KEY_CHANNELDOWN | Channel Down key. | +| KEY_LAST | Last key. | +| KEY_RESTART | Restart key. | +| KEY_SLOW | Slow key. | +| KEY_SHUFFLE | Shuffle key. | +| KEY_VIDEOPHONE | Videophone key. | +| KEY_GAMES | Games key. | +| KEY_ZOOMIN | Zoom in key. | +| KEY_ZOOMOUT | Zoom out key. | +| KEY_ZOOMRESET | Zoom Reset key. | +| KEY_WORDPROCESSOR | Word Processor key. | +| KEY_EDITOR | Editor key. | +| KEY_SPREADSHEET | Spreadsheet key. | +| KEY_GRAPHICSEDITOR | Graphics Editor key. | +| KEY_PRESENTATION | Presentation key. | +| KEY_DATABASE | Database key. | +| KEY_NEWS | News key. | +| KEY_VOICEMAIL | Voicemail key. | +| KEY_ADDRESSBOOK | Address book key. | +| KEY_MESSENGER | Messenger key. | +| KEY_BRIGHTNESS_TOGGLE | Brightness Toggle key. | +| KEY_SPELLCHECK | Spell Check key. | +| KEY_COFFEE | Coffee key, which is used to launch screen lock or screen saver. | +| KEY_MEDIA_REPEAT | Media Repeat key. | +| KEY_IMAGES | Images key. | +| KEY_BUTTONCONFIG | Button Configuration key. | +| KEY_TASKMANAGER | Task Manager key. | +| KEY_JOURNAL | Log key. | +| KEY_CONTROLPANEL | Control Panel key. | +| KEY_APPSELECT | App Select key. | +| KEY_SCREENSAVER | Screen Saver key. | +| KEY_ASSISTANT | Assistant key. | +| KEY_KBD_LAYOUT_NEXT | Next Keyboard Layout key. | +| KEY_BRIGHTNESS_MIN | Min Brightness key. | +| KEY_BRIGHTNESS_MAX | Max Brightness key. | +| KEY_KBDINPUTASSIST_PREV | Keyboard Input-assisted Previous key. | +| KEY_KBDINPUTASSIST_NEXT | Keyboard Input-assisted Next key. | +| KEY_KBDINPUTASSIST_PREVGROUP | Keyboard Input-assisted Previous key. | +| KEY_KBDINPUTASSIST_NEXTGROUP | Keyboard Input-assisted Next key. | +| KEY_KBDINPUTASSIST_ACCEPT | Keyboard Input-assisted Accept key. | +| KEY_KBDINPUTASSIST_CANCEL | Keyboard Input-assisted Cancel key. | +| KEY_FRONT | Front key, which is used to launch the windshield defogger. | +| KEY_SETUP | Setup key. | +| KEY_WAKEUP | Wakeup key. | +| KEY_SENDFILE | Send File key. | +| KEY_DELETEFILE | Delete File key. | +| KEY_XFER | XFER key, which is used to start file transfer. | +| KEY_PROG1 | Program key 1. | +| KEY_PROG2 | Program key 2. | +| KEY_MSDOS | MS-DOS key. | +| KEY_SCREENLOCK | Screen Lock key. | +| KEY_DIRECTION_ROTATE_DISPLAY | Directional Rotation Display key. | +| KEY_CYCLEWINDOWS | Windows Cycle key. | +| KEY_COMPUTER | Keys. | +| KEY_EJECTCLOSECD | Eject CD key. | +| KEY_ISO | ISO key. | +| KEY_MOVE | Move key. | +| KEY_F13 | F13 key. | +| KEY_F14 | F14 key. | +| KEY_F15 | F15 key. | +| KEY_F16 | F16 key. | +| KEY_F17 | F17 key. | +| KEY_F18 | F18 key. | +| KEY_F19 | F19 key. | +| KEY_F20 | F20 key. | +| KEY_F21 | F21 key. | +| KEY_F22 | F22 key. | +| KEY_F23 | F23 key. | +| KEY_F24 | F24 key. | +| KEY_PROG3 | Program key 3. | +| KEY_PROG4 | Program key 4. | +| KEY_DASHBOARD | Dashboard. | +| KEY_SUSPEND | Suspend key. | +| KEY_HP | HP key. | +| KEY_SOUND | Sound key. | +| KEY_QUESTION | Question key. | +| KEY_CONNECT | Connect key. | +| KEY_SPORT | Sport key. | +| KEY_SHOP | Shop key. | +| KEY_ALTERASE | Alternate key. | +| KEY_SWITCHVIDEOMODE | Switch Video Mode key (monitor, LCD, and TV, etc.).| +| KEY_BATTERY | Battery key. | +| KEY_BLUETOOTH | Bluetooth key. | +| KEY_WLAN | WLAN key. | +| KEY_UWB | Ultra-wideband key. | +| KEY_WWAN_WIMAX | WWAN WiMAX key. | +| KEY_RFKILL | RF Kill key. | +| KEY_CHANNEL | Channel key. | +| KEY_BTN_0 | Button 0. | +| KEY_BTN_1 | Button 1. | +| KEY_BTN_2 | Button 2. | +| KEY_BTN_3 | Button 3. | +| KEY_BTN_4 | Button 4. | +| KEY_BTN_5 | Button 5. | +| KEY_BTN_6 | Button 6. | +| KEY_BTN_7 | Button 7. | +| KEY_BTN_8 | Button 8. | +| KEY_BTN_9 | Button 9. | + +**Since** + +10 + + +### OH_NativeXComponent_MouseEventAction ``` enum OH_NativeXComponent_MouseEventAction @@ -219,21 +614,20 @@ enum OH_NativeXComponent_MouseEventAction Enumerates the mouse event actions. -| Name | Description | -| --------------------------------- | -------------------------------- | -| OH_NATIVEXCOMPONENT_MOUSE_NONE | Invalid mouse event. | -| OH_NATIVEXCOMPONENT_MOUSE_PRESS | The mouse event is triggered when a mouse button is pressed. | -| OH_NATIVEXCOMPONENT_MOUSE_RELEASE | The mouse event is triggered when a mouse button is released. | -| OH_NATIVEXCOMPONENT_MOUSE_MOVE | The mouse event is triggered when the mouse moves on the screen. | +| Value | Description | +| --------------------------------- | ---------------- | +| OH_NATIVEXCOMPONENT_MOUSE_NONE | Invalid mouse event. | +| OH_NATIVEXCOMPONENT_MOUSE_PRESS | Mouse button press. | +| OH_NATIVEXCOMPONENT_MOUSE_RELEASE | Mouse button release. | +| OH_NATIVEXCOMPONENT_MOUSE_MOVE | Mouse movement.| -**Since:** +**Since** 9 ### OH_NativeXComponent_MouseEventButton - ``` enum OH_NativeXComponent_MouseEventButton ``` @@ -242,23 +636,22 @@ enum OH_NativeXComponent_MouseEventButton Enumerates the mouse event buttons. -| Name | Description | -| ---------------------------------- | ---------------------------------- | -| OH_NATIVEXCOMPONENT_NONE_BUTTON | The mouse event is triggered when no mouse button is pressed. | -| OH_NATIVEXCOMPONENT_LEFT_BUTTON | The mouse event is triggered when the left mouse button is pressed. | -| OH_NATIVEXCOMPONENT_RIGHT_BUTTON | The mouse event is triggered when the right mouse button is pressed. | -| OH_NATIVEXCOMPONENT_MIDDLE_BUTTON | The mouse event is triggered when the middle mouse button is pressed. | -| OH_NATIVEXCOMPONENT_BACK_BUTTON | The mouse event is triggered when the back button on the left of the mouse is pressed. | -| OH_NATIVEXCOMPONENT_FORWARD_BUTTON | The mouse event is triggered when the forward button on the left of the mouse is pressed. | +| Value | Description | +| ---------------------------------- | ----------------- | +| OH_NATIVEXCOMPONENT_NONE_BUTTON | No button. | +| OH_NATIVEXCOMPONENT_LEFT_BUTTON | Left mouse button. | +| OH_NATIVEXCOMPONENT_RIGHT_BUTTON | Right mouse button. | +| OH_NATIVEXCOMPONENT_MIDDLE_BUTTON | Middle mouse button. | +| OH_NATIVEXCOMPONENT_BACK_BUTTON | Back button on the left of the mouse.| +| OH_NATIVEXCOMPONENT_FORWARD_BUTTON | Forward key on the left of the mouse.| -**Since:** +**Since** 9 ### OH_NativeXComponent_TouchEventType - ``` enum OH_NativeXComponent_TouchEventType ``` @@ -267,42 +660,42 @@ enum OH_NativeXComponent_TouchEventType Enumerates the touch event types. -| Name | Description | -| --------------------------- | ------------------------------------------ | -| OH_NATIVEXCOMPONENT_DOWN | The touch event is triggered when a finger is pressed. | -| OH_NATIVEXCOMPONENT_UP | The touch event is triggered when a finger is lifted. | -| OH_NATIVEXCOMPONENT_MOVE | The touch event is triggered when a finger is pressed and moves on the screen. | +| Value | Description | +| --------------------------- | --------------------- | +| OH_NATIVEXCOMPONENT_DOWN | The touch event is triggered when a finger is pressed. | +| OH_NATIVEXCOMPONENT_UP | The touch event is triggered when a finger is lifted. | +| OH_NATIVEXCOMPONENT_MOVE | The touch event is triggered when a finger is moved on the screen.| | OH_NATIVEXCOMPONENT_CANCEL | The event is triggered when a touch event is canceled. | -| OH_NATIVEXCOMPONENT_UNKNOWN | Invalid touch type. | +| OH_NATIVEXCOMPONENT_UNKNOWN | Invalid touch type. | -**Since:** +**Since** 8 + ### OH_NativeXComponent_TouchPointToolType - ``` enum OH_NativeXComponent_TouchPointToolType ``` **Description** -Enumerates the contact point tool types. +Enumerates the touch point tool types. -| Name | Description | -| -------- | -------- | -| OH_NATIVEXCOMPONENT_TOOL_TYPE_UNKNOWN | Unknown tool type. | -| OH_NATIVEXCOMPONENT_TOOL_TYPE_FINGER | Finger. | -| OH_NATIVEXCOMPONENT_TOOL_TYPE_PEN | Stylus. | -| OH_NATIVEXCOMPONENT_TOOL_TYPE_RUBBER | Eraser. | -| OH_NATIVEXCOMPONENT_TOOL_TYPE_BRUSH | Brush. | -| OH_NATIVEXCOMPONENT_TOOL_TYPE_PENCIL | Pencil. | -| OH_NATIVEXCOMPONENT_TOOL_TYPE_AIRBRUSH | Air brush. | -| OH_NATIVEXCOMPONENT_TOOL_TYPE_MOUSE | Mouse. | -| OH_NATIVEXCOMPONENT_TOOL_TYPE_LENS | Lens. | +| Value | Description | +| -------------------------------------- | -------- | +| OH_NATIVEXCOMPONENT_TOOL_TYPE_UNKNOWN | Unknown tool type.| +| OH_NATIVEXCOMPONENT_TOOL_TYPE_FINGER | Finger. | +| OH_NATIVEXCOMPONENT_TOOL_TYPE_PEN | Stylus. | +| OH_NATIVEXCOMPONENT_TOOL_TYPE_RUBBER | Rubber. | +| OH_NATIVEXCOMPONENT_TOOL_TYPE_BRUSH | Brush. | +| OH_NATIVEXCOMPONENT_TOOL_TYPE_PENCIL | Pencil. | +| OH_NATIVEXCOMPONENT_TOOL_TYPE_AIRBRUSH | Air brush. | +| OH_NATIVEXCOMPONENT_TOOL_TYPE_MOUSE | Mouse. | +| OH_NATIVEXCOMPONENT_TOOL_TYPE_LENS | Lens. | -**Since:** +**Since** 9 @@ -310,8 +703,163 @@ Enumerates the contact point tool types. ## Function Description -### OH_NativeXComponent_GetMouseEvent() +### OH_NativeXComponent_GetKeyEvent() + +``` +int32_t OH_NativeXComponent_GetKeyEvent (OH_NativeXComponent * component, OH_NativeXComponent_KeyEvent ** keyEvent ) +``` + +**Description** + +Obtains the key event scheduled by ArkUI XComponent. + +**Parameters** + +| Name | Description | +| --------- | ----------------------------- | +| component | Pointer to the **OH_NativeXComponent** instance.| +| keyEvent | Pointer to the current key event. | + +**Returns** + +Returns the status code of the execution. + +**Since** + +10 + + +### OH_NativeXComponent_GetKeyEventAction() + +``` +int32_t OH_NativeXComponent_GetKeyEventAction (OH_NativeXComponent_KeyEvent * keyEvent, OH_NativeXComponent_KeyAction * action ) +``` + +**Description** + +Obtains the action of the specified key event. + +**Parameters** + +| Name | Description | +| -------- | -------------------------------------- | +| keyEvent | Pointer to the **OH_NativeXComponent_KeyEvent** instance.| +| action | Pointer to the key event action. | + +**Returns** + +Returns the status code of the execution. + +**Since** + +10 + + +### OH_NativeXComponent_GetKeyEventCode() + +``` +int32_t OH_NativeXComponent_GetKeyEventCode (OH_NativeXComponent_KeyEvent * keyEvent, OH_NativeXComponent_KeyCode * code ) +``` + +**Description** + +Obtains the key code of the specified key event. + +**Parameters** + +| Name | Description | +| -------- | -------------------------------------- | +| keyEvent | Pointer to the **OH_NativeXComponent_KeyEvent** instance.| +| code | Pointer to the key code of the key event. | + +**Returns** + +Returns the status code of the execution. + +**Since** + +10 + + +### OH_NativeXComponent_GetKeyEventDeviceId() + +``` +int32_t OH_NativeXComponent_GetKeyEventDeviceId (OH_NativeXComponent_KeyEvent * keyEvent, int64_t * deviceId ) +``` + +**Description** + +Obtains the device ID of the specified key event. + +**Parameters** + +| Name | Description | +| -------- | -------------------------------------- | +| keyEvent | Pointer to the **OH_NativeXComponent_KeyEvent** instance.| +| deviceId | Pointer to the device ID of the key event. | + +**Returns** + +Returns the status code of the execution. + +**Since** + +10 + + +### OH_NativeXComponent_GetKeyEventSourceType() + +``` +int32_t OH_NativeXComponent_GetKeyEventSourceType (OH_NativeXComponent_KeyEvent * keyEvent, OH_NativeXComponent_EventSourceType * sourceType ) +``` + +**Description** + +Obtains the source type of the specified key event. + +**Parameters** + +| Name | Description | +| ---------- | -------------------------------------- | +| keyEvent | Pointer to the **OH_NativeXComponent_KeyEvent** instance.| +| sourceType | Pointer to the source type of the key event. | + +**Returns** + +Returns the status code of the execution. +**Since** + +10 + + +### OH_NativeXComponent_GetKeyEventTimeStamp() + +``` +int32_t OH_NativeXComponent_GetKeyEventTimeStamp (OH_NativeXComponent_KeyEvent * keyEvent, int64_t * timeStamp ) +``` + +**Description** + +Obtains the timestamp of the specified key event. + +**Parameters** + +| Name | Description | +| --------- | -------------------------------------- | +| keyEvent | Pointer to the **OH_NativeXComponent_KeyEvent** instance.| +| timeStamp | Pointer to the timestamp of the key event. | + +**Returns** + +Returns the status code of the execution. + +**Since** + +10 + + +### OH_NativeXComponent_GetMouseEvent() ``` int32_t OH_NativeXComponent_GetMouseEvent (OH_NativeXComponent * component, const void * window, OH_NativeXComponent_MouseEvent * mouseEvent ) @@ -323,24 +871,23 @@ Obtains the mouse event scheduled by ArkUI XComponent. **Parameters** -| Name | Description | -| ---------- | --------------------------------------- | -| component | Indicates the pointer to an **OH_NativeXComponent** instance. | -| window | Indicates the pointer to a **NativeWindow** handle. | -| mouseEvent | Indicates the pointer to the current mouse event. | +| Name | Description | +| ---------- | ----------------------------- | +| component | Pointer to the **OH_NativeXComponent** instance.| +| window | Handle to the **NativeWindow** instance. | +| mouseEvent | Pointer to the current mouse event. | **Returns** -Returns the status code of the operation. +Returns the status code of the execution. -**Since:** +**Since** 9 ### OH_NativeXComponent_GetTouchEvent() - ``` int32_t OH_NativeXComponent_GetTouchEvent (OH_NativeXComponent * component, const void * window, OH_NativeXComponent_TouchEvent * touchEvent ) ``` @@ -351,79 +898,77 @@ Obtains the touch event scheduled by the ArkUI XComponent. **Parameters** -| Name | Description | -| ---------- | --------------------------------------- | -| component | Indicates the pointer to an **OH_NativeXComponent** instance. | -| window | Indicates the pointer to a **NativeWindow** handle. | -| touchEvent | Indicates the pointer to the current touch event. | +| Name | Description | +| ---------- | ----------------------------- | +| component | Pointer to the **OH_NativeXComponent** instance.| +| window | Handle to the **NativeWindow** instance. | +| touchEvent | Pointer to the current touch event. | **Returns** -Returns the status code of the operation. +Returns the status code of the execution. -**Since:** +**Since** 8 + ### OH_NativeXComponent_GetTouchPointTiltX() - ``` int32_t OH_NativeXComponent_GetTouchPointTiltX (OH_NativeXComponent * component, uint32_t pointIndex, float * tiltX ) ``` **Description** -Obtains the angle between the tilt of the ArkUI XComponent touch point and the x-axis. +Obtains the angle between the Y-Z plane of the ArkUI XComponent touch point and the x-axis. **Parameters** -| Name | Description | -| -------- | -------- | -| component | Indicates the pointer to an **OH_NativeXComponent** instance. | -| pointIndex | Indicates the index of the pointer to a touch point. | -| tiltX | Indicates the pointer to the tilt along the x-axis. | +| Name | Description | +| ---------- | ----------------------------- | +| component | Pointer to the **OH_NativeXComponent** instance.| +| pointIndex | Pointer to the index of the touch point. | +| tiltX | Pointer to the angle between the Y-Z plane of the touch point and the x-axis. | **Returns** -Returns the status code of the operation. +Returns the status code of the execution. -**Since:** +**Since** 9 ### OH_NativeXComponent_GetTouchPointTiltY() - ``` -int32_t OH_NativeXComponent_GetTouchPointTiltX (OH_NativeXComponent * component, uint32_t pointIndex, float * tiltY ) +int32_t OH_NativeXComponent_GetTouchPointTiltY (OH_NativeXComponent * component, uint32_t pointIndex, float * tiltY ) ``` **Description** -Obtains the angle between the tilt of the ArkUI XComponent touch point and the y-axis. +Obtains the angle between the X-Z plane of the ArkUI XComponent touch point and the x-axis. **Parameters** -| Name | Description | -| -------- | -------- | -| component | Indicates the pointer to an **OH_NativeXComponent** instance. | -| pointIndex | Indicates the index of the pointer to a touch point. | -| tiltY | Indicates the pointer to the tilt along the y-axis. | +| Name | Description | +| ---------- | ----------------------------- | +| component | Pointer to the **OH_NativeXComponent** instance.| +| pointIndex | Pointer to the index of the touch point. | +| tiltY | Pointer to the angle between the X-Z plane of the touch point and the y-axis. | **Returns** -Returns the status code of the operation. +Returns the status code of the execution. -**Since:** +**Since** 9 ### OH_NativeXComponent_GetTouchPointToolType() - ``` int32_t OH_NativeXComponent_GetTouchPointToolType (OH_NativeXComponent * component, uint32_t pointIndex, OH_NativeXComponent_TouchPointToolType * toolType ) ``` @@ -434,52 +979,50 @@ Obtains the ArkUI XComponent touch point tool type. **Parameters** -| Name | Description | -| -------- | -------- | -| component | Indicates the pointer to an **OH_NativeXComponent** instance. | -| pointIndex | Indicates the index of the pointer to a touch point. | -| toolType | Indicates the pointer to the tool type. | +| Name | Description | +| ---------- | ----------------------------- | +| component | Pointer to the **OH_NativeXComponent** instance.| +| pointIndex | Pointer to the index of the touch point. | +| toolType | Pointer to the tool type. | **Returns** -Returns the status code of the operation. +Returns the status code of the execution. -**Since:** +**Since** 9 ### OH_NativeXComponent_GetXComponentId() - ``` int32_t OH_NativeXComponent_GetXComponentId (OH_NativeXComponent * component, char * id, uint64_t * size ) ``` **Description** -Obtains the ID of the ArkUI XComponent. +Obtain the ID of ArkUI XComponent. **Parameters** -| Name | Description | -| --------- | ------------------------------------- | -| component | Indicates the pointer to an **OH_NativeXComponent** instance. | -| id | Indicates the pointer to the character buffer used to hold the ID of the OH_NativeXComponent instance.
Note that the null terminator is attached to the character buffer, so the size of the character buffer should be at least one unit greater than the length of the real ID.
The recommended size of the character buffer is [OH_XCOMPONENT_ID_LEN_MAX + 1]. | -| size | Indicates the pointer to the length of the ID. | +| Name | Description | +| --------- | ---------------------------------------- | +| component | Pointer to the **OH_NativeXComponent** instance. | +| id | Pointer to the character buffer for storing the ID of the **OH_NativeXComponent** instance. Note that null terminators will be attached to the character buffer, so the size of the character buffer should be at least one unit greater than the length of the real ID. The recommended size is [OH_XCOMPONENT_ID_LEN_MAX + 1].| +| size | Pointer to the length of the ID. | **Returns** -Returns the status code of the operation. +Returns the status code of the execution. -**Since:** +**Since** 8 ### OH_NativeXComponent_GetXComponentOffset() - ``` int32_t OH_NativeXComponent_GetXComponentOffset (OH_NativeXComponent * component, const void * window, double * x, double * y ) ``` @@ -490,25 +1033,24 @@ Obtains the offset of the ArkUI XComponent relative to the upper left vertex of **Parameters** -| Name | Description | -| --------- | --------------------------------------- | -| component | Indicates the pointer to an **OH_NativeXComponent** instance. | -| window | Indicates the pointer to a **NativeWindow** handle. | -| x | Indicates the pointer to the x coordinate of the current surface. | -| y | Indicates the pointer to the y coordinate of the current surface. | +| Name | Description | +| --------- | ----------------------------- | +| component | Pointer to the **OH_NativeXComponent** instance.| +| window | Handle to the **NativeWindow** instance. | +| x | Pointer to the x coordinate of the current surface. | +| y | Pointer to the y coordinate of the current surface. | **Returns** -Returns the status code of the operation. +Returns the status code of the execution. -**Since:** +**Since** 8 ### OH_NativeXComponent_GetXComponentSize() - ``` int32_t OH_NativeXComponent_GetXComponentSize (OH_NativeXComponent * component, const void * window, uint64_t * width, uint64_t * height ) ``` @@ -519,24 +1061,49 @@ Obtains the size of the surface held by the ArkUI XComponent. **Parameters** -| Name | Description | -| --------- | --------------------------------------- | -| component | Indicates the pointer to an **OH_NativeXComponent** instance. | -| window | Indicates the pointer to a **NativeWindow** handle. | -| width | Indicates the pointer to the width of the current surface. | -| height | Indicates the pointer to the height of the current surface. | +| Name | Description | +| --------- | ----------------------------- | +| component | Pointer to the **OH_NativeXComponent** instance.| +| window | Handle to the **NativeWindow** instance. | +| width | Pointer to the width of the current surface. | +| height | Pointer to the height of the current surface. | **Returns** -Returns the status code of the operation. +Returns the status code of the execution. -**Since:** +**Since** 8 -### OH_NativeXComponent_RegisterCallback() +### OH_NativeXComponent_RegisterBlurEventCallback() +``` +int32_t OH_NativeXComponent_RegisterBlurEventCallback (OH_NativeXComponent * component, void(*)(OH_NativeXComponent *component, void *window) callback ) +``` + +**Description** + +Registers the focus loss event callback for this **OH_NativeXComponent** instance. + +**Parameters** + +| Name | Description | +| --------- | ----------------------------- | +| component | Pointer to the **OH_NativeXComponent** instance.| +| callback | Pointer to the focus loss event callback. | + +**Returns** + +Returns the status code of the execution. + +**Since** + +8 + + +### OH_NativeXComponent_RegisterCallback() ``` int32_t OH_NativeXComponent_RegisterCallback (OH_NativeXComponent * component, OH_NativeXComponent_Callback * callback ) @@ -548,43 +1115,94 @@ Registers a callback for this **OH_NativeXComponent** instance. **Parameters** -| Name | Description | -| --------- | --------------------------------------------- | -| component | Indicates the pointer to an **OH_NativeXComponent** instance. | -| callback | Indicates the pointer to the surface lifecycle and touch event callback.| +| Name | Description | +| --------- | ----------------------------- | +| component | Pointer to the **OH_NativeXComponent** instance.| +| callback | Pointer to the surface lifecycle and touch event callback. | **Returns** -Returns the status code of the operation. +Returns the status code of the execution. -**Since:** +**Since** 8 -### OH_NativeXComponent_RegisterMouseEventCallback() +### OH_NativeXComponent_RegisterFocusEventCallback() + +``` +int32_t OH_NativeXComponent_RegisterFocusEventCallback (OH_NativeXComponent * component, void(*)(OH_NativeXComponent *component, void *window) callback ) +``` + +**Description** + +Registers the focus obtaining event callback for this **OH_NativeXComponent** instance. + +**Parameters** + +| Name | Description | +| --------- | ----------------------------- | +| component | Pointer to the **OH_NativeXComponent** instance.| +| callback | Pointer to the focus obtaining event callback. | + +**Returns** + +Returns the status code of the execution. + +**Since** + +10 +### OH_NativeXComponent_RegisterKeyEventCallback() + +``` +int32_t OH_NativeXComponent_RegisterKeyEventCallback (OH_NativeXComponent * component, void(*)(OH_NativeXComponent *component, void *window) callback ) +``` + +**Description** + +Registers the key event callback for this **OH_NativeXComponent** instance. + +**Parameters** + +| Name | Description | +| --------- | ----------------------------- | +| component | Pointer to the **OH_NativeXComponent** instance.| +| callback | Pointer to the key event callback. | + +**Returns** + +Returns the status code of the execution. + +**Since** + +10 + + +### OH_NativeXComponent_RegisterMouseEventCallback() + ``` int32_t OH_NativeXComponent_RegisterMouseEventCallback (OH_NativeXComponent * component, OH_NativeXComponent_MouseEvent_Callback * callback ) ``` **Description** -Registers a mouse event callback for this **OH_NativeXComponent** instance. +Registers the mouse event callback for this **OH_NativeXComponent** instance. **Parameters** -| Name | Description | -| --------- | --------------------------------------- | -| component | Indicates the pointer to an **OH_NativeXComponent** instance. | -| callback | Indicates the pointer to the mouse event callback. | +| Name | Description | +| --------- | ----------------------------- | +| component | Pointer to the **OH_NativeXComponent** instance.| +| callback | Pointer to the mouse event callback. | **Returns** -Returns the status code of the operation. +Returns the status code of the execution. -**Since:** +**Since** 9 @@ -594,23 +1212,25 @@ Returns the status code of the operation. ### OH_XCOMPONENT_ID_LEN_MAX - ``` const uint32_t OH_XCOMPONENT_ID_LEN_MAX = 128 ``` + **Description** -Maximum length of an ArkUI XComponent ID. -**Since:** +Maximum length of the ArkUI XComponent ID. + + +**Since** + 8 ### OH_MAX_TOUCH_POINTS_NUMBER - ``` const uint32_t OH_MAX_TOUCH_POINTS_NUMBER = 10 ``` @@ -619,46 +1239,43 @@ const uint32_t OH_MAX_TOUCH_POINTS_NUMBER = 10 Maximum number of identifiable touch points in a touch event. -**Since:** +**Since** 8 ### action - ``` OH_NativeXComponent_MouseEventAction OH_NativeXComponent_MouseEvent::action ``` **Description** -Current mouse event action. +Action of the mouse event. -**Since:** +**Since** 8 ### button - ``` OH_NativeXComponent_MouseEventButton OH_NativeXComponent_MouseEvent::button ``` **Description** -Mouse event button +Mouse event button. -**Since:** +**Since** 8 ### deviceId - ``` int64_t OH_NativeXComponent_TouchEvent::deviceId = 0 ``` @@ -667,14 +1284,13 @@ int64_t OH_NativeXComponent_TouchEvent::deviceId = 0 ID of the device where the current touch event is triggered. -**Since:** +**Since** 8 ### DispatchHoverEvent - ``` void(* OH_NativeXComponent_MouseEvent_Callback::DispatchHoverEvent) (OH_NativeXComponent *component, bool isHover) ``` @@ -683,14 +1299,13 @@ void(* OH_NativeXComponent_MouseEvent_Callback::DispatchHoverEvent) (OH_NativeXC Invoked when a hover event is triggered. -**Since:** +**Since** 8 ### DispatchMouseEvent - ``` void(* OH_NativeXComponent_MouseEvent_Callback::DispatchMouseEvent) (OH_NativeXComponent *component, void *window) ``` @@ -699,14 +1314,13 @@ void(* OH_NativeXComponent_MouseEvent_Callback::DispatchMouseEvent) (OH_NativeXC Invoked when a mouse event is triggered. -**Since:** +**Since** 8 ### DispatchTouchEvent - ``` void(* OH_NativeXComponent_Callback::DispatchTouchEvent) (OH_NativeXComponent *component, void *window) ``` @@ -715,46 +1329,43 @@ void(* OH_NativeXComponent_Callback::DispatchTouchEvent) (OH_NativeXComponent *c Invoked when a touch event is triggered. -**Since:** +**Since** 8 ### force [1/2] - ``` float OH_NativeXComponent_TouchPoint::force = 0.0 ``` **Description** -Pressure of the current touch event. +Pressure of the touch event. -**Since:** +**Since** 8 ### force [2/2] - ``` float OH_NativeXComponent_TouchEvent::force = 0.0 ``` **Description** -Pressure of the current touch event. +Pressure of the touch event. -**Since:** +**Since** 8 ### id [1/2] - ``` int32_t OH_NativeXComponent_TouchPoint::id = 0 ``` @@ -763,14 +1374,13 @@ int32_t OH_NativeXComponent_TouchPoint::id = 0 Unique identifier of the finger. -**Since:** +**Since** 8 ### id [2/2] - ``` int32_t OH_NativeXComponent_TouchEvent::id = 0 ``` @@ -779,14 +1389,13 @@ int32_t OH_NativeXComponent_TouchEvent::id = 0 Unique identifier of the finger. -**Since:** +**Since** 8 ### isPressed - ``` bool OH_NativeXComponent_TouchPoint::isPressed = false ``` @@ -795,14 +1404,13 @@ bool OH_NativeXComponent_TouchPoint::isPressed = false Whether the current point is pressed. -**Since:** +**Since** 8 ### numPoints - ``` uint32_t OH_NativeXComponent_TouchEvent::numPoints = 0 ``` @@ -811,14 +1419,13 @@ uint32_t OH_NativeXComponent_TouchEvent::numPoints = 0 Number of current touch points. -**Since:** +**Since** 8 ### OnSurfaceChanged - ``` void(* OH_NativeXComponent_Callback::OnSurfaceChanged) (OH_NativeXComponent *component, void *window) ``` @@ -827,30 +1434,28 @@ void(* OH_NativeXComponent_Callback::OnSurfaceChanged) (OH_NativeXComponent *com Invoked when the surface changes. -**Since:** +**Since** 8 ### OnSurfaceCreated - ``` void(* OH_NativeXComponent_Callback::OnSurfaceCreated) (OH_NativeXComponent *component, void *window) ``` **Description** -Invoked when a surface is created. +Invoked when a surface is created. -**Since:** +**Since** 8 ### OnSurfaceDestroyed - ``` void(* OH_NativeXComponent_Callback::OnSurfaceDestroyed) (OH_NativeXComponent *component, void *window) ``` @@ -859,46 +1464,43 @@ void(* OH_NativeXComponent_Callback::OnSurfaceDestroyed) (OH_NativeXComponent *c Invoked when the surface is destroyed. -**Since:** +**Since** 8 ### screenX [1/3] - ``` float OH_NativeXComponent_TouchPoint::screenX = 0.0 ``` **Description** -X coordinate of the touch point relative to the upper left corner of the application window where the XComponent is located. +X coordinate of the touch point relative to the left edge of the application window where the XComponent is located. -**Since:** +**Since** 8 ### screenX [2/3] - ``` float OH_NativeXComponent_TouchEvent::screenX = 0.0 ``` **Description** -X coordinate of the touch point relative to the upper left corner of the application window where the XComponent is located. +X coordinate of the touch point relative to the left edge of the screen. -**Since:** +**Since** 8 ### screenX [3/3] - ``` float OH_NativeXComponent_MouseEvent::screenX ``` @@ -907,46 +1509,43 @@ float OH_NativeXComponent_MouseEvent::screenX X coordinate of the clicked point relative to the upper left corner of the screen. -**Since:** +**Since** 8 ### screenY [1/3] - ``` float OH_NativeXComponent_TouchPoint::screenY = 0.0 ``` **Description** -Y coordinate of the touch point relative to the upper left corner of the application window where the XComponent is located. +Y coordinate of the touch point relative to the left edge of the application window where the XComponent is located. -**Since:** +**Since** 8 ### screenY [2/3] - ``` float OH_NativeXComponent_TouchEvent::screenY = 0.0 ``` **Description** -Y coordinate of the touch point relative to the upper left corner of the application window where the XComponent is located. +Y coordinate of the touch point relative to the upper edge of the screen. -**Since:** +**Since** 8 ### screenY [3/3] - ``` float OH_NativeXComponent_MouseEvent::screenY ``` @@ -955,14 +1554,13 @@ float OH_NativeXComponent_MouseEvent::screenY Y coordinate of the clicked point relative to the upper left corner of the screen. -**Since:** +**Since** 8 ### size [1/2] - ``` double OH_NativeXComponent_TouchPoint::size = 0.0 ``` @@ -971,14 +1569,13 @@ double OH_NativeXComponent_TouchPoint::size = 0.0 Contact area between the finger pad and the screen. -**Since:** +**Since** 8 ### size [2/2] - ``` double OH_NativeXComponent_TouchEvent::size = 0.0 ``` @@ -987,94 +1584,88 @@ double OH_NativeXComponent_TouchEvent::size = 0.0 Contact area between the finger pad and the screen. -**Since:** +**Since** 8 ### timeStamp [1/2] - ``` long long OH_NativeXComponent_TouchPoint::timeStamp = 0 ``` **Description** -Timestamp of the current touch event. +Timestamp of the touch point. -**Since:** +**Since** 8 ### timeStamp [2/2] - ``` long long OH_NativeXComponent_TouchEvent::timeStamp = 0 ``` **Description** -Timestamp of the current touch event. +Timestamp of the touch event. -**Since:** +**Since** 8 ### timestamp - ``` int64_t OH_NativeXComponent_MouseEvent::timestamp ``` **Description** -Timestamp of the current mouse event. +Timestamp of the mouse event. -**Since:** +**Since** 8 ### touchPoints - ``` OH_NativeXComponent_TouchPoint OH_NativeXComponent_TouchEvent::touchPoints[OH_MAX_TOUCH_POINTS_NUMBER] ``` **Description** -Array of the current touch points. +Array of the touch points. -**Since:** +**Since** 8 ### type [1/2] - ``` OH_NativeXComponent_TouchEventType OH_NativeXComponent_TouchPoint::type = OH_NativeXComponent_TouchEventType::OH_NATIVEXCOMPONENT_UNKNOWN ``` **Description** -Touch type of the touch event. +Touch type of the touch point. -**Since:** +**Since** 8 ### type [2/2] - ``` OH_NativeXComponent_TouchEventType OH_NativeXComponent_TouchEvent::type = OH_NativeXComponent_TouchEventType::OH_NATIVEXCOMPONENT_UNKNOWN ``` @@ -1083,14 +1674,13 @@ OH_NativeXComponent_TouchEventType OH_NativeXComponent_TouchEvent::type = OH_Nat Touch type of the touch event. -**Since:** +**Since** 8 ### x [1/3] - ``` float OH_NativeXComponent_TouchPoint::x = 0.0 ``` @@ -1099,14 +1689,13 @@ float OH_NativeXComponent_TouchPoint::x = 0.0 X coordinate of the touch point relative to the left edge of the XComponent. -**Since:** +**Since** 8 ### x [2/3] - ``` float OH_NativeXComponent_TouchEvent::x = 0.0 ``` @@ -1115,14 +1704,13 @@ float OH_NativeXComponent_TouchEvent::x = 0.0 X coordinate of the touch point relative to the left edge of the XComponent. -**Since:** +**Since** 8 ### x [3/3] - ``` float OH_NativeXComponent_MouseEvent::x ``` @@ -1131,14 +1719,13 @@ float OH_NativeXComponent_MouseEvent::x X coordinate of the clicked point relative to the upper left corner of the component. -**Since:** +**Since** 8 ### y [1/3] - ``` float OH_NativeXComponent_TouchPoint::y = 0.0 ``` @@ -1147,14 +1734,13 @@ float OH_NativeXComponent_TouchPoint::y = 0.0 Y coordinate of the touch point relative to the upper edge of the XComponent. -**Since:** +**Since** 8 ### y [2/3] - ``` float OH_NativeXComponent_TouchEvent::y = 0.0 ``` @@ -1163,14 +1749,13 @@ float OH_NativeXComponent_TouchEvent::y = 0.0 Y coordinate of the touch point relative to the upper edge of the XComponent. -**Since:** +**Since** 8 ### y [3/3] - ``` float OH_NativeXComponent_MouseEvent::y ``` @@ -1179,6 +1764,6 @@ float OH_NativeXComponent_MouseEvent::y Y coordinate of the clicked point relative to the upper left corner of the component. -**Since:** +**Since** -8 \ No newline at end of file +8 diff --git a/en/application-dev/reference/native-apis/_o_h___native_x_component___callback.md b/en/application-dev/reference/native-apis/_o_h___native_x_component___callback.md index fd2a0ebced876c110742f8fbe75c080f218d5d6a..437c09e54c892d5e8fbe9a95d1a34ee85de2ca7d 100644 --- a/en/application-dev/reference/native-apis/_o_h___native_x_component___callback.md +++ b/en/application-dev/reference/native-apis/_o_h___native_x_component___callback.md @@ -3,7 +3,7 @@ ## Overview -Registers a callback for the surface lifecycle and touch event. +Registers callbacks for the surface lifecycle and touch event. **Since:** 8 @@ -18,9 +18,9 @@ Registers a callback for the surface lifecycle and touch event. ### Member Variables -| Name | Description | +| Name | Description | | -------- | -------- | -| [OnSurfaceCreated](_o_h___native_x_component.md#onsurfacecreated)| Invoked when a surface is created. | -| [OnSurfaceChanged](_o_h___native_x_component.md#onsurfacechanged)| Invoked when the surface changes. | -| [OnSurfaceDestroyed](_o_h___native_x_component.md#onsurfacedestroyed)| Invoked when the surface is destroyed. | -| [DispatchTouchEvent](_o_h___native_x_component.md#dispatchtouchevent)| Invoked when a touch event is triggered. | +| [OnSurfaceCreated](_o_h___native_x_component.md#onsurfacecreated)| Invoked when a surface is created. | +| [OnSurfaceChanged](_o_h___native_x_component.md#onsurfacechanged)| Invoked when the surface changes. | +| [OnSurfaceDestroyed](_o_h___native_x_component.md#onsurfacedestroyed)| Invoked when the surface is destroyed. | +| [DispatchTouchEvent](_o_h___native_x_component.md#dispatchtouchevent)| Invoked when a touch event is triggered. | diff --git a/en/application-dev/reference/native-apis/_o_h___native_x_component___mouse_event___callback.md b/en/application-dev/reference/native-apis/_o_h___native_x_component___mouse_event___callback.md index 531b6b7151febabc65b37dcfe97daa434f676825..e0942f57a86628bd9a8c72c15901e96efefb326d 100644 --- a/en/application-dev/reference/native-apis/_o_h___native_x_component___mouse_event___callback.md +++ b/en/application-dev/reference/native-apis/_o_h___native_x_component___mouse_event___callback.md @@ -3,7 +3,7 @@ ## Overview -Registers a callback for the mouse event. +Registers callbacks for the mouse event. **Since:** 9 @@ -18,7 +18,7 @@ Registers a callback for the mouse event. ### Member Variables -| Name | Description | +| Name | Description | | -------- | -------- | -| [DispatchMouseEvent](_o_h___native_x_component.md#dispatchmouseevent) | Invoked when a mouse event is triggered. | -| [DispatchHoverEvent](_o_h___native_x_component.md#dispatchhoverevent) | Invoked when a hover event is triggered. | +| [DispatchMouseEvent](_o_h___native_x_component.md#dispatchmouseevent) | Invoked when a mouse event is triggered. | +| [DispatchHoverEvent](_o_h___native_x_component.md#dispatchhoverevent) | Invoked when a hover event is triggered. | diff --git a/en/application-dev/reference/native-apis/native__interface__xcomponent_8h.md b/en/application-dev/reference/native-apis/native__interface__xcomponent_8h.md index ddd53144f6359edcebf6e3f89f209c5ec2508bb2..94e975d3f9f14342028b16fb527b4dd09f5ca87e 100644 --- a/en/application-dev/reference/native-apis/native__interface__xcomponent_8h.md +++ b/en/application-dev/reference/native-apis/native__interface__xcomponent_8h.md @@ -3,13 +3,13 @@ ## Overview -Declares the APIs used to access the native XComponent. +Declares the APIs for accessing **NativeXComponent**. -**Since:** +**Since** 8 -**Related Modules:** +**Related Modules** [Native XComponent](_o_h___native_x_component.md) @@ -19,50 +19,65 @@ Declares the APIs used to access the native XComponent. ### Structs -| Name | Description | -| -------- | -------- | -| [OH_NativeXComponent_TouchPoint](_o_h___native_x_component___touch_point.md) | Describes the touch point of the touch event. | -| [OH_NativeXComponent_TouchEvent](_o_h___native_x_component___touch_event.md) | Describes the touch event. | -| [OH_NativeXComponent_MouseEvent](_o_h___native_x_component___mouse_event.md) | Describes the mouse event.| -| [OH_NativeXComponent_Callback](_o_h___native_x_component___callback.md) | Registers a callback for the surface lifecycle and touch event. | -| [OH_NativeXComponent_MouseEvent_Callback](_o_h___native_x_component___mouse_event___callback.md) | Registers a callback for the mouse event. | +| Name | Description | +| ---------------------------------------- | --------------------- | +| [OH_NativeXComponent_TouchPoint](_o_h___native_x_component___touch_point.md) | Describes the touch point of the touch event. | +| [OH_NativeXComponent_TouchEvent](_o_h___native_x_component___touch_event.md) | Describes the touch event. | +| [OH_NativeXComponent_MouseEvent](_o_h___native_x_component___mouse_event.md) | Describes the mouse event. | +| [OH_NativeXComponent_Callback](_o_h___native_x_component___callback.md) | Registers callbacks for the surface lifecycle and touch event.| +| [OH_NativeXComponent_MouseEvent_Callback](_o_h___native_x_component___mouse_event___callback.md) | Registers callbacks for the mouse event. | ### Types -| Name | Description | -| -------- | -------- | -| [OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) | Provides an encapsulated OH_NativeXComponent instance. | -| [OH_NativeXComponent_Callback](_o_h___native_x_component.md#oh_nativexcomponent_callback) | Registers a callback for the surface lifecycle and touch event. | -| [OH_NativeXComponent_MouseEvent_Callback](_o_h___native_x_component.md#oh_nativexcomponent_mouseevent_callback) | Registers a callback for the mouse event. | +| Name | Description | +| ---------------------------------------- | ------------------------------------ | +| [OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) | Provides an encapsulated **OH_NativeXComponent** instance. | +| [OH_NativeXComponent_Callback](_o_h___native_x_component.md#oh_nativexcomponent_callback) | Registers callbacks for the surface lifecycle and touch event. | +| [OH_NativeXComponent_MouseEvent_Callback](_o_h___native_x_component.md#oh_nativexcomponent_mouseevent_callback) | Registers callbacks for the mouse event. | +| [OH_NativeXComponent_KeyEvent](_o_h___native_x_component.md#oh_nativexcomponent_keyevent) | Provides an encapsulated **OH_NativeXComponent_KeyEvent** instance.| ### Enums -| Name | Description | -| -------- | -------- | -| { OH_NATIVEXCOMPONENT_RESULT_SUCCESS = 0,
OH_NATIVEXCOMPONENT_RESULT_FAILED = -1,
OH_NATIVEXCOMPONENT_RESULT_BAD_PARAMETER = -2} | [Enumerates](_o_h___native_x_component.md#anonymous-enum) the API access states. | -| [OH_NativeXComponent_TouchEventType](_o_h___native_x_component.md#oh_nativexcomponent_toucheventtype) {
OH_NATIVEXCOMPONENT_DOWN = 0,
OH_NATIVEXCOMPONENT_UP,
OH_NATIVEXCOMPONENT_MOVE,
OH_NATIVEXCOMPONENT_CANCEL,
OH_NATIVEXCOMPONENT_UNKNOWN } | Enumerates the touch event types. | -| [OH_NativeXComponent_MouseEventAction](_o_h___native_x_component.md#oh_nativexcomponent_mouseeventaction) {
OH_NATIVEXCOMPONENT_MOUSE_NONE = 0,
OH_NATIVEXCOMPONENT_MOUSE_PRESS,
OH_NATIVEXCOMPONENT_MOUSE_RELEASE,
OH_NATIVEXCOMPONENT_MOUSE_MOVE } | Enumerates the mouse event actions. | -| [OH_NativeXComponent_MouseEventButton](_o_h___native_x_component.md#oh_nativexcomponent_mouseeventbutton) {
OH_NATIVEXCOMPONENT_NONE_BUTTON = 0,
OH_NATIVEXCOMPONENT_LEFT_BUTTON = 0x01,
OH_NATIVEXCOMPONENT_RIGHT_BUTTON = 0x02,
OH_NATIVEXCOMPONENT_MIDDLE_BUTTON = 0x04,
OH_NATIVEXCOMPONENT_BACK_BUTTON = 0x08,
OH_NATIVEXCOMPONENT_FORWARD_BUTTON = 0x10 } | Enumerates the mouse event buttons. | +| Name | Description | +| ---------------------------------------- | ---------- | +| { OH_NATIVEXCOMPONENT_RESULT_SUCCESS = 0, OH_NATIVEXCOMPONENT_RESULT_FAILED = -1, OH_NATIVEXCOMPONENT_RESULT_BAD_PARAMETER = -2 } | Enumerates the API access states.| +| [OH_NativeXComponent_TouchEventType](_o_h___native_x_component.md#oh_nativexcomponent_toucheventtype) {
OH_NATIVEXCOMPONENT_DOWN = 0, OH_NATIVEXCOMPONENT_UP, OH_NATIVEXCOMPONENT_MOVE, OH_NATIVEXCOMPONENT_CANCEL,
OH_NATIVEXCOMPONENT_UNKNOWN
} | Enumerates the touch event types. | +| [OH_NativeXComponent_TouchPointToolType](_o_h___native_x_component.md#oh_nativexcomponent_touchpointtooltype) {
OH_NATIVEXCOMPONENT_TOOL_TYPE_UNKNOWN = 0, OH_NATIVEXCOMPONENT_TOOL_TYPE_FINGER, OH_NATIVEXCOMPONENT_TOOL_TYPE_PEN, OH_NATIVEXCOMPONENT_TOOL_TYPE_RUBBER,
OH_NATIVEXCOMPONENT_TOOL_TYPE_BRUSH, OH_NATIVEXCOMPONENT_TOOL_TYPE_PENCIL, OH_NATIVEXCOMPONENT_TOOL_TYPE_AIRBRUSH, OH_NATIVEXCOMPONENT_TOOL_TYPE_MOUSE,
OH_NATIVEXCOMPONENT_TOOL_TYPE_LENS
} | Enumerates the touch point tool types. | +| [OH_NativeXComponent_EventSourceType](_o_h___native_x_component.md#oh_nativexcomponent_eventsourcetype) {
OH_NATIVEXCOMPONENT_SOURCE_TYPE_UNKNOWN = 0, OH_NATIVEXCOMPONENT_SOURCE_TYPE_MOUSE, OH_NATIVEXCOMPONENT_SOURCE_TYPE_TOUCHSCREEN, OH_NATIVEXCOMPONENT_SOURCE_TYPE_TOUCHPAD,
OH_NATIVEXCOMPONENT_SOURCE_TYPE_JOYSTICK, OH_NATIVEXCOMPONENT_SOURCE_TYPE_KEYBOARD
} | Enumerates the touch event source types. | +| [OH_NativeXComponent_MouseEventAction](_o_h___native_x_component.md#oh_nativexcomponent_mouseeventaction) { OH_NATIVEXCOMPONENT_MOUSE_NONE = 0, OH_NATIVEXCOMPONENT_MOUSE_PRESS, OH_NATIVEXCOMPONENT_MOUSE_RELEASE, OH_NATIVEXCOMPONENT_MOUSE_MOVE } | Enumerates the mouse event actions. | +| [OH_NativeXComponent_MouseEventButton](_o_h___native_x_component.md#oh_nativexcomponent_mouseeventbutton) {
OH_NATIVEXCOMPONENT_NONE_BUTTON = 0, OH_NATIVEXCOMPONENT_LEFT_BUTTON = 0x01, OH_NATIVEXCOMPONENT_RIGHT_BUTTON = 0x02, OH_NATIVEXCOMPONENT_MIDDLE_BUTTON = 0x04,
OH_NATIVEXCOMPONENT_BACK_BUTTON = 0x08, OH_NATIVEXCOMPONENT_FORWARD_BUTTON = 0x10
} | Enumerates the mouse event buttons. | ### Functions -| Name | Description | -| -------- | -------- | -| [OH_NativeXComponent_GetXComponentId](_o_h___native_x_component.md#oh_nativexcomponent_getxcomponentid) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, char \*id, uint64_t \*size) | Obtains the ID of the ArkUI XComponent. | -| [OH_NativeXComponent_GetXComponentSize](_o_h___native_x_component.md#oh_nativexcomponent_getxcomponentsize) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, const void \*window, uint64_t \*width, uint64_t \*height) | Obtains the size of the surface held by the ArkUI XComponent. | -| [OH_NativeXComponent_GetXComponentOffset](_o_h___native_x_component.md#oh_nativexcomponent_getxcomponentoffset) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, const void \*window, double \*x, double \*y) | Obtains the offset of the ArkUI XComponent relative to the upper left vertex of the screen. | -| [OH_NativeXComponent_GetTouchEvent](_o_h___native_x_component.md#oh_nativexcomponent_gettouchevent) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, const void \*window, [OH_NativeXComponent_TouchEvent](_o_h___native_x_component___touch_event.md) \*touchEvent) | Obtains the touch event scheduled by the ArkUI XComponent. | -| [OH_NativeXComponent_GetMouseEvent](_o_h___native_x_component.md#oh_nativexcomponent_getmouseevent) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, const void \*window, [OH_NativeXComponent_MouseEvent](_o_h___native_x_component___mouse_event.md) \*mouseEvent) | Obtains the mouse event scheduled by ArkUI XComponent. | -| [OH_NativeXComponent_RegisterCallback](_o_h___native_x_component.md#oh_nativexcomponent_registercallback) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, [OH_NativeXComponent_Callback](_o_h___native_x_component___callback.md) \*callback) | Registers a callback for this **OH_NativeXComponent** instance. | -| [OH_NativeXComponent_RegisterMouseEventCallback](_o_h___native_x_component.md#oh_nativexcomponent_registermouseeventcallback) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, [OH_NativeXComponent_MouseEvent_Callback](_o_h___native_x_component___mouse_event___callback.md) \*callback) | Registers a mouse event callback for this **OH_NativeXComponent** instance. | +| Name | Description | +| ---------------------------------------- | -------------------------------------- | +| [OH_NativeXComponent_GetXComponentId](_o_h___native_x_component.md#oh_nativexcomponent_getxcomponentid) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, char \*id, uint64_t \*size) | Obtains the ID of the ArkUI XComponent. | +| [OH_NativeXComponent_GetXComponentSize](_o_h___native_x_component.md#oh_nativexcomponent_getxcomponentsize) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, const void \*window, uint64_t \*width, uint64_t \*height) | Obtains the size of the surface held by the ArkUI XComponent. | +| [OH_NativeXComponent_GetXComponentOffset](_o_h___native_x_component.md#oh_nativexcomponent_getxcomponentoffset) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, const void \*window, double \*x, double \*y) | Obtains the offset of the ArkUI XComponent relative to the upper left vertex of the screen.| +| [OH_NativeXComponent_GetTouchEvent](_o_h___native_x_component.md#oh_nativexcomponent_gettouchevent) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, const void \*window, [OH_NativeXComponent_TouchEvent](_o_h___native_x_component___touch_event.md) \*touchEvent) | Obtains the touch event scheduled by the ArkUI XComponent. | +| [OH_NativeXComponent_GetTouchPointToolType](_o_h___native_x_component.md#oh_nativexcomponent_gettouchpointtooltype) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, uint32_t pointIndex, [OH_NativeXComponent_TouchPointToolType](_o_h___native_x_component.md#oh_nativexcomponent_touchpointtooltype) \*toolType) | Obtains the ArkUI XComponent touch point tool type. | +| [OH_NativeXComponent_GetTouchPointTiltX](_o_h___native_x_component.md#oh_nativexcomponent_gettouchpointtiltx) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, uint32_t pointIndex, float \*tiltX) | Obtains the angle between the Y-Z plane of the ArkUI XComponent touch point and the x-axis. | +| [OH_NativeXComponent_GetTouchPointTiltY](_o_h___native_x_component.md#oh_nativexcomponent_gettouchpointtilty) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, uint32_t pointIndex, float \*tiltY) | Obtains the angle between the Y-Z plane of the ArkUI XComponent touch point and the y-axis. | +| [OH_NativeXComponent_GetMouseEvent](_o_h___native_x_component.md#oh_nativexcomponent_getmouseevent) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, const void \*window, [OH_NativeXComponent_MouseEvent](_o_h___native_x_component___mouse_event.md) \*mouseEvent) | Obtains the mouse event scheduled by ArkUI XComponent. | +| [OH_NativeXComponent_RegisterCallback](_o_h___native_x_component.md#oh_nativexcomponent_registercallback) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, [OH_NativeXComponent_Callback](_o_h___native_x_component___callback.md) \*callback) | Registers a callback for this **OH_NativeXComponent** instance. | +| [OH_NativeXComponent_RegisterMouseEventCallback](_o_h___native_x_component.md#oh_nativexcomponent_registermouseeventcallback) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, [OH_NativeXComponent_MouseEvent_Callback](_o_h___native_x_component___mouse_event___callback.md) \*callback) | Registers the mouse event callback for this **OH_NativeXComponent** instance. | +| [OH_NativeXComponent_RegisterFocusEventCallback](_o_h___native_x_component.md#oh_nativexcomponent_registerfocuseventcallback) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, void(\*callback)([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, void \*window)) | Registers the focus obtaining event callback for this **OH_NativeXComponent** instance. | +| [OH_NativeXComponent_RegisterKeyEventCallback](_o_h___native_x_component.md#oh_nativexcomponent_registerkeyeventcallback) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, void(\*callback)([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, void \*window)) | Registers the key event callback for this **OH_NativeXComponent** instance. | +| [OH_NativeXComponent_RegisterBlurEventCallback](_o_h___native_x_component.md#oh_nativexcomponent_registerblureventcallback) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, void(\*callback)([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, void \*window)) | Registers the focus loss event callback for this **OH_NativeXComponent** instance. | +| [OH_NativeXComponent_GetKeyEvent](_o_h___native_x_component.md#oh_nativexcomponent_getkeyevent) ([OH_NativeXComponent](_o_h___native_x_component.md#oh_nativexcomponent) \*component, [OH_NativeXComponent_KeyEvent](_o_h___native_x_component.md#oh_nativexcomponent_keyevent) \*\*keyEvent) | Obtains the key event scheduled by the ArkUI XComponent. | +| [OH_NativeXComponent_GetKeyEventAction](_o_h___native_x_component.md#oh_nativexcomponent_getkeyeventaction) ([OH_NativeXComponent_KeyEvent](_o_h___native_x_component.md#oh_nativexcomponent_keyevent) \*keyEvent, [OH_NativeXComponent_KeyAction](_o_h___native_x_component.md#oh_nativexcomponent_keyaction) \*action) | Obtains the action of the specified key event. | +| [OH_NativeXComponent_GetKeyEventCode](_o_h___native_x_component.md#oh_nativexcomponent_getkeyeventcode) ([OH_NativeXComponent_KeyEvent](_o_h___native_x_component.md#oh_nativexcomponent_keyevent) \*keyEvent, [OH_NativeXComponent_KeyCode](_o_h___native_x_component.md#oh_nativexcomponent_keycode) \*code) | Obtains the key code of the specified key event. | +| [OH_NativeXComponent_GetKeyEventSourceType](_o_h___native_x_component.md#oh_nativexcomponent_getkeyeventsourcetype) ([OH_NativeXComponent_KeyEvent](_o_h___native_x_component.md#oh_nativexcomponent_keyevent) \*keyEvent, [OH_NativeXComponent_EventSourceType](_o_h___native_x_component.md#oh_nativexcomponent_eventsourcetype) \*sourceType) | Obtains the source type of the specified key event. | +| [OH_NativeXComponent_GetKeyEventDeviceId](_o_h___native_x_component.md#oh_nativexcomponent_getkeyeventdeviceid) ([OH_NativeXComponent_KeyEvent](_o_h___native_x_component.md#oh_nativexcomponent_keyevent) \*keyEvent, int64_t \*deviceId) | Obtains the device ID of the specified key event. | +| [OH_NativeXComponent_GetKeyEventTimeStamp](_o_h___native_x_component.md#oh_nativexcomponent_getkeyeventtimestamp) ([OH_NativeXComponent_KeyEvent](_o_h___native_x_component.md#oh_nativexcomponent_keyevent) \*keyEvent, int64_t \*timeStamp) | Obtains the timestamp of the specified key event. | ### Variables -| Name | Description | -| -------- | -------- | -| **OH_XCOMPONENT_ID_LEN_MAX** = 128 | Maximum length of an ArkUI XComponent ID. | -| **OH_MAX_TOUCH_POINTS_NUMBER** = 10 | Maximum number of identifiable touch points in a touch event. | +| Name | Description | +| ---------------------------------------- | ------------------------- | +| **OH_XCOMPONENT_ID_LEN_MAX** = 128 | Maximum length of the ArkUI XComponent ID.| +| **OH_MAX_TOUCH_POINTS_NUMBER** = 10 | Maximum number of identifiable touch points in a touch event. | diff --git a/en/application-dev/reference/native-apis/native__xcomponent__key__event_8h.md b/en/application-dev/reference/native-apis/native__xcomponent__key__event_8h.md new file mode 100644 index 0000000000000000000000000000000000000000..6a5e639eae245662815de9cba9a878e2733e0089 --- /dev/null +++ b/en/application-dev/reference/native-apis/native__xcomponent__key__event_8h.md @@ -0,0 +1,25 @@ +# native_xcomponent_key_event.h + + +## Overview + +Declares the enums used for accessing **NativeXComponent** key events. + +**Since** + +10 + +**Related Modules** + +[Native XComponent](_o_h___native_x_component.md) + + +## Summary + + +### Enums + +| Name| Description| +| -------- | -------- | +| [OH_NativeXComponent_KeyCode](_o_h___native_x_component.md#oh_nativexcomponent_keycode) {
KEY_UNKNOWN = -1, KEY_FN = 0, KEY_HOME = 1, KEY_BACK = 2,KEY_MEDIA_PLAY_PAUSE = 10, KEY_MEDIA_STOP = 11, KEY_MEDIA_NEXT = 12, KEY_MEDIA_PREVIOUS = 13,
KEY_MEDIA_REWIND = 14, KEY_MEDIA_FAST_FORWARD = 15, KEY_VOLUME_UP = 16, KEY_VOLUME_DOWN = 17,
KEY_POWER = 18, KEY_CAMERA = 19, KEY_VOLUME_MUTE = 22, KEY_MUTE = 23,KEY_BRIGHTNESS_UP = 40, KEY_BRIGHTNESS_DOWN = 41, KEY_0 = 2000, KEY_1 = 2001,
KEY_2 = 2002, KEY_3 = 2003, KEY_4 = 2004, KEY_5 = 2005,
KEY_6 = 2006, KEY_7 = 2007, KEY_8 = 2008, KEY_9 = 2009,
KEY_STAR = 2010, KEY_POUND = 2011, KEY_DPAD_UP = 2012, KEY_DPAD_DOWN = 2013,KEY_DPAD_LEFT = 2014, KEY_DPAD_RIGHT = 2015, KEY_DPAD_CENTER = 2016,
KEY_A = 2017,
KEY_B = 2018, KEY_C = 2019, KEY_D = 2020, KEY_E = 2021,
KEY_F = 2022, KEY_G = 2023, KEY_H = 2024, KEY_I = 2025,
KEY_J = 2026, KEY_K = 2027, KEY_L = 2028, KEY_M = 2029,
KEY_N = 2030, KEY_O = 2031, KEY_P = 2032, KEY_Q = 2033,
KEY_R = 2034, KEY_S = 2035, KEY_T = 2036, KEY_U = 2037,
KEY_V = 2038, KEY_W = 2039, KEY_X = 2040, KEY_Y = 2041,
KEY_Z = 2042, KEY_COMMA = 2043, KEY_PERIOD = 2044, KEY_ALT_LEFT = 2045,
KEY_ALT_RIGHT = 2046, KEY_SHIFT_LEFT = 2047, KEY_SHIFT_RIGHT = 2048, KEY_TAB = 2049,
KEY_SPACE = 2050, KEY_SYM = 2051, KEY_EXPLORER = 2052, KEY_ENVELOPE = 2053,
KEY_ENTER = 2054, KEY_DEL = 2055, KEY_GRAVE = 2056, KEY_MINUS = 2057,
KEY_EQUALS = 2058, KEY_LEFT_BRACKET = 2059, KEY_RIGHT_BRACKET = 2060, KEY_BACKSLASH = 2061,
KEY_SEMICOLON = 2062, KEY_APOSTROPHE = 2063, KEY_SLASH = 2064, KEY_AT = 2065,
KEY_PLUS = 2066, KEY_MENU = 2067, KEY_PAGE_UP = 2068, KEY_PAGE_DOWN = 2069,
KEY_ESCAPE = 2070, KEY_FORWARD_DEL = 2071, KEY_CTRL_LEFT = 2072, KEY_CTRL_RIGHT = 2073,
KEY_CAPS_LOCK = 2074, KEY_SCROLL_LOCK = 2075, KEY_META_LEFT = 2076, KEY_META_RIGHT = 2077,
KEY_FUNCTION = 2078, KEY_SYSRQ = 2079, KEY_BREAK = 2080, KEY_MOVE_HOME = 2081,
KEY_MOVE_END = 2082, KEY_INSERT = 2083, KEY_FORWARD = 2084, KEY_MEDIA_PLAY = 2085,
KEY_MEDIA_PAUSE = 2086, KEY_MEDIA_CLOSE = 2087, KEY_MEDIA_EJECT = 2088, KEY_MEDIA_RECORD = 2089,
KEY_F1 = 2090, KEY_F2 = 2091, KEY_F3 = 2092, KEY_F4 = 2093,
KEY_F5 = 2094, KEY_F6 = 2095, KEY_F7 = 2096, KEY_F8 = 2097,
KEY_F9 = 2098, KEY_F10 = 2099, KEY_F11 = 2100, KEY_F12 = 2101,
KEY_NUM_LOCK = 2102, KEY_NUMPAD_0 = 2103, KEY_NUMPAD_1 = 2104, KEY_NUMPAD_2 = 2105,
KEY_NUMPAD_3 = 2106, KEY_NUMPAD_4 = 2107, KEY_NUMPAD_5 = 2108, KEY_NUMPAD_6 = 2109,
KEY_NUMPAD_7 = 2110, KEY_NUMPAD_8 = 2111, KEY_NUMPAD_9 = 2112, KEY_NUMPAD_DIVIDE = 2113,
KEY_NUMPAD_MULTIPLY = 2114, KEY_NUMPAD_SUBTRACT = 2115, KEY_NUMPAD_ADD = 2116, KEY_NUMPAD_DOT = 2117,
KEY_NUMPAD_COMMA = 2118, KEY_NUMPAD_ENTER = 2119, KEY_NUMPAD_EQUALS = 2120, KEY_NUMPAD_LEFT_PAREN = 2121,
KEY_NUMPAD_RIGHT_PAREN = 2122, KEY_VIRTUAL_MULTITASK = 2210, KEY_SLEEP = 2600, KEY_ZENKAKU_HANKAKU = 2601,
KEY_102ND = 2602, KEY_RO = 2603, KEY_KATAKANA = 2604, KEY_HIRAGANA = 2605,
KEY_HENKAN = 2606, KEY_KATAKANA_HIRAGANA = 2607, KEY_MUHENKAN = 2608, KEY_LINEFEED = 2609,
KEY_MACRO = 2610, KEY_NUMPAD_PLUSMINUS = 2611, KEY_SCALE = 2612, KEY_HANGUEL = 2613,
KEY_HANJA = 2614, KEY_YEN = 2615, KEY_STOP = 2616, KEY_AGAIN = 2617,
KEY_PROPS = 2618, KEY_UNDO = 2619, KEY_COPY = 2620, KEY_OPEN = 2621,
KEY_PASTE = 2622, KEY_FIND = 2623, KEY_CUT = 2624, KEY_HELP = 2625,
KEY_CALC = 2626, KEY_FILE = 2627, KEY_BOOKMARKS = 2628, KEY_NEXT = 2629,
KEY_PLAYPAUSE = 2630, KEY_PREVIOUS = 2631, KEY_STOPCD = 2632, KEY_CONFIG = 2634,
KEY_REFRESH = 2635, KEY_EXIT = 2636, KEY_EDIT = 2637, KEY_SCROLLUP = 2638,
KEY_SCROLLDOWN = 2639, KEY_NEW = 2640, KEY_REDO = 2641, KEY_CLOSE = 2642,
KEY_PLAY = 2643, KEY_BASSBOOST = 2644, KEY_PRINT = 2645, KEY_CHAT = 2646,
KEY_FINANCE = 2647, KEY_CANCEL = 2648, KEY_KBDILLUM_TOGGLE = 2649, KEY_KBDILLUM_DOWN = 2650,
KEY_KBDILLUM_UP = 2651, KEY_SEND = 2652, KEY_REPLY = 2653, KEY_FORWARDMAIL = 2654,
KEY_SAVE = 2655, KEY_DOCUMENTS = 2656, KEY_VIDEO_NEXT = 2657, KEY_VIDEO_PREV = 2658,
KEY_BRIGHTNESS_CYCLE = 2659, KEY_BRIGHTNESS_ZERO = 2660, KEY_DISPLAY_OFF = 2661, KEY_BTN_MISC = 2662,
KEY_GOTO = 2663, KEY_INFO = 2664, KEY_PROGRAM = 2665, KEY_PVR = 2666,
KEY_SUBTITLE = 2667, KEY_FULL_SCREEN = 2668, KEY_KEYBOARD = 2669, KEY_ASPECT_RATIO = 2670,
KEY_PC = 2671, KEY_TV = 2672, KEY_TV2 = 2673, KEY_VCR = 2674,
KEY_VCR2 = 2675, KEY_SAT = 2676, KEY_CD = 2677, KEY_TAPE = 2678,
KEY_TUNER = 2679, KEY_PLAYER = 2680, KEY_DVD = 2681, KEY_AUDIO = 2682,
KEY_VIDEO = 2683, KEY_MEMO = 2684, KEY_CALENDAR = 2685, KEY_RED = 2686,
KEY_GREEN = 2687, KEY_YELLOW = 2688, KEY_BLUE = 2689, KEY_CHANNELUP = 2690,
KEY_CHANNELDOWN = 2691, KEY_LAST = 2692, KEY_RESTART = 2693, KEY_SLOW = 2694,
KEY_SHUFFLE = 2695, KEY_VIDEOPHONE = 2696, KEY_GAMES = 2697, KEY_ZOOMIN = 2698,
KEY_ZOOMOUT = 2699, KEY_ZOOMRESET = 2700, KEY_WORDPROCESSOR = 2701, KEY_EDITOR = 2702,
KEY_SPREADSHEET = 2703, KEY_GRAPHICSEDITOR = 2704, KEY_PRESENTATION = 2705, KEY_DATABASE = 2706,
KEY_NEWS = 2707, KEY_VOICEMAIL = 2708, KEY_ADDRESSBOOK = 2709, KEY_MESSENGER = 2710,
KEY_BRIGHTNESS_TOGGLE = 2711, KEY_SPELLCHECK = 2712, KEY_COFFEE = 2713, KEY_MEDIA_REPEAT = 2714,
KEY_IMAGES = 2715, KEY_BUTTONCONFIG = 2716, KEY_TASKMANAGER = 2717, KEY_JOURNAL = 2718,
KEY_CONTROLPANEL = 2719, KEY_APPSELECT = 2720, KEY_SCREENSAVER = 2721, KEY_ASSISTANT = 2722,
KEY_KBD_LAYOUT_NEXT = 2723, KEY_BRIGHTNESS_MIN = 2724, KEY_BRIGHTNESS_MAX = 2725, KEY_KBDINPUTASSIST_PREV = 2726,
KEY_KBDINPUTASSIST_NEXT = 2727, KEY_KBDINPUTASSIST_PREVGROUP = 2728, KEY_KBDINPUTASSIST_NEXTGROUP = 2729, KEY_KBDINPUTASSIST_ACCEPT = 2730,
KEY_KBDINPUTASSIST_CANCEL = 2731, KEY_FRONT = 2800, KEY_SETUP = 2801, KEY_WAKEUP = 2802,
KEY_SENDFILE = 2803, KEY_DELETEFILE = 2804, KEY_XFER = 2805, KEY_PROG1 = 2806,
KEY_PROG2 = 2807, KEY_MSDOS = 2808, KEY_SCREENLOCK = 2809, KEY_DIRECTION_ROTATE_DISPLAY = 2810,
KEY_CYCLEWINDOWS = 2811, KEY_COMPUTER = 2812, KEY_EJECTCLOSECD = 2813, KEY_ISO = 2814,
KEY_MOVE = 2815, KEY_F13 = 2816, KEY_F14 = 2817, KEY_F15 = 2818,
KEY_F16 = 2819, KEY_F17 = 2820, KEY_F18 = 2821, KEY_F19 = 2822,
KEY_F20 = 2823, KEY_F21 = 2824, KEY_F22 = 2825, KEY_F23 = 2826,
KEY_F24 = 2827, KEY_PROG3 = 2828, KEY_PROG4 = 2829, KEY_DASHBOARD = 2830,
KEY_SUSPEND = 2831, KEY_HP = 2832, KEY_SOUND = 2833, KEY_QUESTION = 2834,
KEY_CONNECT = 2836, KEY_SPORT = 2837, KEY_SHOP = 2838, KEY_ALTERASE = 2839,
KEY_SWITCHVIDEOMODE = 2841, KEY_BATTERY = 2842, KEY_BLUETOOTH = 2843, KEY_WLAN = 2844,
KEY_UWB = 2845, KEY_WWAN_WIMAX = 2846, KEY_RFKILL = 2847, KEY_CHANNEL = 3001,
KEY_BTN_0 = 3100, KEY_BTN_1 = 3101, KEY_BTN_2 = 3102, KEY_BTN_3 = 3103,
KEY_BTN_4 = 3104, KEY_BTN_5 = 3105, KEY_BTN_6 = 3106, KEY_BTN_7 = 3107,
KEY_BTN_8 = 3108, KEY_BTN_9 = 3109
} | Enumerates the mouse event key codes.| +| [OH_NativeXComponent_KeyAction](_o_h___native_x_component.md#oh_nativexcomponent_keyaction) { OH_NATIVEXCOMPONENT_KEY_ACTION_UNKNOWN = -1, OH_NATIVEXCOMPONENT_KEY_ACTION_DOWN = 0, OH_NATIVEXCOMPONENT_KEY_ACTION_UP } | Enumerates the key event actions.| diff --git a/en/application-dev/ui/arkts-common-components-xcomponent.md b/en/application-dev/ui/arkts-common-components-xcomponent.md index b6bdb5633f2275fda550f7ae2c6c7f75ed420d0f..95d8f30eb1802159a76389f56519d44ef75b5261 100644 --- a/en/application-dev/ui/arkts-common-components-xcomponent.md +++ b/en/application-dev/ui/arkts-common-components-xcomponent.md @@ -205,15 +205,15 @@ XComponent({ id: 'xcomponentId1', type: 'surface', libraryname: 'nativerender' } > While this mode also uses the NAPI mechanism as the **import** mode, it enables you to use the NDK APIs of the **\**, by having the **NativeXComponent** instance of the **\** exposed to the native layer of the application when the dynamic library is loaded. - **onLoad** event - - Trigger time: when the surface of the **\** is prepared. + - Trigger time: when the surface of the **\** is ready. - **context** parameter: where the native API exposed on the module is mounted. Its usage is similar to the usage of the **context2** instance obtained after the module is directly loaded using **import context2 from "libnativerender.so"**. - - Time sequence: When the **onLoad** event is subject to the surface. The following figure shows the time sequence of the **onLoad** event and the **OnSurfaceCreated** event on the native side. + - Time sequence: subject to the surface. The figure below shows the time sequence of the **onLoad** event and the **OnSurfaceCreated** event at the native layer. ![onLoad](figures/onLoad.png) - **onDestroy** event - Trigger time: when the **\** is destroyed, in the same manner as that when an ArkUI component is destroyed. The following figure shows the time sequence of the **onDestroy** event and the **OnSurfaceDestroyed** event on the native side. + Trigger time: when the **\** is destroyed, in the same manner as that when an ArkUI component is destroyed. The figure below shows the time sequence of the **onDestroy** event and the **OnSurfaceDestroyed** event at the native layer. ![onDestroy](figures/onDestroy.png) @@ -222,7 +222,7 @@ XComponent({ id: 'xcomponentId1', type: 'surface', libraryname: 'nativerender' } The surface held by the **\** complies with the producer-consumer model. -In OpenHarmony, components that comply with the producer design, such as the camera and video player, can write data to the surface held by the **\** and display the data through the **\**. +In OpenHarmony, components that comply with the producer design, such as the Camera and AVPlayer components, can write data to the surface held by the **\** and display the data through the **\**. ![picture-1](figures/picture-1.png) diff --git a/en/application-dev/ui/arkts-drawing-customization-on-canvas.md b/en/application-dev/ui/arkts-drawing-customization-on-canvas.md index c98fa5c4886de3d32b6346c21b85b3a2ab4d4921..e0db4fefccd08eebf02f08bfaa8d839f0cc77daa 100644 --- a/en/application-dev/ui/arkts-drawing-customization-on-canvas.md +++ b/en/application-dev/ui/arkts-drawing-customization-on-canvas.md @@ -53,8 +53,8 @@ You can draw custom graphics on the canvas in any of the following ways: // Configure the parameters of the CanvasRenderingContext2D and OffscreenCanvasRenderingContext2D objects, including whether to enable anti-aliasing. The value true indicates that anti-aliasing is enabled. private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - // Create an OffscreenCanvasRenderingContext2D object. width indicates the width of the offscreen canvas, and height indicates the height of the offscreen canvas. - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + // Create an OffscreenCanvas object. width indicates the width of the offscreen canvas, and height indicates the height of the offscreen canvas. + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) build() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { @@ -63,10 +63,11 @@ You can draw custom graphics on the canvas in any of the following ways: .height('100%') .backgroundColor('#F5DC62') .onReady(() =>{ + var offContext = this.offCanvas.getContext("2d", this.settings) // You can draw content here. - this.offContext.strokeRect(50, 50, 200, 150); + offContext.strokeRect(50, 50, 200, 150); // Display the image rendered by the offscreen drawing value on the common canvas. - let image = this.offContext.transferToImageBitmap(); + let image = this.offCanvas.transferToImageBitmap(); this.context.transferFromImageBitmap(image); }) } @@ -113,7 +114,7 @@ Canvas(this.context) ## Canvas Component Drawing Modes -Two modes are available for drawing with the **Canvas** component: +Two modes are available for drawing with the **Canvas** component: - After the **onReady()** callback of the **Canvas** component is invoked, use the **CanvasRenderingContext2D** and **OffscreenCanvasRenderingContext2D** objects to call related APIs for drawing. @@ -154,9 +155,8 @@ Two modes are available for drawing with the **Canvas** component: **OffscreenCanvasRenderingContext2D** and **CanvasRenderingContext2D** provide a large number of attributes and methods, which can be used to draw text and graphics and process pixels. They are the core of the **Canvas** component. Common APIs include [fill](../reference/arkui-ts/ts-canvasrenderingcontext2d.md#fill), [clip](../reference/arkui-ts/ts-canvasrenderingcontext2d.md#clip), and [stroke](../reference/arkui-ts/ts-canvasrenderingcontext2d.md#stroke). In addition, [fillStyle](../reference/arkui-ts/ts-canvasrenderingcontext2d.md#fillstyle), [globalAlpha](../reference/arkui-ts/ts-canvasrenderingcontext2d.md#globalalpha), [strokeStyle](../reference/arkui-ts/ts-canvasrenderingcontext2d.md#strokestyle), and more attributes are provided to spruce up the graphics. This topic describes typical usage of the canvas. - Draw a basic shape. - You can draw a basic shape by calling APIs such as [arc](../reference/arkui-ts/ts-canvasrenderingcontext2d.md#arc), [ellipse](../reference/arkui-ts/ts-canvasrenderingcontext2d.md#ellipse), and [rect](../reference/arkui-ts/ts-canvasrenderingcontext2d.md#rect). - + ```ts Canvas(this.context) .width('100%') @@ -175,12 +175,12 @@ Two modes are available for drawing with the **Canvas** component: this.context.beginPath(); this.context.ellipse(150, 450, 50, 100, Math.PI * 0.25, Math.PI * 0, Math.PI * 2); this.context.stroke(); - }) - + }) + ``` - -![2023022794521(1)](figures/2023022794521(1).jpg) - + + ![2023022794521(1)](figures/2023022794521(1).jpg) + - Draw text. You can use APIs such as [fillText](../reference/arkui-ts/ts-canvasrenderingcontext2d.md#filltext) and [strokeText](../reference/arkui-ts/ts-canvasrenderingcontext2d.md#stroketext) to draw text. @@ -212,7 +212,7 @@ Two modes are available for drawing with the **Canvas** component: struct GetImageData { private settings: RenderingContextSettings = new RenderingContextSettings(true) private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) - private offContext: OffscreenCanvasRenderingContext2D = new OffscreenCanvasRenderingContext2D(600, 600, this.settings) + private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600) private img:ImageBitmap = new ImageBitmap("/common/images/1234.png") build() { @@ -222,14 +222,15 @@ Two modes are available for drawing with the **Canvas** component: .height('100%') .backgroundColor('#F5DC62') .onReady(() =>{ + var offContext = this.offCanvas.getContext("2d", this.settings) // Use the drawImage API to draw an image in the area with the width and height of 130 starting from (0, 0). - this.offContext.drawImage(this.img,0,0,130,130); + offContext.drawImage(this.img,0,0,130,130); // Use the getImageData API to obtain the image data with the width and height of 130 starting from (50, 50). - let imagedata = this.offContext.getImageData(50,50,130,130); + let imagedata = offContext.getImageData(50,50,130,130); // Use the putImageData API to draw the obtained image data in the area starting from (150, 150). - this.offContext.putImageData(imagedata,150,150); + offContext.putImageData(imagedata,150,150); // Draw the offscreen drawing content to the canvas. - let image = this.offContext.transferToImageBitmap(); + let image = this.offCanvas.transferToImageBitmap(); this.context.transferFromImageBitmap(image); }) } diff --git a/en/application-dev/ui/figures/picture-1.png b/en/application-dev/ui/figures/picture-1.png index 85e91bba345c1b0012d0c6f031baa7ee43ef867a..427fcdf017b7eaa1e8db8edaa4554f7b796cccf2 100644 Binary files a/en/application-dev/ui/figures/picture-1.png and b/en/application-dev/ui/figures/picture-1.png differ diff --git a/en/device-dev/Readme-EN.md b/en/device-dev/Readme-EN.md index bdc67baaa1f21c752fd5d34f16adb0de34e933be..f259aa35bc14089cdb69439971c55a3278942634 100644 --- a/en/device-dev/Readme-EN.md +++ b/en/device-dev/Readme-EN.md @@ -34,6 +34,7 @@ - [Kernel for the Standard System](kernel/kernel-standard-overview.md) - [Driver](driver/Readme-EN.md) - [Compilation and Building](subsystems/subsys-build-all.md) + - [ArkUI](subsystems/subsys-arkui-customize_titlebar.md) - [Graphics](subsystems/subsys-graphics-overview.md) - [Multimedia](subsystems/subsys-multimedia-camera-overview.md) - [Utils](subsystems/subsys-utils-guide.md) @@ -51,10 +52,8 @@ - [Mini- and Small-System Devices](guide/device-wlan-led-control.md) - [Standard-System Devices](guide/device-clock-guide.md) - Debugging - - [Test Case Development](device-test/developer_test.md) + - [Device Test](device-test/Readme-EN.md) - [R&D Tools](subsystems/subsys-toolchain-hdc-guide.md) -- XTS Certification - - [XTS Test Case Development](device-test/xts.md) - Tools - [Docker Environment](get-code/gettools-acquire.md) - [IDE](get-code/gettools-ide.md) diff --git a/en/device-dev/device-test/developer_test.md b/en/device-dev/device-test/developer_test.md index d9e0550b975785a9946c057980c608054e6fdda3..a3d699e62c32a222ab10d8a8c24cf0babd48267d 100644 --- a/en/device-dev/device-test/developer_test.md +++ b/en/device-dev/device-test/developer_test.md @@ -8,7 +8,7 @@ OpenHarmony provides you with a comprehensive development self-test framework ** This document describes how to use the development self-test framework of OpenHarmony. -### Introduction +### Overview After adding or modifying code, OpenHarmony developers want to quickly verify whether the modified code functions properly, and the system already has a large number of automated test cases of existing functions, such as TDD cases and XTS cases. The development self-test framework aims to help you improve your self-test efficiency so that you can quickly execute the specified automated test cases and conducting development tests at the development phase. @@ -18,7 +18,7 @@ After adding or modifying code, OpenHarmony developers want to quickly verify wh When executing test cases using the framework, you must connect to the OpenHarmony device in advance. -## Environment Preparations +## Environment Setup The development self-test framework depends on the Python environment. It is required that the Python version be 3.7.5 or later. Before using the framework, you can refer to the following document for configuration. @@ -28,16 +28,20 @@ Click [here](https://gitee.com/openharmony/docs/blob/master/en/device-dev/get-co | Environment Dependency | Version | Description | | ----------------- | ------------------------------------------------------------ | ------------------------------------------------------------ | -| Operating system | Ubuntu 18.04 or later | Code compilation environment. | +| Operating system | Ubuntu 20.04 or later | Code compilation environment. | | Linux extension component| libreadline-dev | Plugin used to read commands. | | python | 3.7.5 or later | Language used by the test framework. | | Python plugins | pyserial 3.3 or later, paramiko 2.7.1 or later, setuptools 40.8.0 or later, and rsa4.0 or later| - **pserial**: supports Python serial port communication.
- **paramiko**: allows Python to use SSH.
- **setuptools**: allows Python packages to be created and distributed easily.
- **rsa**: implements RSA encryption in Python.| | NFS Server | haneWIN NFS Server 1.2.50 or later or NFS v4 or later | Devices can be connected using serial ports. Mini- and small-system devices are used. | -| HDC | 1.1.0 | A tool that enables devices to be connected through the HarmonyOS Device Connector (HDC). | +| HDC | 1.2.0a | A tool that enables devices to be connected through the OpenHarmony Device Connector (HDC). | -1. Run the following command to install the Linux extended component readline: +1. Install Ubuntu. + + As Ubuntu 20 has built-in Python 3.8.5, you do not need to install Python separately. + +2. Run the following command to install the Linux extended component readline: ```bash sudo apt-get install libreadline-dev @@ -91,7 +95,9 @@ Click [here](https://gitee.com/openharmony/docs/blob/master/en/device-dev/get-co 6. Install the NFS server if the device outputs results only through the serial port. - > This step is applicable to small-system or mini-system devices. + > ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** + > + > This operation applies to small-system or mini-system devices, not standard-system devices. - Windows OS: Install the **haneWIN NFS Server1.2.50** package. - Linux OS: Run the following command to install the NFS server: @@ -107,299 +113,34 @@ Click [here](https://gitee.com/openharmony/docs/blob/master/en/device-dev/get-co 0 upgraded, 0 newly installed, 0 to remove and 11 not upgraded. ``` -7. If the device supports HDC connection, install the HDC tool. For details about the installation process, see [HDC-OpenHarmony device connector](https://gitee.com/openharmony/developtools_hdc/blob/master/README.md). +7. If the device supports HDC connection, install the HDC tool. For details about the installation process, see [HDC-OpenHarmony Device Connector](https://gitee.com/openharmony/developtools_hdc/blob/master/README.md). ### Environment Dependency Check -| Check Item | Operation | Requirement | +| Check Item | Action | Requirement | | -------------------------------------------------- | --------------------------------------------------- | ------------------------- | | Check whether Python is installed successfully. | Run the **python --version** command. | The Python version is 3.7.5 or later. | | Check whether Python plugins are successfully installed. | Go to the **test/developertest** directory and run **start.bat** or **start.sh**.| The **>>>** prompt is displayed.| | Check the NFS server status (for the devices that support only serial port output).| Log in to the development board through the serial port and run the **mount** command to mount the NFS. | The file directory can be mounted. | -| Check whether the HDC is successfully installed. | Run the **hdc_std -v** command. | The HDC version is 1.1.0 or later. | +| Check whether the HDC is successfully installed. | Run the **hdc -v** command. | The HDC version is 1.2.0a or later. | ## Test Case Preparation -The test framework supports multiple types of tests and provides different test case templates for them._ +The test framework supports multiple types of tests and provides different test case templates for them. **TDD Test (C++)** -Naming rules for source files - -The source file name of test cases must be the same as that of the test suite. The file names must use lowercase letters and in the *Function*_*Sub-function*_**test** format. More specific sub-functions can be added as required. -Example: -``` -calculator_sub_test.cpp -``` - -Test case example -```c++ -/* - * Copyright (c) 2021 XXXX Device Co., Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -#include "calculator.h" -#include - -using namespace testing::ext; - -class CalculatorSubTest : public testing::Test { -public: - static void SetUpTestCase(void); - static void TearDownTestCase(void); - void SetUp(); - void TearDown(); -}; - -void CalculatorSubTest::SetUpTestCase(void) -{ - // Set a setup function, which will be called before all test cases. -} - -void CalculatorSubTest::TearDownTestCase(void) -{ - // Set a teardown function, which will be called after all test cases. -} - -void CalculatorSubTest::SetUp(void) -{ - // Set a setup function, which will be called before all test cases. -} - -void CalculatorSubTest::TearDown(void) -{ - // Set a teardown function, which will be called after all test cases. -} - -/** - * @tc.name: integer_sub_001 - * @tc.desc: Verify the sub function. - * @tc.type: FUNC - * @tc.require: issueNumber - */ -HWTEST_F(CalculatorSubTest, integer_sub_001, TestSize.Level1) -{ - // Step 1 Call the function to obtain the test result. - int actual = Sub(4, 0); - - // Step 2 Use an assertion to compare the obtained result with the expected result. - EXPECT_EQ(4, actual); -} -``` -The procedure is as follows: - -1. Add comment information to the test case file header. - -``` -/* - * Copyright (c) 2021 XXXX Device Co., Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -``` - -2. Add the test framework header file and namespace. - -```c++ -#include - -using namespace testing::ext; -``` - -3. Add the header file of the test class. - -```c++ -#include "calculator.h" -``` - -4. Define the test suite (test class). - -```c++ -class CalculatorSubTest : public testing::Test { -public: - static void SetUpTestCase(void); - static void TearDownTestCase(void); - void SetUp(); - void TearDown(); -}; - -void CalculatorSubTest::SetUpTestCase(void) -{ - // Set a setup function, which will be called before all test cases. -} - -void CalculatorSubTest::TearDownTestCase(void) -{ - // Set a teardown function, which will be called after all test cases. -} - -void CalculatorSubTest::SetUp(void) -{ - // Set a setup function, which will be called before all test cases. -} - -void CalculatorSubTest::TearDown(void) -{ - // Set a teardown function, which will be called after all test cases. -}== -``` -> **NOTE** -> -> When defining a test suite, ensure that the test suite name is the same as the target to build and uses the upper camel case style. - -5. Add implementation of the test cases, including test case comments and logic. - -```c++ -/** - * @tc.name: integer_sub_001 - * @tc.desc: Verify the sub function. - * @tc.type: FUNC - * @tc.require: issueNumber - */ -HWTEST_F(CalculatorSubTest, integer_sub_001, TestSize.Level1) -{ - // Step 1 Call the function to obtain the test result. - int actual = Sub(4, 0); - - // Step 2 Use an assertion to compare the obtained result with the expected result. - EXPECT_EQ(4, actual); -} -``` -> **NOTE** -> -> @tc.require: The format must be started with **AR/SR** or **issue**, for example, **issueI56WJ7**. - -The following test case templates are provided for your reference. - -| Type | Description | -| --------------- | ------------------------------------------------ | -| HWTEST(A,B,C) | Use this template if the test case execution does not depend on setup or teardown. | -| HWTEST_F(A,B,C) | Use this template if the test case execution (excluding parameters) depends on setup or teardown.| -| HWTEST_P(A,B,C) | Use this template if the test case execution (including parameters) depends on setup or teardown. | - -In the template names: - -- **A** indicates the test suite name. - -- **B** indicates the test case name, which is in the *Function*_*No.* format. The *No.* is a three-digit number starting from **001**. - -- *C* indicates the test case level. There are five test case levels: guard-control level 0 and non-guard-control level 1 to level 4. Of levels 1 to 4, a smaller value indicates a more important function verified by the test case. - - -**NOTE** - -- The expected result of each test case must have an assertion. - -- The test case level must be specified. - -- It is recommended that the test be implemented step by step according to the template. - -- The comment must contain the test case name, description, type, and requirement number, which are in the @tc.*xxx*: *value* format. The test case type @**tc.type** can be any of the following: - - -| Test Case Type| Code| -| ------------ | -------- | -| Function test | FUNC | -| Performance test | PERF | -| Reliability test | RELI | -| Security test | SECU | -| Fuzzing test | FUZZ | - -**TDD Test (JS)** - - Naming rules for source files + The source file name of test cases must be the same as that of the test suite. The file names must use lowercase letters and in the [Function]\_[Sub-function]\_**test** format. More specific sub-functions can be added as required. -The source file name of a test case must be in the *Function**Sub-function***Test** format, and each part must use the upper camel case style. More specific sub-functions can be added as required. -Example: -``` -AppInfoTest.js -``` - -- Test case example -```js -/* - * Copyright (C) 2021 XXXX Device Co., Ltd. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -import app from '@system.app' - -import {describe, beforeAll, beforeEach, afterEach, afterAll, it, expect} from 'deccjsunit/index' - -describe("AppInfoTest", function () { - beforeAll(function() { - // Set a setup function, which will be called before all test cases. - console.info('beforeAll caled') - }) - - afterAll(function() { - // Set a teardown function, which will be called after all test cases. - console.info('afterAll caled') - }) - - beforeEach(function() { - // Set a setup function, which will be called before all test cases. - console.info('beforeEach caled') - }) - - afterEach(function() { - // Set a teardown function, which will be called after all test cases. - console.info('afterEach caled') - }) - - /* - * @tc.name:appInfoTest001 - * @tc.desc:verify app info is not null - * @tc.type: FUNC - * @tc.require: issueNumber - */ - it("appInfoTest001", 0, function () { - // Step 1 Call the function to obtain the test result. - var info = app.getInfo() - - // Step 2 Use an assertion to compare the obtained result with the expected result. - expect(info != null).assertEqual(true) - }) -}) -``` -The procedure is as follows: -1. Add comment information to the test case file header. +- The following uses **calculator_sub_test.cpp** as an example to describe how to compile a single-thread test case: ``` /* - * Copyright (C) 2021 XXXX Device Co., Ltd. + * Copyright (c) 2023 XXXX Device Co., Ltd. * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at @@ -412,55 +153,446 @@ The procedure is as follows: * See the License for the specific language governing permissions and * limitations under the License. */ - ``` -2. Import the APIs and JSUnit test library to test. - ```js - import app from '@system.app' - import {describe, beforeAll, beforeEach, afterEach, afterAll, it, expect} from 'deccjsunit/index' - ``` -3. Define the test suite (test class). - ```js - describe("AppInfoTest", function () { - beforeAll(function() { - // Set a setup function, which will be called before all test cases. - console.info('beforeAll caled') - }) - - afterAll(function() { - // Set a teardown function, which will be called after all test cases. - console.info('afterAll caled') - }) - - beforeEach(function() { - // Set a setup function, which will be called before all test cases. - console.info('beforeEach caled') - }) - - afterEach(function() { - // Set a teardown function, which will be called after all test cases. - console.info('afterEach caled') - }) - ``` -4. Add implementation of the test cases. - ```JS - /* - * @tc.name:appInfoTest001 - * @tc.desc:verify app info is not null + #include "calculator.h" + #include + + using namespace testing::ext; + + class CalculatorSubTest : public testing::Test { + public: + static void SetUpTestCase(void); + static void TearDownTestCase(void); + void SetUp(); + void TearDown(); + }; + + void CalculatorSubTest::SetUpTestCase(void) + { + // Set a setup function, which will be called before all test cases. + } + + void CalculatorSubTest::TearDownTestCase(void) + { + // Set a teardown function, which will be called after all test cases. + } + + void CalculatorSubTest::SetUp(void) + { + // Set a setup function, which will be called before all test cases. + } + + void CalculatorSubTest::TearDown(void) + { + // Set a teardown function, which will be called after all test cases. + } + + /** + * @tc.name: integer_sub_001 + * @tc.desc: Verify the sub function. * @tc.type: FUNC * @tc.require: issueNumber */ - it("appInfoTest001", 0, function () { + HWTEST_F(CalculatorSubTest, integer_sub_001, TestSize.Level1) + { // Step 1 Call the function to obtain the test result. - var info = app.getInfo() + int actual = Sub(4, 0); // Step 2 Use an assertion to compare the obtained result with the expected result. - expect(info != null).assertEqual(true) - }) + EXPECT_EQ(4, actual); + } ``` - > **NOTE** - > - > @tc.require: The format must be started with **issue**, for example, **issueI56WJ7**. + The procedure is as follows: + 1. Add comment information to the test case file header. + ``` + /* + * Copyright (c) 2023 XXXX Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + ``` + 2. Add the test framework header file and namespace. + ``` + #include + + using namespace testing::ext; + ``` + 3. Add the header file of the test class. + ``` + #include "calculator.h" + ``` + 4. Define the test suite (test class). + > When defining a test suite, ensure that the test suite name is the same as the target to build and uses the upper camel case style. + ``` + class CalculatorSubTest : public testing::Test { + public: + static void SetUpTestCase(void); + static void TearDownTestCase(void); + void SetUp(); + void TearDown(); + }; + + void CalculatorSubTest::SetUpTestCase(void) + { + // Set a setup function, which will be called before all test cases. + } + + void CalculatorSubTest::TearDownTestCase(void) + { + // Set a teardown function, which will be called after all test cases. + } + + void CalculatorSubTest::SetUp(void) + { + // Set a setup function, which will be called before all test cases. + } + + void CalculatorSubTest::TearDown(void) + { + // Set a teardown function, which will be called after all test cases. + } + ``` + + 5. Add implementation of the test cases, including test case comments and logic. + ``` + /** + * @tc.name: integer_sub_001 + * @tc.desc: Verify the sub function. + * @tc.type: FUNC + * @tc.require: issueNumber + */ + HWTEST_F(CalculatorSubTest, integer_sub_001, TestSize.Level1) + { + // Step 1 Call the function to obtain the test result. + int actual = Sub(4, 0); + + // Step 2 Use an assertion to compare the obtained result with the expected result. + EXPECT_EQ(4, actual); + } + ``` + > ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** + > + > The value of **@tc.require** must start with AR/SR or issue, for example, **issueI56WJ7**. + +- The following uses base_object_test.cpp as an example to describe how to compile a multi-thread test case: + ``` + // The test case file header comment and test case comment are the same as those in the single-thread test case example. + + #include "base_object.h" + #include + #include + #include + + using namespace testing::ext; + using namespace testing::mt; + + namespace OHOS { + namespace AAFwk { + class AAFwkBaseObjectTest : public testing::Test {......} + + // Step 1 Set the function to be tested to return the factorial result. + int factorial(int n) + { + int result = 1; + for (int i = 1; i <= n; i++) { + result *= i; + } + printf("Factorial Function Result : %d! = %d\n", n, result); + return result; + } + + // Step 2 Use an assertion to compare the obtained result with the expected result. + void factorial_test() + { + int ret = factorial(3); // Call the function to obtain the result. + std::thread::id this_id = std::this_thread::get_id(); + std::ostringstream oss; + oss << this_id; + std::string this_id_str = oss.str(); + long int thread_id = atol(this_id_str.c_str()); + printf("running thread...: %ld\n", thread_id); // Output the ID of the running thread. + EXPECT_EQ(ret, 6); + } + + HWTEST_F(AAFwkBaseObjectTest, Factorial_test_001, TestSize.Level1) + { + SET_THREAD_NUM(4); + printf("Factorial_test_001 BEGIN\n"); + GTEST_RUN_TASK(factorial_test); + printf("Factorial_test_001 END\n"); + } + + HWMTEST_F(AAFwkBaseObjectTest, Factorial_test_002, TestSize.Level1, 6) + { + printf("Factorial_test_002 BEGIN\n"); + factorial_test(); + printf("Factorial_test_002 END\n"); + } + + } // namespace AAFwk + } // namespace OHOS + + ``` + The procedure is as follows: + 1. Add comment information to the test case file header. + + > **NOTE**
The standard is the same as that of the single-thread test case. + + 2. Add the test framework header file and namespace. + ``` + #include + #include + #include + using namespace testing::ext; + using namespace testing::mt; + ``` + 3. Add the header file of the test class. + ``` + #include "base_object.h" + ``` + 4. Define the test suite (test class). + ``` + class AAFwkBaseObjectTest : public testing::Test {......} + + ``` + > **NOTE**
The standard is the same as that of the single-thread test case. + + 5. Add implementation of the test cases, including test case comments and logic. + + ``` + // Step 1 Set the function to be tested to return the factorial result. + int factorial(int n) + { + int result = 1; + for (int i = 1; i <= n; i++) { + result *= i; + } + printf("Factorial Function Result : %d! = %d\n", n, result); + return result; + } + + // Step 2 Use an assertion to compare the obtained result with the expected result. + void factorial_test() + { + int ret = factorial(3); // Call the function to obtain the result. + std::thread::id this_id = std::this_thread::get_id(); + std::ostringstream oss; + oss << this_id; + std::string this_id_str = oss.str(); + long int thread_id = atol(this_id_str.c_str()); + printf("running thread...: %ld\n", thread_id); // Output the ID of the running thread. + EXPECT_EQ(ret, 6); + } + + // GTEST_RUN_TASK(TestFunction) is a multi-thread startup function. The parameter is a custom function. + // If SET_THREAD_NUM() is not called, the default value 10 will be used. + HWTEST_F(AAFwkBaseObjectTest, Factorial_test_001, TestSize.Level1) + { + SET_THREAD_NUM(4); // Set the number of threads. It can be dynamically set in the same test suite. + printf("Factorial_test_001 BEGIN\n"); + GTEST_RUN_TASK(factorial_test); // Start the multi-thread execution of the factorial_test task. + printf("Factorial_test_001 END\n"); + } + + // HWMTEST_F(TEST_SUITE, TEST_TC, TEST_LEVEL, THREAD_NUM) + // THREAD_NUM can be used to set the number of threads for executing a test case. + // HWMTEST_F creates a specified number of threads and executes the tested function. + HWMTEST_F(AAFwkBaseObjectTest, Factorial_test_002, TestSize.Level1, 6) + { + printf("Factorial_test_002 BEGIN\n"); + factorial_test(); + printf("Factorial_test_002 END\n"); + } + // Add the multi-thread API MTEST_ADD_TASK(THREAD_ID,ThreadTestFunc). Multiple threads are registered but are not executed in this test case. Instead, they are executed later in a unified manner. This API is applicable to the multi-thread test in the scenario where multiple test cases are combined. + // THREAD_ID is used to distinguish threads and starts from 0. You can also use a random thread ID by passing in RANDOM_THREAD_ID. In this scenario, each thread ID is unique. + // Add the multi-thread API MTEST_POST_RUN() to execute the previously registered threads in a unified manner. + ``` + > **NOTE**
The comments for multi-thread test cases are the same as those of single-thread test cases. + +- About C++ test case templates: + + The following test case templates are provided for your reference. + + | Type| Description| + | ------------| ------------| + | HWTEST(A,B,C)| Use this template if the test case execution does not depend on setup or teardown.| + | HWTEST_F(A,B,C)| Use this template if the test case execution (excluding parameters) depends on setup and teardown.| + | HWMTEST_F(A,B,C,D)| Use this template if the multi-thread test case execution depends on setup and teardown.| + | HWTEST_P(A,B,C)| Use this template if the test case execution (including parameters) depends on setup and teardown.| + + + In the template names: + + - **A** indicates the test suite name. + + - **B** indicates the test case name, which is in the *Function*_*No.* format. The *No.* is a three-digit number starting from **001**. + + - **C** indicates the test case level. There are five test case levels: guard-control level 0 and non-guard-control level 1 to level 4. Of levels 1 to 4, a smaller value indicates a more important function verified by the test case. + + - **D** indicates the number of threads for executing the multi-thread test case. + + **Note**: + + - The expected result of each test case must have an assertion. + + - The test case level must be specified. + + - It is recommended that the test be implemented step by step according to the template. + + - The test case description is in the standard @tc.*xxx* *value* format. The comment must contain the test case name, description, type, and requirement number. The test case type @tc.type can be any of the following: + + + | Test Case Type | Code | + | ------------ | -------- | + | Function test | FUNC | + | Performance Test | PERF | + | Reliability test | RELI | + | Security Test | SECU | + | Fuzz test | FUZZ | + +**TDD Test (JavaScript)** + +- Naming rules for source files + + + The source file name of a test case must be in the [Function][Sub-function]**Test** format, and each part must use the upper camel case style. More specific sub-functions can be added as required. + Example: + ``` + AppInfoTest.js + ``` + +- Test case example + + ```js + /* + * Copyright (C) 2023 XXXX Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + import app from '@system.app' + + import {describe, beforeAll, beforeEach, afterEach, afterAll, it, expect} from 'deccjsunit/index' + + describe("AppInfoTest", function () { + beforeAll(function() { + // Set a setup function, which will be called before all test cases. + console.info('beforeAll caled') + }) + + afterAll(function() { + // Set a teardown function, which will be called after all test cases. + console.info('afterAll caled') + }) + + beforeEach(function() { + // Set a setup function, which will be called before all test cases. + console.info('beforeEach caled') + }) + + afterEach(function() { + // Set a teardown function, which will be called after all test cases. + console.info('afterEach caled') + }) + + /* + * @tc.name:appInfoTest001 + * @tc.desc:verify app info is not null + * @tc.type: FUNC + * @tc.require: issueNumber + */ + it("appInfoTest001", 0, function () { + // Step 1 Call the function to obtain the test result. + var info = app.getInfo() + + // Step 2 Use an assertion to compare the obtained result with the expected result. + expect(info != null).assertEqual(true) + }) + }) + ``` + The procedure is as follows: + 1. Add comment information to the test case file header. + ``` + /* + * Copyright (C) 2023 XXXX Device Co., Ltd. + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + ``` + 2. Import the APIs and JSUnit test library to test. + ```js + import app from '@system.app' + + import {describe, beforeAll, beforeEach, afterEach, afterAll, it, expect} from 'deccjsunit/index' + ``` + 3. Define the test suite (test class). + ```js + describe("AppInfoTest", function () { + beforeAll(function() { + // Set a setup function, which will be called before all test cases. + console.info('beforeAll caled') + }) + + afterAll(function() { + // Set a teardown function, which will be called after all test cases. + console.info('afterAll caled') + }) + + beforeEach(function() { + // Set a setup function, which will be called before all test cases. + console.info('beforeEach caled') + }) + + afterEach(function() { + // Set a teardown function, which will be called after all test cases. + console.info('afterEach caled') + }) + ``` + 4. Write test cases + ```JS + /* + * @tc.name:appInfoTest001 + * @tc.desc:verify app info is not null + * @tc.type: FUNC + * @tc.require: issueNumber + */ + it("appInfoTest001", 0, function () { + // Step 1 Call the function to obtain the test result. + var info = app.getInfo() + + // Step 2 Use an assertion to compare the obtained result with the expected result. + expect(info != null).assertEqual(true) + }) + ``` + > ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** + > + > The value of **@tc.require** must start with AR/SR or issue, for example, **issueI56WJ7**. **Fuzzing Test** @@ -481,325 +613,447 @@ The following provides templates for different languages for your reference. - **Test case build file example (C++)** -``` -# Copyright (c) 2021 XXXX Device Co., Ltd. - -import("//build/test.gni") + ``` + # Copyright (c) 2023 XXXX Device Co., Ltd. -module_output_path = "developertest/calculator" + import("//build/test.gni") -config("module_private_config") { - visibility = [ ":*" ] + module_output_path = "developertest/calculator" - include_dirs = [ "../../../include" ] -} + config("module_private_config") { + visibility = [ ":*" ] -ohos_unittest("CalculatorSubTest") { - module_out_path = module_output_path + include_dirs = [ "../../../include" ] + } - sources = [ - "../../../include/calculator.h", - "../../../src/calculator.cpp", - ] + ohos_unittest("CalculatorSubTest") { + module_out_path = module_output_path - sources += [ "calculator_sub_test.cpp" ] + sources = [ + "../../../include/calculator.h", + "../../../src/calculator.cpp", + ] - configs = [ ":module_private_config" ] + sources += [ "calculator_sub_test.cpp" ] - deps = [ "//third_party/googletest:gtest_main" ] -} + configs = [ ":module_private_config" ] -group("unittest") { - testonly = true - deps = [":CalculatorSubTest"] -} -``` -The procedure is as follows: + deps = [ "//third_party/googletest:gtest_main" ] + } -1. Add comment information for the file header. - ``` - # Copyright (c) 2021 XXXX Device Co., Ltd. - ``` -2. Import the build template. - ``` - import("//build/test.gni") - ``` -3. Specify the file output path. - ``` - module_output_path = "developertest/calculator" - ``` - > **NOTE**
The output path is ***Part name*/*Module name***. - -4. Configure the directories for dependencies. - - ``` - config("module_private_config") { - visibility = [ ":*" ] - - include_dirs = [ "../../../include" ] - } - ``` - > **NOTE** - > - > Generally, the dependency directories are configured here and directly referenced in the build script of the test case. - -5. Set the output build file for the test cases. - - ``` - ohos_unittest("CalculatorSubTest") { - } - ``` -6. Write the build script (add the source file, configuration, and dependencies) for the test cases. - ``` - ohos_unittest("CalculatorSubTest") { - module_out_path = module_output_path - sources = [ - "../../../include/calculator.h", - "../../../src/calculator.cpp", - "../../../test/calculator_sub_test.cpp" - ] - sources += [ "calculator_sub_test.cpp" ] - configs = [ ":module_private_config" ] - deps = [ "//third_party/googletest:gtest_main" ] - } - ``` - - > **NOTE** - > - > Set the test type based on actual requirements. The following test types are available: - > - > - **ohos_unittest**: unit test - > - **ohos_moduletest**: module test - > - **ohos_systemtest**: system test - > - **ohos_performancetest**: performance test - > - **ohos_securitytest**: security test - > - **ohos_reliabilitytest**: reliability test - > - **ohos_distributedtest**: distributed test - -7. Group the test case files by test type. - - ``` - group("unittest") { - testonly = true - deps = [":CalculatorSubTest"] - } - ``` - > **NOTE** - > - > Grouping test cases by test type allows you to execute a specific type of test cases when required. + group("unittest") { + testonly = true + deps = [":CalculatorSubTest"] + } + ``` + The procedure is as follows: + + 1. Add comment information for the file header. + ``` + # Copyright (c) 2023 XXXX Device Co., Ltd. + ``` + 2. Import the build template. + ``` + import("//build/test.gni") + ``` + 3. Specify the file output path. + ``` + module_output_path = "developertest/calculator" + ``` + > ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** + > + > The output path is the *Part name*/*Module name*. + + 4. Configure the directories for dependencies. + + ``` + config("module_private_config") { + visibility = [ ":*" ] + + include_dirs = [ "../../../include" ] + } + ``` + > ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** + > + > Generally, the dependency directories are configured here and directly referenced in the build script of the test case. + + 5. Set the output build file for the test cases. + + ``` + ohos_unittest("CalculatorSubTest") { + } + ``` + 6. Write the build script (add the source file, configuration, and dependencies) for the test cases. + ``` + ohos_unittest("CalculatorSubTest") { + module_out_path = module_output_path + sources = [ + "../../../include/calculator.h", + "../../../src/calculator.cpp", + "../../../test/calculator_sub_test.cpp" + ] + sources += [ "calculator_sub_test.cpp" ] + configs = [ ":module_private_config" ] + deps = [ "//third_party/googletest:gtest_main" ] + } + ``` + + > ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** + > + > Set the test type based on actual requirements. The following test types are available: + > - **ohos_unittest**: unit test + > - **ohos_js_unittest**: FA model JS unit test + > - **ohos_js_stage_unittest**: stage model ArkTS unit test + > - **ohos_moduletest**: module test + > - **ohos_systemtest**: system test + > - **ohos_performancetest**: performance test + > - **ohos_securitytest**: security test + > - **ohos_reliabilitytest**: reliability test + > - **ohos_distributedtest**: distributed test + + 7. Group the test case files by test type. + + ``` + group("unittest") { + testonly = true + deps = [":CalculatorSubTest"] + } + ``` + > ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** + > + > Grouping test cases by test type allows you to execute a specific type of test cases when required. - **Test case build file example (JavaScript)** -``` -# Copyright (C) 2021 XXXX Device Co., Ltd. - -import("//build/test.gni") - -module_output_path = "developertest/app_info" - -ohos_js_unittest("GetAppInfoJsTest") { - module_out_path = module_output_path - - hap_profile = "./config.json" - certificate_profile = "//test/developertest/signature/openharmony_sx.p7b" -} - -group("unittest") { - testonly = true - deps = [ ":GetAppInfoJsTest" ] -} -``` - -The procedure is as follows: - -1. Add comment information for the file header. - -``` -# Copyright (C) 2021 XXXX Device Co., Ltd. -``` + ``` + # Copyright (C) 2023 XXXX Device Co., Ltd. -2. Import the build template. + import("//build/test.gni") -``` -import("//build/test.gni") -``` + module_output_path = "developertest/app_info" -3. Specify the file output path. + ohos_js_unittest("GetAppInfoJsTest") { + module_out_path = module_output_path -``` -module_output_path = "developertest/app_info" -``` -> **NOTE** -> -> The output path is ***Part name*/*Module name***. + hap_profile = "./config.json" + certificate_profile = "//test/developertest/signature/openharmony_sx.p7b" + } -4. Set the output build file for the test cases. + group("unittest") { + testonly = true + deps = [ ":GetAppInfoJsTest" ] + } + ``` -``` -ohos_js_unittest("GetAppInfoJsTest") { -} -``` -> **NOTE** -> - Use the **ohos_js_unittest** template to define the JavaScript test suite. Pay attention to the difference between JavaScript and C++. -> - The file generated for the JavaScript test suite must be in .hap format and named after the test suite name defined here. The test suite name must end with **JsTest**. + The procedure is as follows: + + 1. Add comment information for the file header. + + ``` + # Copyright (C) 2023 XXXX Device Co., Ltd. + ``` + + 2. Import the build template. + + ``` + import("//build/test.gni") + ``` + + 3. Specify the file output path. + + ``` + module_output_path = "developertest/app_info" + ``` + > ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** + > + > The output path is the *Part name*/*Module name*. + + 4. Set the output build file for the test cases. + + ``` + ohos_js_unittest("GetAppInfoJsTest") { + } + ``` + > ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** + > + > - Use the **ohos_js_unittest** template to define the JavaScript test suite. Pay attention to the difference between JavaScript and C++. + > - The file generated for the JavaScript test suite must be in .hap format and named after the test suite name defined here. The test suite name must end with **JsTest**. + + 5. Configure the **config.json** file and signature file, which are mandatory. + + ``` + ohos_js_unittest("GetAppInfoJsTest") { + module_out_path = module_output_path + + hap_profile = "./config.json" + certificate_profile = "//test/developertest/signature/openharmony_sx.p7b" + } + ``` + **config.json** is the configuration file required for HAP build. You need to set **target** based on the tested SDK version. Default values can be retained for other items. The following is an example: + + ```json + { + "app": { + "bundleName": "com.example.myapplication", + "vendor": "example", + "version": { + "code": 1, + "name": "1.0" + }, + "apiVersion": { + "compatible": 4, + "target": 5 // Set it based on the tested SDK version. In this example, SDK5 is used. + } + }, + "deviceConfig": {}, + "module": { + "package": "com.example.myapplication", + "name": ".MyApplication", + "deviceType": [ + "phone" + ], + "distro": { + "deliveryWithInstall": true, + "moduleName": "entry", + "moduleType": "entry" + }, + "abilities": [ + { + "skills": [ + { + "entities": [ + "entity.system.home" + ], + "actions": [ + "action.system.home" + ] + } + ], + "name": "com.example.myapplication.MainAbility", + "icon": "$media:icon", + "description": "$string:mainability_description", + "label": "MyApplication", + "type": "page", + "launchType": "standard" + } + ], + "js": [ + { + "pages": [ + "pages/index/index" + ], + "name": "default", + "window": { + "designWidth": 720, + "autoDesignWidth": false + } + } + ] + } + } + ``` + + 6. Group the test case files by test type. + + ``` + group("unittest") { + testonly = true + deps = [ ":GetAppInfoJsTest" ] + } + ``` + > ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** + > + > Grouping test cases by test type allows you to execute a specific type of test cases when required. + +- **Example of ArkTS case compilation configuration for the stage model** -5. Configure the **config.json** file and signature file, which are mandatory. + ``` + # Copyright (C) 2023 XXXX Device Co., Ltd. + + import("//build/test.gni") -``` -ohos_js_unittest("GetAppInfoJsTest") { - module_out_path = module_output_path - - hap_profile = "./config.json" - certificate_profile = "//test/developertest/signature/openharmony_sx.p7b" -} -``` -**config.json** is the configuration file required for HAP build. You need to set **target** based on the tested SDK version. Default values can be retained for other items. The following is an example: - -```json -{ - "app": { - "bundleName": "com.example.myapplication", - "vendor": "example", - "version": { - "code": 1, - "name": "1.0" - }, - "apiVersion": { - "compatible": 4, - "target": 5 // Set it based on the tested SDK version. In this example, SDK5 is used. + want_output_path = "developertest/stage_test" + + ohos_js_stage_unittest("ActsBundleMgrStageEtsTest") { + hap_profile = "entry/src/main/module.json" + deps = [ + ":actbmsstageetstest_js_assets", + ":actbmsstageetstest_resources", + ] + ets2abc = true + certificate_profile = "signature/openharmony_sx.p7b" + hap_name = "ActsBundleMgrStageEtsTest" + subsystem_name = "developertest" + part_name = "stage_test" + module_out_path = want_output_path } - }, - "deviceConfig": {}, - "module": { - "package": "com.example.myapplication", - "name": ".MyApplication", - "deviceType": [ - "phone" - ], - "distro": { - "deliveryWithInstall": true, - "moduleName": "entry", - "moduleType": "entry" - }, - "abilities": [ - { - "skills": [ - { - "entities": [ - "entity.system.home" - ], - "actions": [ - "action.system.home" - ] - } - ], - "name": "com.example.myapplication.MainAbility", - "icon": "$media:icon", - "description": "$string:mainability_description", - "label": "MyApplication", - "type": "page", - "launchType": "standard" - } - ], - "js": [ - { - "pages": [ - "pages/index/index" - ], - "name": "default", - "window": { - "designWidth": 720, - "autoDesignWidth": false - } - } - ] + ohos_app_scope("actbmsstageetstest_app_profile") { + app_profile = "AppScope/app.json" + sources = [ "AppScope/resources" ] } - } -``` - -6. Group the test case files by test type. - -``` -group("unittest") { - testonly = true - deps = [ ":GetAppInfoJsTest" ] -} -``` -> **NOTE** -> -> Grouping test cases by test type allows you to execute a specific type of test cases when required. - -**Fuzzing Test** - -[Fuzzing case specifications](https://gitee.com/openharmony/test_developertest/blob/master/libs/fuzzlib/README_zh.md) - -**Benchmark Test** - -[Benchmark case specifications](https://gitee.com/openharmony/test_developertest/blob/master/libs/benchmark/README_zh.md) - - -**Configuring ohos.build** + ohos_js_assets("actbmsstageetstest_js_assets") { + source_dir = "entry/src/main/ets" + } + ohos_resources("actbmsstageetstest_resources") { + sources = [ "entry/src/main/resources" ] + deps = [ ":actbmsstageetstest_app_profile" ] + hap_profile = "entry/src/main/module.json" + } + group("unittest") { + testonly = true + deps = [] + deps += [ ":ActsBundleMgrStageEtsTest" ] + } + ``` + The procedure is as follows: + + 1. Add comment information for the file header. + + ``` + # Copyright (C) 2023 XXXX Device Co., Ltd. + ``` + + 2. Import the build template. + + ``` + import("//build/test.gni") + ``` + + 3. Specify the file output path. + + ``` + want_output_path = "developertest/stage_test" + ``` + > ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** + > + > The output path is the *Part name*/*Module name*. + + 4. Set the output build file for the test cases. + + ``` + ohos_js_stage_unittest("ActsBundleMgrStageEtsTest") { + } + ``` + > ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** + > + > Use the **ohos_js_stage_unittest** template to define the ArkTS test suite for the stage model. + + 5. Specify the configuration file **module.json**, signature file, part name, and compilation output path, which are all mandatory. + + ``` + ohos_js_stage_unittest("ActsBundleMgrStageEtsTest") { + hap_profile = "entry/src/main/module.json" + certificate_profile = "signature/openharmony_sx.p7b" + subsystem_name = "developertest" + part_name = "stage_test" // Part name + } + ``` + + 6. Specify the configuration resource file (add the source files, configurations, and dependencies). + ``` + # Declare an AppScope module for the HAP. Those specified by app_profile and sources will be combined to a specific entry file for compilation. + ohos_app_scope("actbmsstageetstest_app_profile") { + app_profile = "AppScope/app.json" + sources = [ "AppScope/resources" ] + } + + # Place the test case code for the stage model in the ets directory. + ohos_js_assets("actbmsstageetstest_js_assets") { + source_dir = "entry/src/main/ets" + } + + # Source files are stored in the resources directory after compilation in the stage model. + ohos_resources("actbmsstageetstest_resources") { + sources = [ "entry/src/main/resources" ] + deps = [ ":actbmsstageetstest_app_profile" ] + hap_profile = "entry/src/main/module.json" + } + + ``` + + 7. Group the test case files by test type. + + ``` + group("unittest") { + testonly = true + deps = [ ":GetAppInfoJsTest" ] + } + ``` + > ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** + > + > Grouping test cases by test type allows you to execute a specific type of test cases when required. + +**Configuring bundle.json** Configure the part build file to associate with specific test cases. ``` -"partA": { - "module_list": [ - +"build": { + "sub_component": [ + "//test/testfwk/developer_test/examples/app_info:app_info", + "//test/testfwk/developer_test/examples/detector:detector", + "//test/testfwk/developer_test/examples/calculator:calculator" ], "inner_list": [ - - ], - "system_kits": [ - + { + "header": { + "header_base": "////test/testfwk/developer_test/examples/detector/include", + "header_files": [ + "detector.h" + ] + }, + "name": "//test/testfwk/developer_test/examples/detector:detector" + } ], - "test_list": [ // Test under configuration module calculator. - "//system/subsystem/partA/calculator/test:unittest", - "//system/subsystem/partA/calculator/test:fuzztest", - "//system/subsystem/partA/calculator/test:benchmarktest" + "test": [ // Test under configuration module calculator. + "//test/testfwk/developer_test/examples/app_info/test:unittest", + "//test/testfwk/developer_test/examples/calculator/test:unittest", + "//test/testfwk/developer_test/examples/calculator/test:fuzztest" } ``` -> **NOTE**
**test_list** contains the test cases of the corresponding module. +> ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** +> +> **test_list** contains the test cases of the corresponding module. ## Configuring Test Resources -Test resources include external file resources, such as image files, video files, and third-party libraries, required for test case execution. +The test resources mainly include external file resources such as image files, video files, and third-party libraries required during test case execution. Currently, only static resources can be configured. Perform the following steps: -1. Create a **resource** directory under the **test** directory of the part, create a corresponding module directory under the **resource** directory, and store the resource files required in this module directory. +1. Create the **resource** directory in the **test** directory of the part, and create a directory for the module in the **resource** directory to store resource files of the module. 2. In the module directory under **resource**, create the **ohos_test.xml** file in the following format: -```xml - - - - - - - -``` + ```xml + + + + + + + + ``` -3. In the build file of the test cases, configure **resource_config_file** to point to the resource file **ohos_test.xml**. + 3. In the build file of the test cases, configure **resource_config_file** to point to the resource file **ohos_test.xml**. -``` -ohos_unittest("CalculatorSubTest") { - resource_config_file = "//system/subsystem/partA/test/resource/calculator/ohos_test.xml" -} -``` ->**NOTE** ->- **target_name** indicates the test suite name defined in the **BUILD.gn** file in the **test** directory. **preparer** indicates the action to perform before the test suite is executed. ->- **src="res"** indicates that the test resources are in the **resource** directory under the **test** directory. **src="out"** indicates that the test resources are in the **out/release/$(*part*)** directory. + ``` + ohos_unittest("CalculatorSubTest") { + resource_config_file = "//system/subsystem/partA/test/resource/calculator/ohos_test.xml" + } + ``` + > ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** + > + >- **target_name** indicates the test suite name defined in the **BUILD.gn** file in the **test** directory. **preparer** indicates the action to perform before the test suite is executed. + >- **src="res"** indicates that the test resources are in the **resource** directory under the **test** directory. **src="out"** indicates that the test resources are in the **out/release/$(*part*)** directory. ## Test Case Execution -### Configuration File +### Configuration File user_config.xml -Before executing test cases, you need to modify the configuration based on the device used. +Before executing test cases, you need to modify the configuration in **developer_test\config\user_config.xml** based on the device used. -#### Modifying user_config.xml ```xml @@ -849,11 +1103,50 @@ Before executing test cases, you need to modify the configuration based on the d ``` ->**NOTE** -> ->If HDC is connected to the device before the test cases are executed, you only need to configure the device IP address and port number, and retain the default settings for other parameters. +> ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** +> +> If HDC is connected to the device before the test cases are executed, you only need to configure the device IP address and port number, and retain the default settings for other parameters. -### Command Description +### Executing Test Cases on Windows +#### **Test Case Building** + +Test cases cannot be built on Windows. You need to run the following command to build test cases on Linux: +``` +./build.sh --product-name {product_name} --build-target make_test +``` + +> ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** +> +>- **product-name**: specifies the name of the product to be compiled. +>- **build-target**: specifies the test case to build. **make_test** indicates all test cases. You can specify the test cases based on requirements. + +When the build is complete, the test cases are automatically saved in **out/ohos-arm-release/packages/phone/tests**. + +#### Setting Up the Execution Environment +1. On Windows, create the **Test** directory in the test framework and then create the **testcase** directory in the **Test** directory. + +2. Copy **developertest** and **xdevice** from the Linux environment to the **Test** directory on Windows, and copy the test cases to the **testcase** directory. + + > ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** + > + > Port the test framework and test cases from the Linux environment to the Windows environment for subsequent execution. + +3. Modify the **user_config.xml** file. + ```xml + + + false + + + + D:\Test\testcase\tests + + ``` + > ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** + > + > **\** indicates whether to build test cases. **\** indicates the path for searching for test cases. + +#### Executing Test Cases 1. Start the test framework. ``` @@ -865,96 +1158,198 @@ Before executing test cases, you need to modify the configuration based on the d If you need to manually add a product, add it within the **\** tag to **config/framework_config.xml**. -3. Execute test cases. +3. Execute the test cases. - Run the following command to execute test cases: - ``` - run -t UT -ts CalculatorSubTest -tc interger_sub_00l - ``` - In the command: - ``` - -**t [TESTTYPE]**: specifies the test type, which can be **UT**, **MST**, **ST**, **PERF**, **FUZZ**, or **BENCHMARK**. This parameter is mandatory. - -**tp [TESTPART]**: specifies the part to test. This parameter can be used independently. - -**tm [TESTMODULE]**: specifies the module to test. This parameter must be specified together with **-tp**. - -**ts [TESTSUITE]**: specifies a test suite. This parameter can be used independently. - -**tc [TESTCASE]**: specifies a test case. This parameter must be specified together with **-ts**. - -**h**: displays help information. - ``` + Run the following commands to execute test cases: + ``` + run -t UT + run -t UT -tp PartName + run -t UT -tp PartName -tm TestModuleName + run -t UT -tp ability_base -ts base_object_test + run -t UT -tp PartName -tm TestModuleName -ts CalculatorSubTest + run -t UT -ts base_object_test + run -t UT -ts base_object_test -tc AAFwkBaseObjectTest.BaseObject_test_001 + run -t UT -ts CalculatorSubTest -tc CalculatorSubTest.interger_sub_00l + run -t UT -cov coverage + run -t UT -ra random + run -t UT -ts base_object_test --repeat 5 + run -hl + run -rh 3 + run --retry + ``` -#### Executing Test Cases on Windows + + In the command: + ``` + -**t [TESTTYPE]**: specifies the test type, which can be **UT**, **MST**, **ST**, **PERF**, **FUZZ**, **BENCHMARK**, **ACTS**, **HATS**, and more. This parameter is mandatory. + -**tp [TESTPART]**: specifies the part to test. This parameter can be used independently. + -**tm [TESTMODULE]**: specifies the module to test. This parameter must be specified together with **-tp**. + -**ts [TESTSUITE]**: specifies the test suite. This parameter can be used independently. + -**tc [TESTCASE]**: specifies the test case. This parameter must be specified together with **-ts** to indicate the test suite. + -**cov [COVERAGE]**: specifies the coverage. + -**h**: displays help information. + -**ra [random]**: specifies the out-of-order execution for C++ cases. + --**repeat**: specifies the number of case execution times. + -**hl [HISTORYLIST]**: enables the display of the latest 10 test cases. If there are more than 10 test cases, only the latest 10 test cases are displayed. + -**rh [RUNHISTORY]**: specifies the sequence number of the historical record to execute. + --**retry**: checks the last execution result and re-runs the failed test cases, if any. + ``` -Test cases cannot be built on Windows. You need to run the following command to build test cases on Linux: -``` -./build.sh --product-name {product_name} --build-target make_test -``` + +### Executing Test Cases on Linux ->**NOTE** ->- **product-name**: specifies the name of the product to be compiled. ->- **build-target**: specifies the test case to build. **make_test** indicates all test cases. You can specify the test cases based on requirements. -After the build is complete, the test cases are automatically saved in **out/ohos-arm-release/packages/phone/tests**. +#### Configuring Remote Port Mapping and Modifying Configuration File +To enable test cases to be executed on a remote Linux server or a Linux VM, map the port to enable communication between the device and the remote server or VM. Configure port mapping as follows: +1. On the HDC server, run the following commands: + ``` + hdc_std kill + hdc_std -m -s 0.0.0.0:8710 + ``` + > ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** + > + > The IP address and port number are default values. -##### Setting Up the Execution Environment -1. On Windows, create the **Test** directory in the test framework and then create the **testcase** directory in the **Test** directory. +2. On the HDC client, run the following command: + ``` + hdc_std -s xx.xx.xx.xx:8710 list targets + ``` + > ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** + > + > Enter the IP address of the device to test. -2. Copy **developertest** and **xdevice** from the Linux environment to the **Test** directory on Windows, and copy the test cases to the **testcase** directory. +3. Modify the **user_config.xml** file. + ```xml + + + true + + + + + + + + + + ``` - >**NOTE** - > - >Port the test framework and test cases from the Linux environment to the Windows environment for subsequent execution. -3. Modify the **user_config.xml** file. - ```xml - - - false - - - - D:\Test\testcase\tests - - ``` - >**NOTE** - > - >**\** indicates whether to build test cases. **\** indicates the path for searching for test cases. +#### Executing Test Cases +1. Start the test framework. + ``` + ./start.sh + ``` +2. Select the product. -#### Executing Test Cases on Linux + After the test framework starts, you are asked to select a product. Select the development board to test. -If you directly connect to a Linux host, you can directly run commands to execute test cases. + If the displayed product list does not contain the target one, you can add it in the **\** tag in **config/framework_config.xml**. -##### Mapping the Remote Port -To enable test cases to be executed on a remote Linux server or a Linux VM, map the port to enable communication between the device and the remote server or VM. Configure port mapping as follows: -1. On the HDC server, run the following commands: - ``` - hdc_std kill - hdc_std -m -s 0.0.0.0:8710 - ``` - >**NOTE** - > - >The IP address and port number are default values. + ``` + + + + -2. On the HDC client, run the following command: - ``` - hdc_std -s xx.xx.xx.xx:8710 list targets - ``` - >**NOTE** - > - >Enter the IP address of the device to test. + ``` + +3. Execute the test cases. + + 1. TDD commands + + The test framework locates the test cases based on the command, and automatically builds and executes the test cases. + ``` + run -t UT + run -t UT -tp PartName + run -t UT -tp PartName -tm TestModuleName + run -t UT -tp ability_base -ts base_object_test + run -t UT -tp PartName -tm TestModuleName -ts CalculatorSubTest + run -t UT -ts base_object_test + run -t UT -ts base_object_test -tc AAFwkBaseObjectTest.BaseObject_test_001 + run -t UT -ts CalculatorSubTest -tc CalculatorSubTest.interger_sub_00l + run -t -cov coverage + run -t UT -ra random + run -t UT -tp PartName -pd partdeps + run -t UT -ts base_object_test --repeat 5 + run -hl + run -rh 3 + run --retry + ``` + In the command: + ``` + -**t [TESTTYPE]**: specifies the test type, which can be **UT**, **MST**, **ST**, **PERF**, **FUZZ**, and **BENCHMARK**. This parameter is mandatory. + -**tp [TESTPART]**: specifies the part to test. This parameter can be used independently. + -**tm [TESTMODULE]**: specifies the module to test. This parameter must be specified together with **-tp**. + -**ts [TESTSUITE]**: specifies the test suite. This parameter can be used independently. + -**tc [TESTCASE]**: specifies the test case. This parameter must be specified together with **-ts** to indicate the test suite. + -**cov [COVERAGE]**: specifies the coverage. + -**h**: displays help information. + -**ra [random]**: specifies the out-of-order execution for C++ cases. + -**pd [partdeps]**: specifies execution parameter of the level-2 part dependencies. + --**repeat**: specifies the number of case execution times. + -**hl [HISTORYLIST]**: enables the display of the latest 10 test cases. If there are more than 10 test cases, only the latest 10 test cases are displayed. + -**rh [RUNHISTORY]**: specifies the sequence number of the historical record to execute. + --**retry**: checks the last execution result and re-runs the failed test cases, if any. + ``` + + In Linux, you can run the following commands to view the supported product forms, test types, subsystems, and parts. + ``` + To view the help information, run **help**. + To view the **show** command, run **help show**. + To view the supported product forms, run **show productlist**. + To view the supported test types, run **show typelist**. + To view the supported test subsystems, run **show subsystemlist** . + To view the supported test parts, run **show partlist**. + ``` + 2. ACTS/HATS commands + + After selecting the product, you can refer to the following to execute the ACTS or HATS test cases. + ``` + run -t ACTS + run -t HATS + run -t ACTS -ss arkui + run -t ACTS -ss arkui, modulemanager + run -t ACTS -ss arkui -ts ActsAceEtsTest + run -t HATS -ss telephony -ts HatsHdfV1RilServiceTest + run -t ACTS -ss arkui -tp ActsPartName + run -t ACTS -ss arkui -ts ActsAceEtsTest,ActsAceEtsResultTest + run -t HATS -ss powermgr -ts HatsPowermgrBatteryTest,HatsPowermgrThermalTest + run -t ACTS -ss arkui -ts ActsAceEtsTest -ta class:alphabetIndexerTest#alphabetIndexerTest001 + run -t ACTS -ss arkui -ts ActsAceEtsTest -ta class:alphabetIndexerTest#alphabetIndexerTest001 --repeat 2 + run -hl + run -rh 1 + run --retry + ``` + The parameters in the ACTS and HATS commands are the same, but are different from those in TDD commands. + ``` + -**t [TESTTYPE]**: specifies the test case type, which can be **ACTS** or **HATS**. This parameter is mandatory. + -**ss [SUBSYSTEM]**: specifies the subsystem to test. This parameter can be used independently. To specify multiple subsystems, separate them with commas (,). + -**tp [TESTPART]**: specifies the part to test. This parameter can be used independently. + -**ts [TESTSUITE]**: specifies the test suite. This parameter can be used independently. To specify multiple test suites, separate them with commas (,). + -**ta [TESTARGS]**: specifies the test method. This parameter must be used together with **-ts**. + --**repeat**: specifies the number of case execution times. + -**hl [HISTORYLIST]**: enables the display of the latest 10 test cases. If there are more than 10 test cases, only the latest 10 test cases are displayed. + -**rh [RUNHISTORY]**: specifies the sequence number of the historical record to execute. + --**retry**: checks the last execution result and re-runs the failed test cases, if any. + ``` ## Viewing the Test Result -### Test Report Logs -After the test cases are executed, the test result will be automatically generated. You can view the detailed test result in the related directory. +After the test is executed, the console automatically generates the test result. -### Test Result You can obtain the test result in the following directory: ``` test/developertest/reports/xxxx_xx_xx_xx_xx_xx ``` ->**NOTE** -> ->The folder for test reports is automatically generated. +> ![icon-note.gif](/en/device-dev/driver/public_sys-resources/icon-note.gif) **NOTE** +> +> The test report folder is automatically generated. The folder contains the following files: | Type | Description | @@ -964,12 +1359,54 @@ The folder contains the following files: | summary_report.html | Test report summary. | | details_report.html | Detailed test report. | -### Test Framework Logs -``` -reports/platform_log_xxxx_xx_xx_xx_xx_xx.log -``` -### Latest Test Report -``` -reports/latest -``` + +## Executing Coverage Cases +When GCDA data is available, you can execute the test cases as follows for subsystems to generate a coverage report: + +1. (Optional) To block redundant branch data generated by non-core code, run the following command in the **/test/testfwk/developer_test/localCoverage/restore_comment** directory before source code compilation: + + python3 build_before_generate.py + + Run the following command to select the parts to be blocked during compilation: + + run -tp partname + run -tp partname1 partname2 +2. Before compiling the version, modify the compilation options. Add **-- coverage** to the **cflags**, **cflags_cc**, and **ldflags** options in the **build.gn** file of the involved subsystem. + + ldflags = [ "--coverage" ] + C: cflags = [ "--coverage" ] + C++: cflags_cc = [ "--coverage" ] + + **Recommended**: You can also refer to the mode for the window subsystem. For details, see the files in this [pull request](https://gitee.com/openharmony/window_window_manager/pulls/1274/files). +3. To execute coverage test cases, perform the following to install the dependencies: + + 1. Run the **sudo apt install lcov** command to install lcov. + 2. Run the **apt install dos2unix** command to install dos2unix. + 3. Run the **pip install lxml** command to install lxml. + 4. Run the **pip install selectolax** command to install selectolax. + 5. Run the **pip install CppHeaderParser** command to install CppHeaderParser. + +4. To map a remote device, set its IP address in the **usr_config.xml** file. For details about device mapping, see [Configuring Remote Port Mapping and Modifying Configuration File](#configuring-remote-port-mapping-and-modifying-configuration-file). + + + + + + + + +5. Run the **./start.sh** command. Below are examples: + + run -t UT -tp *Part name* -cov coverage + run -t UT -ss *Subsystem name* -cov coverage + run -t UT -ss *Subsystem name* -tp **Part name** -cov coverage + run -t UT MST ST -tp *Part name* -cov coverage + + Note: The **-cov coverage** parameter must be added to the preceding commands. + +6. Obtain the coverage report from the following paths: + + Code coverage report: **/test/testfwk/developer_test/localCoverage/codeCoverage/results/coverage/reports/cxx/html** + + API coverage report: **/test/testfwk/developer_test/localCoverage/interfaceCoverage/results/coverage/interface_kits/html** diff --git a/en/device-dev/device-test/smartperf-host.md b/en/device-dev/device-test/smartperf-host.md index ec92a1ba4c2c5ca57957702de1e9fe9c8cb54c9c..6f8451539b9e7bde43dbe79029138508f520d809 100644 --- a/en/device-dev/device-test/smartperf-host.md +++ b/en/device-dev/device-test/smartperf-host.md @@ -1,4 +1,4 @@ -# Smartperf-Host +# Smartperf-Host User Guide ## Overview Smartperf-Host is an intuitive performance and power optimization tool that offers in-depth data mining and fine-grained data visualization. In this tool, you can gain visibility into a multitude of metrics in terms of CPU scheduling, frequency, process and thread time slices, heap memory, frame rate, and more, in swimlanes. Better yet, you can analyze the collected data intuitively on the GUI. ## Architecture diff --git a/en/device-dev/subsystems/Readme-EN.md b/en/device-dev/subsystems/Readme-EN.md index 3c263e691e7f88ca7f54ef99004204ee7419ca1d..996d167977dbd065df2c730b565bcfa7790cb3ba 100644 --- a/en/device-dev/subsystems/Readme-EN.md +++ b/en/device-dev/subsystems/Readme-EN.md @@ -26,6 +26,10 @@ - [ArkCompiler Development](subsys-arkcompiler-guide.md) - Graphics - [Graphics Overview](subsys-graphics-overview.md) +- ArkUI + - [Custom Window Title Bar Development](subsys-arkui-customize_titlebar.md) +- Small-System Graphics + - [Overview of Small-System Graphics](subsys-graphics-overview.md) - [Common Component Development](subsys-graphics-common-guide.md) - [Container Component Development](subsys-graphics-container-guide.md) - [Development of Layout Container Components](subsys-graphics-layout-guide.md) diff --git a/en/device-dev/subsystems/subsys-arkui-customize_titlebar.md b/en/device-dev/subsystems/subsys-arkui-customize_titlebar.md new file mode 100644 index 0000000000000000000000000000000000000000..42e962744c4354cffc27ce0b2556a285c5a305d1 --- /dev/null +++ b/en/device-dev/subsystems/subsys-arkui-customize_titlebar.md @@ -0,0 +1,145 @@ +# Custom Window Title Bar Development +## Overview +While OpenHarmony provides default UX styles for window title bars, it allows device vendors to develop custom window title bars to meet specific needs. +## Development Guidelines + +### How to Develop +Perform the following steps: +1. In **MaximizeMode** (in **frameworks/core/components/common/layout/constants.h**), define the enums, for example, **MODE_AVOID_SYSTEM_BAR** and **MODE_FULL_FILL**. + ```cpp + enum class MaximizeMode : uint32_t { + MODE_AVOID_SYSTEM_BAR, + MODE_FULL_FILL, + MODE_RECOVER, + }; + ``` +2. In **ContainerModalViewFactory::GetView** (in **foundation/arkui/ace_engine/frameworks/core/components_ng/pattern/container_modal/container_modal_view_factory.h**), add the creation of the custom window title bar based on the current value of **MaximizeMode**. + > ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE** + > + > The **ContainerModalViewFactory::GetView** method is a factory method. Below shows the method expanded: + + ```cpp + class ACE_EXPORT ContainerModalViewFactory { + public: + static RefPtr GetView(RefPtr& content, MaximizeMode mode) { + if (mode == MaximizeMode::MODE_AVOID_SYSTEM_BAR || + mode == MaximizeMode::MODE_FULL_FILL) { + return ContainerModalViewEnhance::Create(content); + } else { + return ContainerModalView::Create(content); + } + } + }; + ``` +In the preceding example, vendor enhance creates a custom title bar branch based on the value of **MaximizeMode** (**MaximizeMode::MODE_AVOID_SYSTEM_BAR** or **MaximizeMode::MODE_FULL_FILL**). + +3. Create a folder in the **foundation/arkui/ace_engine/frameworks/core/components_ng/pattern/container_modal** directory to store your custom title bar code. + > ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE** + > + > The structure of the **container_modal** folder is as follows: + ```shell + ├── container_modal_accessibility_property.cpp + ├── container_modal_accessibility_property.h + ├── container_modal_pattern.cpp + ├── container_modal_pattern.h + ├── container_modal_view.cpp + ├── container_modal_view_factory.h + ├── container_modal_view.h + └── enhance + ├── container_modal_pattern_enhance.cpp + ├── container_modal_pattern_enhance.h + ├── container_modal_view_enhance.cpp + └── container_modal_view_enhance.h + ``` + The **container_modal_\*** files in the **container_modal** folder contain the code related to the default title bar view. You can add your custom code files in the created folder, **enhance** in this example. + +4. Complete build configuration for the new .cpp files in **foundation/arkui/ace_engine/frameworks/core/components_ng/pattern/BUILD.gn**. + +When your development of the custom title bar is complete, debug and verify the title bar. +### Debugging and Verification +Before the verification, prepare the following files (which must be stored in the same path): +- **open_maximize.bat** + + Below shows the content of this file: + + ```shell + hdc shell mount -o rw,remount /sys_prod + hdc file send window_manager_config_open.xml sys_prod/etc/window/resources/window_manager_config.xml + hdc shell reboot + ``` + +- **window_manager_config_open.xml** + + Below shows the content of this file: + + ```html + + + + 50 50 50 + 1706 + 1000 + 398 + 528 + 0 + 82 121 1068 706 + 102 + 0 + 5 + 10 + 2880 + 0.5 0.33 0.67 + + + 500 + 150 + 0.2 0.0 0.2 1.0 + + + + + 200 + 0.0 0.0 0.2 1.0 + + 0.9 0.9 + 0 0 1 0 + 0 0 + 0 + + + + + off + off + defaultCornerRadiusL + + + + 0 + #000000 + 0 + 15 + 0.4 + 34 + + + 0 + #000000 + 0 + 15 + 0.2 + 17 + + + + + + ``` + > ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE** + > + > The **window_manager_config_open.xml** file contains various configuration items. Before the verification, you must change the default value of **MaximizeMode** to the one you have defined, that is, the value obtained by **MaximizeMode maximizeMode = GetWindowManager()->GetWindowMaximizeMode()**. The system loads the corresponding title bar according to the value. + +Then, debug the custom title bar as follows: +1. Burn the image that contains the custom title bar code to the device. +2. Run the **open_maximize.bat** script. +3. Run the demo to check whether the title bar works properly. diff --git a/en/device-dev/subsystems/subsys-remote-start.md b/en/device-dev/subsystems/subsys-remote-start.md deleted file mode 100644 index 2c3b0e4d5866b238e62f7c488d1033d0f0565027..0000000000000000000000000000000000000000 --- a/en/device-dev/subsystems/subsys-remote-start.md +++ /dev/null @@ -1,107 +0,0 @@ -# Distributed Remote Startup - -## Overview - -The Distributed Manager Service sets up a distributed service platform in OpenHarmony by using a proxy between the primary and secondary devices. With the Distributed Manager Service, the primary device \(OpenHarmony-powered smart TV\) can start a Feature Ability \(FA\) deployed on the secondary device \(a memory-constrained OpenHarmony device such as an IP camera or a lite wearable\). - -For example, if a user presses the **Remind Me** button for a TV program on the smart TV, the smart TV will start the corresponding reminder FA on the lite wearable to remind the user when the particular TV program is available. - -## Basic Concepts - -- FA - - Feature Ability, representing an ability with a UI for interacting with users - - -- Remote startup - - Cross-device FA startup, which is the counterpart of local FA startup - - -## Available APIs - -The following table describes the API that can be used by smart TVs to remotely start an FA. This API is provided in the **AbilitySlice** class. For details, see the Java API reference for OpenHarmony application development. - -**Table 1** API for remotely starting an FA on the distributed network - - - - - - - - - - -

Method

-

Description

-

void startAbility(Want want)

-

Remotely starts an FA based on the specified Want information. If the name and type of the want parameter are different from those used in the integrated development environment (IDE), use the parameter name and type in the IDE.

-
- -**Table 2** Description of the want parameter - - - - - - - - - - - - -

Parameter

-

Type

-

Description

-

want

-

ohos.aafwk.content.Want

-

When you use startAbility(Want want) to remotely start an FA, you must first specify the deviceId, bundleName, and abilityName attributes of the target FA in the Want object.

-
- -## Limitations and Constraints - -- The primary device can remotely start an FA of the secondary device, but the secondary device cannot remotely start an FA of the primary device. -- Before the remote startup, ensure that the two OpenHarmony devices are on the same network segment and can ping each other on the distributed network. Otherwise, the remote startup fails. -- Currently, only the FAs that have the same public key \(that is, the same Huawei certificate\) can be started between the primary and secondary devices. - -## How to Develop - -To enable the primary device \(smart TV\) to start an FA of the secondary device \(assuming that the target FA has been developed\), perform the following steps: - -1. Complete FA development for the smart TV on DevEco Studio. -2. Obtain the IDs of online secondary devices. - - ``` - // Import the header files required for device selection. - import ohos.distributedschedule.interwork.DeviceInfo; - import ohos.distributedschedule.interwork.DeviceManager; - - // Obtain the online device list. - List deviceInfoListOnline = DeviceManager.getDmsDeviceList(DeviceInfo.FLAG_GET_ONLINE_DEVICE); - String remote_device_id; - if (deviceInfoListOnline.size() > 0) - { - remote_device_id = deviceInfoListOnline[0].GetDeviceId(); // Obtain the ID of the first device in the online device list. - } - ``` - -3. Create a **Want** instance. You should first create an **ElementName** object with **deviceId**, **bundleName**, **abilityName** specified and add this object to the **Want** instance. Then, set the multi-device startup flag **Want.FLAG\_ABILITYSLICE\_MULTI\_DEVICE** to the **Want** instance to enable remote FA startup. - - ``` - // Import related header files. - import ohos.aafwk.ability.Ability; - import ohos.aafwk.content.Want; - import ohos.bundle.ElementName; - - // Start the remote FA on the secondary device. - Want want = new Want(); // Create a Want instance that encapsulates information about the remote FA to start. - // Use the device ID obtained in step 2 and specify the FA information. - ElementName name = new ElementName(remote_device_id, "com.huawei.remote_package_name", "remote_class_name"); - want.setElement(name); // Add information about the target FA for startup to the Want instance. - want.setFlags(Want.FLAG_ABILITYSLICE_MULTI_DEVICE); // Set the multi-device startup flag. If this flag is not set, remote FA startup will be unavailable. - startAbility(want); // Start the specified FA based on the want parameter. If the name and type of the want parameter are different from those used in the IDE, use the parameter name and type in the IDE. - ``` - - diff --git a/en/device-dev/website.md b/en/device-dev/website.md index 6aad5f8a458451105fb5bfbb7657d35856304e58..3f979d4879c640e0e363ae7c3b3acea7914f2f8d 100644 --- a/en/device-dev/website.md +++ b/en/device-dev/website.md @@ -388,15 +388,22 @@ - [Configuring Parameters for Accelerating Local Build](subsystems/subsys-build-reference.md) - [Viewing Ninja Build Information](subsystems/subsys-build-reference.md) - [HAP Build Guide](subsystems/subsys-build-gn-hap-compilation-guide.md) + - Rust Compilation and Building + - [Rust Module Configuration Rules and Guide](subsystems/subsys-build-rust-compilation.md) + - [Interactive Tool User Guide](subsystems/subsys-build-bindgen-cxx-guide.md) + - [Using Cargo2gn](subsystems/subsys-build-cargo2gn-guide.md) - [FAQs](subsystems/subsys-build-FAQ.md) - [ArkCompiler Development](subsystems/subsys-arkcompiler-guide.md) - - [Distributed Remote Startup](subsystems/subsys-remote-start.md) + - ArkUI + - [Custom Window Title Bar Development](subsystems/subsys-arkui-customize_titlebar.md) - Graphics - [Graphics Overview](subsystems/subsys-graphics-overview.md) + - [Common Component Development](subsystems/subsys-graphics-common-guide.md) - [Container Component Development](subsystems/subsys-graphics-container-guide.md) - [Development of Layout Container Components](subsystems/subsys-graphics-layout-guide.md) - - [Common Component Development](subsystems/subsys-graphics-common-guide.md) - [Animator Development](subsystems/subsys-graphics-animation-guide.md) + - [Using Qt Creator on Windows](subsystems/subsys-graphics-simulator-guide.md) + - [Small-System Graphics Framework Integration](subsystems/subsys-graphics-porting-guide.md) - Multimedia - Camera - [Camera Overview](subsystems/subsys-multimedia-camera-overview.md) @@ -532,6 +539,7 @@ - Debugging - [Development Self-Test Framework User Guide](device-test/developer_test.md) - [xDevice User Guide](device-test/xdevice.md) + - [Smartperf-Host User Guide](device-test/smartperf-host.md) - R&D Tools - [bytrace](subsystems/subsys-toolchain-bytrace-guide.md) - [hdc](subsystems/subsys-toolchain-hdc-guide.md) diff --git a/en/release-notes/OpenHarmony-v3.2-release.md b/en/release-notes/OpenHarmony-v3.2-release.md index fed75e671895a0b6f6efc8d3f44465c44443efb3..f36be4f1d81c756222f7700096f8a5b1051d8263 100644 --- a/en/release-notes/OpenHarmony-v3.2-release.md +++ b/en/release-notes/OpenHarmony-v3.2-release.md @@ -125,7 +125,7 @@ Abilities and widgets can be queried, added, refreshed, and deleted across devic - The distributed camera supports video recording. -- Users can import account authentication information to the device security authentication system. Devices with the same login account can automatically complete authentication and networking. +- Users can use the device management native APIs to import account authentication information to the device security authentication system. Devices with the same login account can automatically complete authentication and networking. #### Distributed data management diff --git a/en/release-notes/changelogs/OpenHarmony_4.0.8.1/changelogs-arkui.md b/en/release-notes/changelogs/OpenHarmony_4.0.8.1/changelogs-arkui.md new file mode 100644 index 0000000000000000000000000000000000000000..b155f52a104a047255cf904c09478e51b4169a84 --- /dev/null +++ b/en/release-notes/changelogs/OpenHarmony_4.0.8.1/changelogs-arkui.md @@ -0,0 +1,21 @@ +# ArkUI Subsystem Changelog + +## cl.arkui.1 Change of Certain Predicates of uiAppearance from Public APIs to System APIs + +Changed the namespace **uiAppearance** and its internal **DarkMode** enum predicates from public APIs to system APIs. + +**Change Impact** + +None. The namespace **uiAppearance** and its internal **DarkMode** enum are used only by system APIs before and after the change. + +**Key API/Component Changes** + +The system API description is added to the following APIs: + +- declare namespace uiAppearance + +- enum DarkMode + +- ALWAYS_DARK = 0 + +- ALWAYS_LIGHT = 1 diff --git a/en/release-notes/changelogs/OpenHarmony_4.0.8.2/changelogs-arkui.md b/en/release-notes/changelogs/OpenHarmony_4.0.8.2/changelogs-arkui.md index 85f6aebf03beb604a61c7be18c293507b8415eab..089253f0e410425b26d4b7c99b15c933957e5440 100644 --- a/en/release-notes/changelogs/OpenHarmony_4.0.8.2/changelogs-arkui.md +++ b/en/release-notes/changelogs/OpenHarmony_4.0.8.2/changelogs-arkui.md @@ -97,3 +97,117 @@ N/A When building a child component, do not assign values to the variables by **@LocalStorageLink** and **@LocalStorageProp** in the child component. To change these variables from the parent component, use the API provided by the **LocalStorage** (such as the **set** API) to assign values to them. + +## cl.arkui.3 Change of the bottom Definition in Toast Options in the PromptAction Module + +Changed the definition of the **bottom** attribute in toast options from distance between the top of the toast and the bottom of the screen to distance between the bottom of the toast and the bottom of the screen. + +**Example** + +```ts +import promptAction from '@ohos.promptAction'; +@Entry +@Component +struct Index { + build() { + Row() { + Button() + .onClick(() => { + try { + promptAction.showToast({ + message: 'Message Info', + duration: 2000 + }); + } catch (error) { + console.error(`showToast args error code is ${error.code}, message is ${error.message}`); + }; + }) + } + } +} +``` + +**Change Impacts** + +In the **PromptAction** module, the same value for the **bottom** attribute may result in different toast appearances, depending on whether the API version used by the compiler is earlier than 10 or not. + +**Key API/Component Changes** + +N/A + +**Adaptation Guide** + +When setting the **bottom** attribute, account for the definition change. + +## cl.arkui.4 Content Layout Change of AlertDialog + +The content layout of the alert dialog box varies according to the following conditions: 1. whether there is a title. 2. whether the text is on a single line. + +Currently, only the single-line text without a title is centered. In other cases, the text is left-aligned. + +**Example** + +```ts +// xxx.ets +@Entry +@Component +struct AlertDialogExample { + build() { + Column({ space: 5 }) { + Button('one button dialog') + .onClick(() => { + AlertDialog.show( + { + title: 'title', + message: 'text'.repeat(20), + autoCancel: true, + alignment: DialogAlignment.Bottom, + offset: { dx: 0, dy: -20 }, + gridCount: 3, + confirm: { + value: 'button', + action: () => { + console.info('Button-clicking callback') + } + }, + cancel: () => { + console.info('Closed callbacks') + } + } + ) + }) + .backgroundColor(0x317aff) + }.width('100%').margin({ top: 5 }) + } +} +``` + +**Change Impacts** + +The layout for the text specified by the **message** attribute of the alert dialog box is subject to the title and number of lines of the text. + +**Key API/Component Changes** + +N/A + +**Adaptation Guide** + +No proactive adaptation is required. You can also use **customDialog** for related implementation. + +## cl.arkui.5 Avoidance Behavior Optimization of Popup + +Before the change, the popup preferentially uses the lower area for avoidance. As a result, it cannot be displayed in the upper area even if the space is sufficient. + +After the change: The popup preferentially uses the upper area for avoidance when it is configured to show above the target component; it preferentially uses the upper or lower area for avoidance when it is configured to show below the target component. + +**Change Impacts** + +The optimized popup avoidance behavior occurs when the **bindpopup** attribute is used. + +**Key API/Component Changes** + +N/A + +**Adaptation Guide** + +If the popup position is not as expected, you can adjust the **placement** settings. diff --git a/zh-cn/application-dev/IDL/idl-guidelines.md b/zh-cn/application-dev/IDL/idl-guidelines.md index f2f89c45fe75c039447ce53593ccaa98b0c51dcd..8d124c2f0e91c74864a6af12879818269fc59e75 100644 --- a/zh-cn/application-dev/IDL/idl-guidelines.md +++ b/zh-cn/application-dev/IDL/idl-guidelines.md @@ -343,11 +343,10 @@ export default { #### 客户端调用IPC方法 -客户端调用connectAbility()以连接服务时，客户端的onAbilityConnectDone中的onConnect回调会接收服务的onConnect()方法返回的IRemoteObject实例。由于客户端和服务在不同应用内，所以客户端应用的目录内必须包含.idl文件(SDK工具会自动生成Proxy代理类)的副本。客户端的onAbilityConnectDone中的onConnect回调会接收服务的onConnect()方法返回的IRemoteObject实例，使用IRemoteObject创建IdlTestServiceProxy类的实例对象testProxy，然后调用相关IPC方法。示例代码如下： +客户端调用connectServiceExtensionAbility()以连接服务时，客户端的onAbilityConnectDone中的onConnect回调会接收服务的onConnect()方法返回的IRemoteObject实例。由于客户端和服务在不同应用内，所以客户端应用的目录内必须包含.idl文件(SDK工具会自动生成Proxy代理类)的副本。客户端的onAbilityConnectDone中的onConnect回调会接收服务的onConnect()方法返回的IRemoteObject实例，使用IRemoteObject创建IdlTestServiceProxy类的实例对象testProxy，然后调用相关IPC方法。示例代码如下： ```ts import IdlTestServiceProxy from './idl_test_service_proxy' -import featureAbility from '@ohos.ability.featureAbility'; function callbackTestIntTransaction(result: number, ret: number): void { if (result == 0 && ret == 124) { @@ -392,13 +391,13 @@ var onAbilityConnectDone = { } }; -function connectAbility: void { +function connectAbility(): void { let want = { bundleName: 'com.example.myapplicationidl', abilityName: 'com.example.myapplicationidl.ServiceAbility' }; let connectionId = -1; - connectionId = featureAbility.connectAbility(want, onAbilityConnectDone); + connectionId = this.context.connectServiceExtensionAbility(want, onAbilityConnectDone); } diff --git a/zh-cn/application-dev/application-models/arkts-ui-widget-creation.md b/zh-cn/application-dev/application-models/arkts-ui-widget-creation.md index 71c48410fea0aee1420ae1dab44b9dfa81ff1e63..248c23ea425fb67ad814d1402d100d799d0c5a34 100644 --- a/zh-cn/application-dev/application-models/arkts-ui-widget-creation.md +++ b/zh-cn/application-dev/application-models/arkts-ui-widget-creation.md @@ -1,16 +1,23 @@ # 创建一个ArkTS卡片 -在已有的应用工程中，创建ArkTS卡片，具体的操作方式如下。 +创建卡片当前有两种入口： -1. 创建卡片。 +- 创建工程时，选择Application，默认不带卡片，可以在创建工程后右键新建卡片。 +- 创建工程时，选择Atomic Service，默认自带卡片，也可以在创建工程后右键新建卡片。 + +![WidgetCreateProject](figures/WidgetCreateProject.png) + +在已有的应用工程中，可以通过右键新建ArkTS卡片，具体的操作方式如下。 + +1. 右键新建卡片。 ![WidgetProjectCreate1](figures/WidgetProjectCreate1.png) 2. 根据实际业务场景，选择一个卡片模板。 ![WidgetProjectCreate2](figures/WidgetProjectCreate2.png) - + 3. 在选择卡片的开发语言类型（Language）时，选择ArkTS选项，然后单击“Finish”，即可完成ArkTS卡片创建。 ![WidgetProjectCreate3](figures/WidgetProjectCreate3.png) - + ArkTS卡片创建完成后，工程中会新增如下卡片相关文件：卡片生命周期管理文件（EntryFormAbility.ets）、卡片页面文件（WidgetCard.ets）和卡片配置文件（form_config.json）。 ![WidgetProjectView](figures/WidgetProjectView.png) diff --git a/zh-cn/application-dev/application-models/arkts-ui-widget-event-formextensionability.md b/zh-cn/application-dev/application-models/arkts-ui-widget-event-formextensionability.md index dd1c84a41983ed354da06789357626beb1d3126a..776b129a1fabf15885e43d19f5949878acf9be02 100644 --- a/zh-cn/application-dev/application-models/arkts-ui-widget-event-formextensionability.md +++ b/zh-cn/application-dev/application-models/arkts-ui-widget-event-formextensionability.md @@ -11,12 +11,19 @@ @Entry(storage) @Component struct WidgetCard { - @LocalStorageProp('title') title: string = 'init'; - @LocalStorageProp('detail') detail: string = 'init'; + @LocalStorageProp('title') title: string = 'Title default'; + @LocalStorageProp('detail') detail: string = 'Description default'; build() { Column() { - Button('刷新') + Column() { + Text(`${this.title}`) + .margin(5).fontWeight(FontWeight.Medium).fontSize('14fp') + Text(`${this.detail}`) + .margin(5).fontColor(Color.Gray).fontSize('12fp').height('25%') + }.width('100%').alignItems(HorizontalAlign.Start) + Button('UPDATE') + .margin(15).width('90%') .onClick(() => { postCardAction(this, { 'action': 'message', @@ -25,11 +32,7 @@ } }); }) - Text(`${this.title}`) - Text(`${this.detail}`) - } - .width('100%') - .height('100%') + }.width('90%').height('90%').margin('5%') } } ``` @@ -46,8 +49,8 @@ // Called when a specified message event defined by the form provider is triggered. console.info(`FormAbility onEvent, formId = ${formId}, message: ${JSON.stringify(message)}`); let formData = { - 'title': 'Title Update Success.', // 和卡片布局中对应 - 'detail': 'Detail Update Success.', // 和卡片布局中对应 + 'title': 'Title Update.', // 和卡片布局中对应 + 'detail': 'Description update success.', // 和卡片布局中对应 }; let formInfo = formBindingData.createFormBindingData(formData) formProvider.updateForm(formId, formInfo).then((data) => { @@ -61,5 +64,8 @@ } ``` - 运行效果如下图所示。 - ![WidgetUpdatePage](figures/WidgetUpdatePage.png) + 运行效果如下图所示。 + + | 初始状态 | 点击刷新 | + | ------------------------------------------------------- | ----------------------------------------------------- | + | ![WidgetUpdateBefore](figures/widget-update-before.PNG) | ![WidgetUpdateAfter](figures/widget-update-after.PNG) | diff --git a/zh-cn/application-dev/application-models/arkts-ui-widget-event-router.md b/zh-cn/application-dev/application-models/arkts-ui-widget-event-router.md index f32017a7ed10f405f292bd6ad26139df5613d189..e54036d3971d65b2a12cf45baec3640f079e6337 100644 --- a/zh-cn/application-dev/application-models/arkts-ui-widget-event-router.md +++ b/zh-cn/application-dev/application-models/arkts-ui-widget-event-router.md @@ -1,7 +1,7 @@ # 使用router事件跳转到指定UIAbility - 在卡片中使用**postCardAction**接口的router能力，能够快速拉起卡片提供方应用的指定UIAbility，因此UIAbility较多的应用往往会通过卡片提供不同的跳转按钮，实现一键直达的效果。例如相机卡片，卡片上提供拍照、录像等按钮，点击不同按钮将拉起相机应用的不同UIAbility，从而提高用户的体验。 + ![WidgerCameraCard](figures/WidgerCameraCard.png) diff --git a/zh-cn/application-dev/application-models/arkts-ui-widget-working-principles.md b/zh-cn/application-dev/application-models/arkts-ui-widget-working-principles.md index e40413e81bc389fd857b19081dc3b7bdd17159de..7585bbc02e566a5747acb8ba75acab6f8e224929 100644 --- a/zh-cn/application-dev/application-models/arkts-ui-widget-working-principles.md +++ b/zh-cn/application-dev/application-models/arkts-ui-widget-working-principles.md @@ -26,7 +26,7 @@ - 统一开发范式，提升开发体验和开发效率。 - OpenHarmony在2022年发布了声明式范式的UI开发框架，而卡片还延续了css/hml/json三段式类Web范式的开发方式，提高了开发者的学习成本，提供ArkTS卡片能力后，统一了卡片和页面的开发范式，页面的布局可以直接复用到卡片布局中，提升开发体验和开发效率。 + 提供ArkTS卡片能力后，统一了卡片和页面的开发范式，页面的布局可以直接复用到卡片布局中，提升开发体验和开发效率。 **图3** 卡片工程结构对比 ![WidgetProject](figures/WidgetProject.png) diff --git a/zh-cn/application-dev/application-models/figures/WidgetCreateProject.png b/zh-cn/application-dev/application-models/figures/WidgetCreateProject.png new file mode 100644 index 0000000000000000000000000000000000000000..2372e68a25c116ace77374eba86a8ea7a0680988 Binary files /dev/null and b/zh-cn/application-dev/application-models/figures/WidgetCreateProject.png differ diff --git a/zh-cn/application-dev/application-models/figures/WidgetUpdatePage.png b/zh-cn/application-dev/application-models/figures/WidgetUpdatePage.png deleted file mode 100644 index 24ba6ae125dac0acf426e61d6a9dd71630f55294..0000000000000000000000000000000000000000 Binary files a/zh-cn/application-dev/application-models/figures/WidgetUpdatePage.png and /dev/null differ diff --git a/zh-cn/application-dev/application-models/figures/widget-update-after.PNG b/zh-cn/application-dev/application-models/figures/widget-update-after.PNG new file mode 100644 index 0000000000000000000000000000000000000000..fddb9f651685332324af9a4d065c29638a58c0ba Binary files /dev/null and b/zh-cn/application-dev/application-models/figures/widget-update-after.PNG differ diff --git a/zh-cn/application-dev/application-models/figures/widget-update-before.PNG b/zh-cn/application-dev/application-models/figures/widget-update-before.PNG new file mode 100644 index 0000000000000000000000000000000000000000..6355f1b66707af8073a2e1dea7f05e839f3a9818 Binary files /dev/null and b/zh-cn/application-dev/application-models/figures/widget-update-before.PNG differ diff --git a/zh-cn/application-dev/arkts-utils/xml-conversion.md b/zh-cn/application-dev/arkts-utils/xml-conversion.md index dfaa9db3f6d5ad6c53a06c400fbb3acd1a3e6a23..a47c733357337a7d2d52714df8d8c2bf160fa186 100644 --- a/zh-cn/application-dev/arkts-utils/xml-conversion.md +++ b/zh-cn/application-dev/arkts-utils/xml-conversion.md @@ -4,7 +4,7 @@ 将XML文本转换为JavaScript对象可以更轻松地处理和操作数据，并且更适合在JavaScript应用程序中使用。 -语言基础类库提供ConvertXML类将xml文本转换为JavaScript对象，输入为待转换的XML字符串及转换选项，输出为转换后的JavaScript对象。具体转换选项可见[API参考@ohos.convertxml](../reference/apis/js-apis-convertxml.md)。 +语言基础类库提供ConvertXML类将XML文本转换为JavaScript对象，输入为待转换的XML字符串及转换选项，输出为转换后的JavaScript对象。具体转换选项可见[API参考@ohos.convertxml](../reference/apis/js-apis-convertxml.md)。 ## 注意事项 diff --git a/zh-cn/application-dev/napi/Readme-CN.md b/zh-cn/application-dev/napi/Readme-CN.md index ba6b1f29271ff7493ffd828c11f1713deea332f5..64e7a67ce018243582afb87f5988521e32056d8d 100644 --- a/zh-cn/application-dev/napi/Readme-CN.md +++ b/zh-cn/application-dev/napi/Readme-CN.md @@ -19,3 +19,7 @@ - [Purgeable memory开发指导](purgeable-memory-guidelines.md) - 设备管理 - [USB DDK开发指导](usb-ddk-guidelines.md) + +- 数据管理 + - [RelationalStore开发指导](native-relational-store-guidelines.md) + diff --git a/zh-cn/application-dev/napi/native-buffer-guidelines.md b/zh-cn/application-dev/napi/native-buffer-guidelines.md index 7feff7533d16ceca5ca35ff81e678323b8ab73a0..63c7f769a6b2c70ac6ad7b3d32fde0f6c5019d0d 100644 --- a/zh-cn/application-dev/napi/native-buffer-guidelines.md +++ b/zh-cn/application-dev/napi/native-buffer-guidelines.md @@ -25,6 +25,13 @@ NativeBuffer是`OpenHarmony`提供**共享内存**的模块。开发者可以通 以下步骤描述了在**OpenHarmony**中如何使用`NativeBuffer`提供的Native API接口，创建`OH_NativeBuffer`实例获取内存的属性信息，并把对应的ION内存映射到进程空间。 +**添加动态链接库** + +CMakeLists.txt中添加以下lib。 +```txt +libnative_buffer.so +``` + **头文件** ```c++ #include diff --git a/zh-cn/application-dev/napi/native-image-guidelines.md b/zh-cn/application-dev/napi/native-image-guidelines.md index 1f200277b2ccc1285b42338268e9a38dc4e262f5..a8d1d01f68ed2dd5cfee99922c34bde977e7d8e2 100644 --- a/zh-cn/application-dev/napi/native-image-guidelines.md +++ b/zh-cn/application-dev/napi/native-image-guidelines.md @@ -26,6 +26,17 @@ NativeImage是`OpenHarmony`提供**Surface关联OpenGL外部纹理**的模块， 以下步骤描述了在**OpenHarmony**中如何使用`NativeImage`提供的Native API接口，创建`OH_NativeImage`实例作为消费者端，将数据内容更新到OpenGL外部纹理上。 +**添加动态链接库** + +CMakeLists.txt中添加以下lib。 +```txt +libEGL.so +libGLESv3.so +libnative_image.so +libnative_window.so +libnative_buffer.so +``` + **头文件** ```c++ #include diff --git a/zh-cn/application-dev/napi/native-relational-store-guidelines.md b/zh-cn/application-dev/napi/native-relational-store-guidelines.md new file mode 100644 index 0000000000000000000000000000000000000000..ff4a3aaeaa80a4c8f4db2901d16d1e3ee1370f97 --- /dev/null +++ b/zh-cn/application-dev/napi/native-relational-store-guidelines.md @@ -0,0 +1,176 @@ +# RelationalStore开发指导 + + +## 场景介绍 + +RelationalStore提供了一套完整的对本地数据库进行管理的机制，对外提供了一系列的增、删、改、查等接口，也可以直接运行用户输入的SQL语句来满足复杂的场景需要。 + + +## 基本概念 + +- **谓词**：数据库中用来代表数据实体的性质、特征或者数据实体之间关系的词项，主要用来定义数据库的操作条件。 + +- **结果集**：指用户查询之后的结果集合，可以对数据进行访问。结果集提供了灵活的数据访问方式，可以更方便地拿到用户想要的数据。 + + +## 约束限制 + +- 系统默认日志方式是WAL（Write Ahead Log）模式，系统默认落盘方式是FULL模式。 + +- 数据库中连接池的最大数量是4个，用以管理用户的读操作。 + +- 为保证数据的准确性，数据库同一时间只能支持一个写操作。 + +- 当应用被卸载完成后，设备上的相关数据库文件及临时文件会被自动清除。 + + +## 接口说明 + +详细的接口说明请参考[RDB](../reference/native-apis/_r_d_b.md)。 + +| 接口名称 | 描述 | +| -------- | -------- | +| OH_Rdb_GetOrOpen(const OH_Rdb_Config *config, int *errCode) | 获得一个相关的OH_Rdb_Store实例，操作关系型数据库。 | +| OH_Rdb_Execute(OH_Rdb_Store *store, const char *sql) | 执行包含指定参数但不返回值的SQL语句。 | +| OH_Rdb_Insert(OH_Rdb_Store *store, const char *table, OH_VBucket *valuesBucket) | 向目标表中插入一行数据。 | +| OH_Rdb_Update(OH_Rdb_Store *store, OH_VBucket *valuesBucket, OH_Predicates *predicates); | 根据OH_Predicates的指定实例对象更新数据库中的数据。 | +| OH_Rdb_Delete(OH_Rdb_Store *store, OH_Predicates *predicates) | 根据OH_Predicates的指定实例对象从数据库中删除数据。 | +| OH_Rdb_Query(OH_Rdb_Store *store, OH_Predicates *predicates, const char *const *columnNames, int length) | 根据指定条件查询数据库中的数据。 | +| OH_Rdb_DeleteStore(const OH_Rdb_Config *config) | 删除数据库。 | + + +## 开发步骤 + +1. 获取OH_Rdb_Store实例，创建数据库文件。示例代码如下所示： + + ```c + // 创建OH_Rdb_Config对象 + OH_Rdb_Config config; + // 该路径为应用沙箱路径 + config.dataBaseDir = "xxx"; + // 数据库文件名 + config.storeName = "RdbTest.db"; + // 应用包名 + config.bundleName = "xxx"; + // 应用模块名 + config.moduleName = "xxx"; + // 数据库文件安全等级 + config.securityLevel = OH_Rdb_SecurityLevel::S1; + // 数据库是否加密 + config.isEncrypt = false; + // config所占内存大小 + config.selfSize = sizeof(OH_Rdb_Config); + + int errCode = 0; + // 获取获取OH_Rdb_Store实例 + OH_Rdb_Store *store_ = OH_Rdb_GetOrOpen(&config, &errCode); + ``` + +2. 获取到OH_Rdb_Store后，调用OH_Rdb_Execute接口创建表，并调用OH_Rdb_Insert接口插入数据。示例代码如下所示： + + ```c + char createTableSql[] = "CREATE TABLE IF NOT EXISTS EMPLOYEE (ID INTEGER PRIMARY KEY AUTOINCREMENT, NAME TEXT NOT NULL, " + "AGE INTEGER, SALARY REAL, CODES BLOB)"; + // 执行建表语句 + OH_Rdb_Execute(store_, createTableSql); + + // 创建键值对实例 + OH_VBucket *valueBucket = OH_Rdb_CreateValuesBucket(); + valueBucket->putText(valueBucket, "NAME", "Lisa"); + valueBucket->putInt64(valueBucket, "AGE", 18); + valueBucket->putReal(valueBucket, "SALARY", 100.5); + uint8_t arr[] = {1, 2, 3, 4, 5}; + int len = sizeof(arr) / sizeof(arr[0]); + valueBucket->putBlob(valueBucket, "CODES", arr, len); + // 插入数据 + int rowId = OH_Rdb_Insert(store_, "EMPLOYEE", valueBucket); + // 销毁键值对实例 + valueBucket->destroy(valueBucket); + ``` + + > **说明：** + > + > 关系型数据库没有显式的flush操作实现持久化，数据插入即保存在持久化文件。 + +3. 根据谓词指定的实例对象，对数据进行修改或删除。 + + 调用OH_Rdb_Update方法修改数据，调用OH_Rdb_Delete方法删除数据。示例代码如下所示： + + ```c + // 修改数据 + OH_VBucket *valueBucket = OH_Rdb_CreateValuesBucket(); + valueBucket->putText(valueBucket, "NAME", "Rose"); + valueBucket->putInt64(valueBucket, "AGE", 22); + valueBucket->putReal(valueBucket, "SALARY", 200.5); + uint8_t arr[] = {1, 2, 3, 4, 5}; + int len = sizeof(arr) / sizeof(arr[0]); + valueBucket->putBlob(valueBucket, "CODES", arr, len); + + OH_Predicates *predicates = OH_Rdb_CreatePredicates("EMPLOYEE"); + OH_VObject *valueObject = OH_Rdb_CreateValueObject(); + const char *name = "Lisa"; + valueObject->putText(valueObject, name); + predicates->equalTo(predicates, "NAME", valueObject)->andOperate(predicates); + uint32_t count = 1; + double salary = 100.5; + valueObject->putDouble(valueObject, &salary, count); + predicates->equalTo(predicates, "SALARY", valueObject); + + int changeRows = OH_Rdb_Update(store_, valueBucket, predicates); + valueObject->destroy(valueObject); + valueBucket->destroy(valueBucket); + predicates->destroy(predicates); + ``` + + ```c + // 删除数据 + OH_Predicates *predicates = OH_Rdb_CreatePredicates("EMPLOYEE"); + OH_VObject *valueObject = OH_Rdb_CreateValueObject(); + const char *name = "Lisa"; + valueObject->putText(valueObject, name); + predicates->equalTo(predicates, "NAME", valueObject); + int deleteRows = OH_Rdb_Delete(store_, predicates); + valueObject->destroy(valueObject); + predicates->destroy(predicates); + ``` + +4. 根据谓词指定的查询条件查找数据。 + + 调用OH_Rdb_Query方法查找数据，返回一个OH_Cursor结果集。示例代码如下所示： + + ```c + OH_Predicates *predicates = OH_Rdb_CreatePredicates("EMPLOYEE"); + + const char *columnNames[] = {"NAME", "AGE"}; + int len = sizeof(columnNames) / sizeof(columnNames[0]); + OH_Cursor *cursor = OH_Rdb_Query(store_, predicates, columnNames, len); + + int columnCount = 0; + cursor->getColumnCount(cursor, &columnCount); + + // OH_Cursor是一个数据集合的游标，默认指向第-1个记录，有效的数据从0开始 + int64_t age; + while (cursor->goToNextRow(cursor) == OH_Rdb_ErrCode::RDB_OK) { + cursor->getInt64(cursor, 1, &age); + } + + // 释放谓词实例 + predicates->destroy(predicates); + // 释放结果集 + cursor->destroy(cursor); + ``` + +5. 删除数据库。 + + 调用OH_Rdb_DeleteStore方法，删除数据库及数据库相关文件。示例代码如下： + + + ```c + // 释放数据库实例 + OH_Rdb_CloseStore(store_); + // 删除数据库文件 + OH_Rdb_DeleteStore(&config); + ``` + + + diff --git a/zh-cn/application-dev/napi/native-vsync-guidelines.md b/zh-cn/application-dev/napi/native-vsync-guidelines.md index 63da1350b96d2d4603dacf90da13db4ca485c145..0261621db13cf1e36772e7ef2bb1732cfba346a0 100644 --- a/zh-cn/application-dev/napi/native-vsync-guidelines.md +++ b/zh-cn/application-dev/napi/native-vsync-guidelines.md @@ -19,6 +19,13 @@ NativeVsync模块用来获取系统VSync信号，提供了OH_NativeVSync实例 以下步骤描述了在**OpenHarmony**中如何使用`NativeVsync`提供的Native API接口，创建和销毁`OH_NativeVsync`实例，以及如何设置VSync回调函数。 +**添加动态链接库** + +CMakeLists.txt中添加以下lib。 +```txt +libnative_vsync.so +``` + **头文件** ```c++ #include diff --git a/zh-cn/application-dev/napi/native-window-guidelines.md b/zh-cn/application-dev/napi/native-window-guidelines.md index 6ed367948c2be42737efa31bca8966fc9bfd756c..4e191da6e2e5a8256c338d489d8efb906df0cb6f 100644 --- a/zh-cn/application-dev/napi/native-window-guidelines.md +++ b/zh-cn/application-dev/napi/native-window-guidelines.md @@ -23,6 +23,7 @@ NativeWindow是`OpenHarmony`**本地平台化窗口**，表示图形队列的生 以下步骤描述了在**OpenHarmony**中如何使用`NativeWindow`提供的Native API接口，申请图形`Buffer`，并将生产图形内容写入图形`Buffer`后，最终提交`Buffer`到图形队列。 **添加动态链接库** + CMakeLists.txt中添加以下lib。 ```txt libace_ndk.z.so diff --git a/zh-cn/application-dev/napi/neural-network-runtime-guidelines.md b/zh-cn/application-dev/napi/neural-network-runtime-guidelines.md index 4fa36ff1f15e23b4d8d1a311384fcf7e42ba2bea..bdde437188c2cc9a9da8ddbdcb2b2eec1056c61b 100644 --- a/zh-cn/application-dev/napi/neural-network-runtime-guidelines.md +++ b/zh-cn/application-dev/napi/neural-network-runtime-guidelines.md @@ -19,13 +19,14 @@ Neural Network Runtime部件的环境要求如下： - 开发环境：Ubuntu 18.04及以上。 - 接入设备：OpenHarmony定义的标准设备，并且系统中内置的硬件加速器驱动，已通过HDI接口对接Neural Network Runtime。 -由于Neural Network Runtime通过OpenHarmony Native API对外开放，需要通过OpenHarmony的Native开发套件编译Neural Network Runtime应用。在社区的[每日构建](http://ci.openharmony.cn/dailys/dailybuilds)下载对应系统版本的ohos-sdk压缩包，从压缩包中提取对应平台的Native开发套件。以Linux为例，Native开发套件的压缩包命名为`native-linux-{版本号}.zip`。 +由于Neural Network Runtime通过OpenHarmony Native API对外开放，需要通过OpenHarmony的Native开发套件编译Neural Network Runtime应用。 ### 环境搭建 1. 打开Ubuntu编译服务器的终端。 -2. 把下载好的Native开发套件压缩包拷贝至当前用户根目录下。 +2. 把Native开发套件压缩包拷贝至当前用户根目录下。 3. 执行以下命令解压Native开发套件的压缩包。 + ```shell unzip native-linux-{版本号}.zip ``` @@ -470,16 +471,19 @@ Neural Network Runtime的开发流程主要包含**模型构造**、**模型编 > 模型的IR需要传递到硬件驱动层，由HDI服务将统一的IR图，编译成硬件专用的计算图，编译的过程非常耗时。Neural Network Runtime支持计算图缓存的特性，可以将HDI服务编译生成的计算图，缓存到设备存储中。当下一次在同一个加速芯片上编译同一个模型时，通过指定缓存的路径，Neural Network Runtime可以直接加载缓存文件中的计算图，减少编译消耗的时间。 检查缓存目录下的缓存文件： + ```shell ls /data/local/tmp ``` 以下为打印结果： + ```text # 0.nncache cache_info.nncache ``` 如果缓存不再使用，需要手动删除缓存，可以参考以下命令，删除缓存文件。 + ```shell rm /data/local/tmp/*nncache ``` @@ -487,5 +491,5 @@ Neural Network Runtime的开发流程主要包含**模型构造**、**模型编 ## 相关实例 第三方AI推理框架对接Neural Network Runtime的流程，可以参考以下相关实例： -- [Tensorflow Lite接入NNRt Delegate开发指南](https://gitee.com/openharmony/neural_network_runtime/tree/master/example/deep_learning_framework) - + +- [Tensorflow Lite接入NNRt Delegate开发指南](https://gitee.com/openharmony/ai_neural_network_runtime/tree/master/example/deep_learning_framework) diff --git a/zh-cn/application-dev/napi/vulkan-guidelines.md b/zh-cn/application-dev/napi/vulkan-guidelines.md index d8331926f4e3664362ba63cd825f935d2ce85632..f0bf36a0225106d05611f4526c7c2031d7fcf220 100644 --- a/zh-cn/application-dev/napi/vulkan-guidelines.md +++ b/zh-cn/application-dev/napi/vulkan-guidelines.md @@ -18,6 +18,15 @@ Vulkan是一套用来做2D和3D渲染的图形应用程序接口，其中创建V 以下步骤说明了如何在OpenHarmony平台创建一个VkSurfaceKHR对象。 +**添加动态链接库** + +CMakeLists.txt中添加以下lib。 +```txt +libace_ndk.z.so +libnative_window.so +libvulkan.so +``` + **头文件** ```c++ #include diff --git a/zh-cn/application-dev/napi/xcomponent-guidelines.md b/zh-cn/application-dev/napi/xcomponent-guidelines.md index 179fca2339061e6d98bc73fdd130befbc8aaea99..14d176da8269fbaa801ad4f46f7ce301b64cabd6 100644 --- a/zh-cn/application-dev/napi/xcomponent-guidelines.md +++ b/zh-cn/application-dev/napi/xcomponent-guidelines.md @@ -81,7 +81,7 @@ XComponent({ id: 'xcomponentId1', type: 'surface', libraryname: 'nativerender' } // ... ``` -2. **Napi模块注册**，具体使用请参考[Native API在应用工程中的使用指导](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/napi/napi-guidelines.md)。 +2. **Napi模块注册**，具体使用请参考[Native API在应用工程中的使用指导](napi-guidelines.md)。 ```c++ // 在napi_init.cpp文件中，Init方法注册接口函数，从而将封装的C++方法传递出来，供JS侧调用 diff --git a/zh-cn/application-dev/quick-start/arkts-builder.md b/zh-cn/application-dev/quick-start/arkts-builder.md index b3c1e91eb13e3796404520ff096c01d077f14211..6b151dab926c7407ff3360029c3fccf87fff1b8a 100644 --- a/zh-cn/application-dev/quick-start/arkts-builder.md +++ b/zh-cn/application-dev/quick-start/arkts-builder.md @@ -21,14 +21,14 @@ ```ts -@Builder myBuilderFunction({ ... }) +@Builder MyBuilderFunction({ ... }) ``` 使用方法： ```ts -this.myBuilderFunction({ ... }) +this.MyBuilderFunction({ ... }) ``` - 允许在自定义组件内定义一个或多个自定义构建函数，该函数被认为是该组件的私有、特殊类型的成员函数。 diff --git a/zh-cn/application-dev/quick-start/arkts-mvvm.md b/zh-cn/application-dev/quick-start/arkts-mvvm.md index 6185ed8d6574e2083605b4d2a4171ca768918106..8f0a9b1fb98430d34f544c8cc7f0b98b71333ca7 100644 --- a/zh-cn/application-dev/quick-start/arkts-mvvm.md +++ b/zh-cn/application-dev/quick-start/arkts-mvvm.md @@ -775,7 +775,7 @@ struct ViewA { 开发一个电话簿应用，实现功能如下： -- 显示联系人和本机（"Me"）电话号码 。 +- 显示联系人和设备（"Me"）电话号码 。 - 选中联系人时，进入可编辑态”Edit“，可以更新该联系人详细信息，包括电话号码，住址。 @@ -788,8 +788,8 @@ ViewModel需要包括： - AddressBook（class） - - me (本机）: 存储一个Person类。 - - contacts（本机联系人）：存储一个Person类数组。 + - me (设备）: 存储一个Person类。 + - contacts（设备联系人）：存储一个Person类数组。 AddressBook类声明如下： @@ -936,11 +936,11 @@ export class ObservedArray extends Array { @Component struct PageEntry { @Provide addrBook: AddressBook = new AddressBook( - new Person("Gigi", "Itamerenkatu 9", 180, "Helsinki", ["+358441234567", "+35891234567", "+49621234567889"]), + new Person("Gigi", "Itamerenkatu 9", 180, "Helsinki", ["18*********", "18*********", "18*********"]), [ - new Person("Oly", "Itamerenkatu 9", 180, "Helsinki", ["+358449876543", "+3589456789"]), - new Person("Sam", "Itamerenkatu 9", 180, "Helsinki", ["+358509876543", "+358910101010"]), - new Person("Vivi", "Itamerenkatu 9", 180, "Helsinki", ["+358400908070", "+35894445555"]), + new Person("Oly", "Itamerenkatu 9", 180, "Helsinki", ["18*********", "18*********"]), + new Person("Sam", "Itamerenkatu 9", 180, "Helsinki", ["18*********", "18*********"]), + new Person("Vivi", "Itamerenkatu 9", 180, "Helsinki", ["18*********", "18*********"]), ]); build() { @@ -1099,236 +1099,236 @@ export class ObservedArray extends Array { 完整应用代码如下： - ```ts - // ViewModel classes - let nextId = 0; - - @Observed - export class ObservedArray extends Array { - constructor(args?: any[]) { - console.log(`ObservedArray: ${JSON.stringify(args)} `) - if (Array.isArray(args)) { - super(...args); - } else { - super(args) - } - } - } - - @Observed - export class Address { - street: string; - zip: number; - city: string; - - constructor(street: string, - zip: number, - city: string) { - this.street = street; - this.zip = zip; - this.city = city; - } - } - - @Observed - export class Person { - id_: string; - name: string; - address: Address; - phones: ObservedArray; - - constructor(name: string, - street: string, - zip: number, - city: string, - phones: string[]) { - this.id_ = `${nextId}`; - nextId++; - this.name = name; - this.address = new Address(street, zip, city); - this.phones = new ObservedArray(phones); - } +```ts + + // ViewModel classes + let nextId = 0; + + @Observed + export class ObservedArray extends Array { + constructor(args?: any[]) { + console.log(`ObservedArray: ${JSON.stringify(args)} `) + if (Array.isArray(args)) { + super(...args); + } else { + super(args) } - - - export class AddressBook { - me: Person; - contacts: ObservedArray; - - constructor(me: Person, contacts: Person[]) { - this.me = me; - this.contacts = new ObservedArray(contacts); + } + } + + @Observed + export class Address { + street: string; + zip: number; + city: string; + + constructor(street: string, + zip: number, + city: string) { + this.street = street; + this.zip = zip; + this.city = city; + } + } + + @Observed + export class Person { + id_: string; + name: string; + address: Address; + phones: ObservedArray; + + constructor(name: string, + street: string, + zip: number, + city: string, + phones: string[]) { + this.id_ = `${nextId}`; + nextId++; + this.name = name; + this.address = new Address(street, zip, city); + this.phones = new ObservedArray(phones); + } + } + + export class AddressBook { + me: Person; + contacts: ObservedArray; + + constructor(me: Person, contacts: Person[]) { + this.me = me; + this.contacts = new ObservedArray(contacts); + } + } + + //渲染出Person对象的名称和Observed数组中的第一个号码 + //为了更新电话号码，这里需要@ObjectLink person和@ObjectLink phones， + //不能使用this.person.phones，内部数组的更改不会被观察到。 + // 在AddressBookView、PersonEditView中的onClick更新selectedPerson + @Component + struct PersonView { + @ObjectLink person: Person; + @ObjectLink phones: ObservedArray; + @Link selectedPerson: Person; + + build() { + Flex({ direction: FlexDirection.Row, justifyContent: FlexAlign.SpaceBetween }) { + Text(this.person.name) + if (this.phones.length) { + Text(this.phones[0]) } } - - //渲染出Person对象的名称和手机Observed数组中的第一个号码 - //为了更新电话号码，这里需要@ObjectLink person和@ObjectLink phones， - //不能使用this.person.phones，内部数组的更改不会被观察到。 - // 在AddressBookView、PersonEditView中的onClick更新selectedPerson - @Component - struct PersonView { - @ObjectLink person: Person; - @ObjectLink phones: ObservedArray; - @Link selectedPerson: Person; - - build() { - Flex({ direction: FlexDirection.Row, justifyContent: FlexAlign.SpaceBetween }) { - Text(this.person.name) - if (this.phones.length) { - Text(this.phones[0]) - } - } - .height(55) - .backgroundColor(this.selectedPerson.name == this.person.name ? "#ffa0a0" : "#ffffff") - .onClick(() => { - this.selectedPerson = this.person; + .height(55) + .backgroundColor(this.selectedPerson.name == this.person.name ? "#ffa0a0" : "#ffffff") + .onClick(() => { + this.selectedPerson = this.person; + }) + } + } + + // 渲染Person的详细信息 + // @Prop装饰的变量从父组件AddressBookView深拷贝数据，将变化保留在本地, TextInput的变化只会在本地副本上进行修改。 + // 点击 "Save Changes" 会将所有数据的复制通过@Prop到@Link, 同步到其他组件 + @Component + struct PersonEditView { + @Consume addrBook: AddressBook; + + /* 指向父组件selectedPerson的引用 */ + @Link selectedPerson: Person; + + /*在本地副本上编辑，直到点击保存*/ + @Prop name: string; + @Prop address: Address; + @Prop phones: ObservedArray; + + selectedPersonIndex(): number { + return this.addrBook.contacts.findIndex((person) => person.id_ == this.selectedPerson.id_); + } + + build() { + Column() { + TextInput({ text: this.name }) + .onChange((value) => { + this.name = value; }) - } - } - - // 渲染Person的详细信息 - // @Prop装饰的变量从父组件AddressBookView深拷贝数据，将变化保留在本地, TextInput的变化只会在本地副本上进行修改。 - // 点击 "Save Changes" 会将所有数据的复制通过@Prop到@Link, 同步到其他组件 - @Component - struct PersonEditView { - @Consume addrBook: AddressBook; - - /* 指向父组件selectedPerson的引用 */ - @Link selectedPerson: Person; - - /*在本地副本上编辑，直到点击保存*/ - @Prop name: string; - @Prop address: Address; - @Prop phones: ObservedArray; - - selectedPersonIndex(): number { - return this.addrBook.contacts.findIndex((person) => person.id_ == this.selectedPerson.id_); - } - - build() { - Column() { - TextInput({ text: this.name }) - .onChange((value) => { - this.name = value; - }) - TextInput({ text: this.address.street }) - .onChange((value) => { - this.address.street = value; - }) - - TextInput({ text: this.address.city }) - .onChange((value) => { - this.address.city = value; - }) - - TextInput({ text: this.address.zip.toString() }) - .onChange((value) => { - const result = parseInt(value); - this.address.zip = isNaN(result) ? 0 : result; - }) - - if (this.phones.length > 0) { - ForEach(this.phones, - (phone, index) => { - TextInput({ text: phone }) - .width(150) - .onChange((value) => { - console.log(`${index}. ${value} value has changed`) - this.phones[index] = value; - }) - }, - (phone, index) => `${index}-${phone}` - ) - } - - Flex({ direction: FlexDirection.Row, justifyContent: FlexAlign.SpaceBetween }) { - Text("Save Changes") - .onClick(() => { - // 将本地副本更新的值赋值给指向父组件selectedPerson的引用 - // 避免创建新对象，在现有属性上进行修改 - this.selectedPerson.name = this.name; - this.selectedPerson.address.street = this.address.street - this.selectedPerson.address.city = this.address.city - this.selectedPerson.address.zip = this.address.zip - this.phones.forEach((phone: string, index: number) => { - this.selectedPerson.phones[index] = phone - }); + TextInput({ text: this.address.street }) + .onChange((value) => { + this.address.street = value; + }) + + TextInput({ text: this.address.city }) + .onChange((value) => { + this.address.city = value; + }) + + TextInput({ text: this.address.zip.toString() }) + .onChange((value) => { + const result = parseInt(value); + this.address.zip = isNaN(result) ? 0 : result; + }) + + if (this.phones.length > 0) { + ForEach(this.phones, + (phone, index) => { + TextInput({ text: phone }) + .width(150) + .onChange((value) => { + console.log(`${index}. ${value} value has changed`) + this.phones[index] = value; }) - if (this.selectedPersonIndex() != -1) { - Text("Delete Contact") - .onClick(() => { - let index = this.selectedPersonIndex(); - console.log(`delete contact at index ${index}`); - - // 删除当前联系人 - this.addrBook.contacts.splice(index, 1); - - // 删除当前selectedPerson，选中态前移一位 - index = (index < this.addrBook.contacts.length) ? index : index - 1; - - // 如果contract被删除完，则设置me为选中态 - this.selectedPerson = (index >= 0) ? this.addrBook.contacts[index] : this.addrBook.me; - }) - } - } - - } + }, + (phone, index) => `${index}-${phone}` + ) } - } - - @Component - struct AddressBookView { - @ObjectLink me: Person; - @ObjectLink contacts: ObservedArray; - @State selectedPerson: Person = undefined; - - aboutToAppear() { - this.selectedPerson = this.me; - } - - build() { - Flex({ direction: FlexDirection.Column, justifyContent: FlexAlign.Start }) { - Text("Me:") - PersonView({ person: this.me, phones: this.me.phones, selectedPerson: this.$selectedPerson }) - - Divider().height(8) - - ForEach(this.contacts, - contact => { - PersonView({ person: contact, phones: contact.phones, selectedPerson: this.$selectedPerson }) - }, - contact => contact.id_ - ) - - Divider().height(8) - - Text("Edit:") - PersonEditView({ - selectedPerson: this.$selectedPerson, - name: this.selectedPerson.name, - address: this.selectedPerson.address, - phones: this.selectedPerson.phones + + Flex({ direction: FlexDirection.Row, justifyContent: FlexAlign.SpaceBetween }) { + Text("Save Changes") + .onClick(() => { + // 将本地副本更新的值赋值给指向父组件selectedPerson的引用 + // 避免创建新对象，在现有属性上进行修改 + this.selectedPerson.name = this.name; + this.selectedPerson.address.street = this.address.street + this.selectedPerson.address.city = this.address.city + this.selectedPerson.address.zip = this.address.zip + this.phones.forEach((phone: string, index: number) => { + this.selectedPerson.phones[index] = phone + }); }) + if (this.selectedPersonIndex() != -1) { + Text("Delete Contact") + .onClick(() => { + let index = this.selectedPersonIndex(); + console.log(`delete contact at index ${index}`); + + // 删除当前联系人 + this.addrBook.contacts.splice(index, 1); + + // 删除当前selectedPerson，选中态前移一位 + index = (index < this.addrBook.contacts.length) ? index : index - 1; + + // 如果contract被删除完，则设置me为选中态 + this.selectedPerson = (index >= 0) ? this.addrBook.contacts[index] : this.addrBook.me; + }) } - .borderStyle(BorderStyle.Solid).borderWidth(5).borderColor(0xAFEEEE).borderRadius(5) } + } - - @Entry - @Component - struct PageEntry { - @Provide addrBook: AddressBook = new AddressBook( - new Person("Gigi", "Itamerenkatu 9", 180, "Helsinki", ["+358441234567", "+35891234567", "+49621234567889"]), - [ - new Person("Oly", "Itamerenkatu 9", 180, "Helsinki", ["+358449876543", "+3589456789"]), - new Person("Sam", "Itamerenkatu 9", 180, "Helsinki", ["+358509876543", "+358910101010"]), - new Person("Vivi", "Itamerenkatu 9", 180, "Helsinki", ["+358400908070", "+35894445555"]), - ]); - - build() { - Column() { - AddressBookView({ me: this.addrBook.me, contacts: this.addrBook.contacts, selectedPerson: this.addrBook.me }) - } - } + } + } + + @Component + struct AddressBookView { + @ObjectLink me: Person; + @ObjectLink contacts: ObservedArray; + @State selectedPerson: Person = undefined; + + aboutToAppear() { + this.selectedPerson = this.me; + } + + build() { + Flex({ direction: FlexDirection.Column, justifyContent: FlexAlign.Start }) { + Text("Me:") + PersonView({ person: this.me, phones: this.me.phones, selectedPerson: this.$selectedPerson }) + + Divider().height(8) + + ForEach(this.contacts, + contact => { + PersonView({ person: contact, phones: contact.phones, selectedPerson: this.$selectedPerson }) + }, + contact => contact.id_ + ) + + Divider().height(8) + + Text("Edit:") + PersonEditView({ + selectedPerson: this.$selectedPerson, + name: this.selectedPerson.name, + address: this.selectedPerson.address, + phones: this.selectedPerson.phones + }) } - ``` \ No newline at end of file + .borderStyle(BorderStyle.Solid).borderWidth(5).borderColor(0xAFEEEE).borderRadius(5) + } + } + + @Entry + @Component + struct PageEntry { + @Provide addrBook: AddressBook = new AddressBook( + new Person("Gigi", "Itamerenkatu 9", 180, "Helsinki", ["18*********", "18*********", "18*********"]), + [ + new Person("Oly", "Itamerenkatu 9", 180, "Helsinki", ["18*********", "18*********"]), + new Person("Sam", "Itamerenkatu 9", 180, "Helsinki", ["18*********", "18*********"]), + new Person("Vivi", "Itamerenkatu 9", 180, "Helsinki", ["18*********", "18*********"]), + ]); + + build() { + Column() { + AddressBookView({ me: this.addrBook.me, contacts: this.addrBook.contacts, selectedPerson: this.addrBook.me }) + } + } + } +``` \ No newline at end of file diff --git a/zh-cn/application-dev/quick-start/arkts-page-custom-components-lifecycle.md b/zh-cn/application-dev/quick-start/arkts-page-custom-components-lifecycle.md index 9a27960acb511a7f413ae331ab862193f9b2abf1..4a2397a02a144d9965c9d6c1e452311412cd97c0 100644 --- a/zh-cn/application-dev/quick-start/arkts-page-custom-components-lifecycle.md +++ b/zh-cn/application-dev/quick-start/arkts-page-custom-components-lifecycle.md @@ -180,7 +180,9 @@ struct Child { - 如果调用的是router.replaceUrl，则当前Index页面被销毁，执行的生命周期流程将变为：Index onPageHide --> MyComponent aboutToDisappear --> Child aboutToDisappear。上文已经提到，组件的销毁是从组件树上直接摘下子树，所以先调用父组件的aboutToDisappear，再调用子组件的aboutToDisAppear，然后执行初始化新页面的生命周期流程。 -- 点击返回按钮，触发页面生命周期Index onBackPress。最小化应用或者应用进入后台，触发Index onPageHide。这两个状态下应用都没有被销毁，所以并不会执行组件的aboutToDisappear 。应用回到前台，执行Index onPageShow。 +- 点击返回按钮，触发页面生命周期Index onBackPress，且触发返回一个页面后会导致当前Index页面被销毁。 + +- 最小化应用或者应用进入后台，触发Index onPageHide。当前Index页面没有被销毁，所以并不会执行组件的aboutToDisappear。应用回到前台，执行Index onPageShow。 - 退出应用，执行Index onPageHide --> MyComponent aboutToDisappear --> Child aboutToDisappear。 diff --git a/zh-cn/application-dev/quick-start/typescript-to-arkts-migration-guide.md b/zh-cn/application-dev/quick-start/typescript-to-arkts-migration-guide.md index 083638d33287c0464b22dac0ee85808b92a95ef8..0d4553fa5cd806134a393ca02af5e895a864e760 100644 --- a/zh-cn/application-dev/quick-start/typescript-to-arkts-migration-guide.md +++ b/zh-cn/application-dev/quick-start/typescript-to-arkts-migration-guide.md @@ -651,7 +651,7 @@ interface Identity { interface Contact { email: string - phone: string + phoneNumber: string } type Employee = Identity & Contact @@ -667,7 +667,7 @@ interface Identity { interface Contact { email: string - phone: string + phoneNumber: string } interface Employee extends Identity, Contact {} @@ -3174,8 +3174,8 @@ class Person { const person: Person = { name: "John", age: 30, - email: "john@example.com", - phone: 1234567890, + email: "***@example.com", + phoneNumber: 18*********, } ``` @@ -3186,18 +3186,18 @@ class Person { name: string age: number email: string - phone: number + phoneNumber: number - constructor(name: string, age: number, email: string, phone: number) { + constructor(name: string, age: number, email: string, phoneNumber: number) { this.name = name this.age = age this.email = email - this.phone = phone + this.phoneNumber = phoneNumber } } function main(): void { - const person: Person = new Person("John", 30, "john@example.com", 1234567890) + const person: Person = new Person("John", 30, "***@example.com", 18*********) } ``` diff --git a/zh-cn/application-dev/reference/apis/Readme-CN.md b/zh-cn/application-dev/reference/apis/Readme-CN.md index 9597a88ad7f29b3c919f72c3fb29206e9e086167..2508b074a9c31fbc6b451e30074990d2afc0d880 100644 --- a/zh-cn/application-dev/reference/apis/Readme-CN.md +++ b/zh-cn/application-dev/reference/apis/Readme-CN.md @@ -198,22 +198,23 @@ - UI界面 - [@ohos.animator (动画)](js-apis-animator.md) - [@ohos.arkui.componentSnapshot (组件截图)](js-apis-arkui-componentSnapshot.md) + - [@ohos.arkui.componentUtils (componentUtils)](js-apis-arkui-componentUtils.md) - [@ohos.arkui.dragController (DragController)](js-apis-arkui-dragController.md) - [@ohos.arkui.drawableDescriptor (DrawableDescriptor)](js-apis-arkui-drawableDescriptor.md) - [@ohos.arkui.inspector (布局回调)](js-apis-arkui-inspector.md) + - [ @ohos.arkui.performanceMonitor (性能监测)](js-apis-arkui-performancemonitor.md) - [@ohos.arkui.UIContext (UIContext)](js-apis-arkui-UIContext.md) - [@ohos.arkui.componentUtils (componentUtils)](js-apis-arkui-componentUtils.md) - [@ohos.curves (插值计算)](js-apis-curve.md) - [@ohos.font (注册自定义字体)](js-apis-font.md) - [@ohos.matrix4 (矩阵变换)](js-apis-matrix4.md) + - [@ohos.measure (文本计算)](js-apis-measure.md) - [@ohos.mediaquery (媒体查询)](js-apis-mediaquery.md) - [@ohos.pluginComponent (PluginComponentManager)](js-apis-plugincomponent.md) - [@ohos.promptAction (弹窗)](js-apis-promptAction.md) - [@ohos.router (页面路由)](js-apis-router.md) - - [@ohos.measure (文本计算)](js-apis-measure.md) - [@ohos.uiAppearance (用户界面外观)](js-apis-uiappearance.md) - - [ @ohos.arkui.performanceMonitor (性能监测)](js-apis-arkui-performancemonitor.md) - + - 图形图像 - [@ohos.animation.windowAnimationManager (窗口动画管理)](js-apis-windowAnimationManager.md) - [@ohos.application.WindowExtensionAbility (窗口扩展能力)](js-apis-application-windowExtensionAbility.md) @@ -228,12 +229,15 @@ - [webgl2 (WebGL2)](js-apis-webgl2.md) - 媒体 + - [@ohos.app.ability.MediaControlExtensionAbility (播控扩展能力)](js-apis-app-ability-MediaControlExtensionAbility.md) - [@ohos.multimedia.audio (音频管理)](js-apis-audio.md) - [@ohos.multimedia.avsession (媒体会话管理)](js-apis-avsession.md) - [@ohos.multimedia.camera (相机管理)](js-apis-camera.md) - [@ohos.multimedia.image (图片处理)](js-apis-image.md) - [@ohos.multimedia.media (媒体服务)](js-apis-media.md) - [@ohos.multimedia.systemSoundManager (系统声音管理)](js-apis-systemSoundManager.md) + - application + - [MediaControlExtensionContext (播控扩展能力上下文)](js-apis-inner-application-MediaControlExtensionContext.md) - multimedia - [ringtonePlayer (铃声播放器)](js-apis-inner-multimedia-ringtonePlayer.md) diff --git a/zh-cn/application-dev/reference/apis/js-apis-app-ability-MediaControlExtensionAbility.md b/zh-cn/application-dev/reference/apis/js-apis-app-ability-MediaControlExtensionAbility.md new file mode 100644 index 0000000000000000000000000000000000000000..1661fe67effbfaa8ff976ce97974f527350b9e18 --- /dev/null +++ b/zh-cn/application-dev/reference/apis/js-apis-app-ability-MediaControlExtensionAbility.md @@ -0,0 +1,17 @@ +# @ohos.app.ability.MediaControlExtensionAbility (播控扩展能力) + +MediaControlExtensionAbility模块提供播放控制的扩展能力，继承自[UIExtensionAbility](js-apis-app-ability-uiExtensionAbility.md)，无其他新增接口。在实际开发时，需要开发者实现父类中的接口，使用UIExtensiton的生命周期和能力，不支持直接调用基类。 + +**系统能力：** SystemCapability.Multimedia.AVSession.Core + +> **说明：** +> +> - 本模块首批接口从API version 10开始支持。后续版本的新增接口，采用上角标单独标记接口的起始版本。 +> - 本模块接口仅可在Stage模型下使用。 +> - 本模块接口为系统接口。 + +## 导入模块 + +```js +import MediaControlExtensionAbility from @ohos.app.ability.MediaControlExtensionAbility; +``` diff --git a/zh-cn/application-dev/reference/apis/js-apis-app-form-formHost.md b/zh-cn/application-dev/reference/apis/js-apis-app-form-formHost.md index 6fa259689307bde652829c8f2bb91c0643dc6952..c2983efcd2fe9963b150a5bcd53ab9bae5ffc760 100644 --- a/zh-cn/application-dev/reference/apis/js-apis-app-form-formHost.md +++ b/zh-cn/application-dev/reference/apis/js-apis-app-form-formHost.md @@ -1202,95 +1202,6 @@ try { } ``` -## getRunningFormInfos10+ - -getRunningFormInfos(callback: AsyncCallback<Array<formInfo.RunningFormInfo>>, hostBundleName?: string): void - -获取设备上正在运行的所有非临时卡片信息。使用callback异步回调。 - -**需要权限**：ohos.permission.REQUIRE_FORM - -**系统能力**：SystemCapability.Ability.Form - -**参数：** - -| 参数名 | 类型 | 必填 | 说明 | -| ------ | ------ | ---- | ------- | -| callback | AsyncCallback<Array<formInfo.RunningFormInfo>> | 是 | 回调函数。获取设备上指定应用为卡片使用方的当前卡片信息成功，error为undefined，data为查询到的卡片信息。| -| hostBundleName | string | 否 | 指定要查询的卡片使用方名称，指定后会仅返回该卡片使用方下正在运行的非临时卡片信息。
缺省时，返回设备上所有正在运行的非临时卡片信息。 | - -**错误码：** -以下错误码的详细介绍请参见[卡片错误码](../errorcodes/errorcode-form.md)。 - -| 错误码ID | 错误信息 | -| -------- | -------- | -| 16500050 | An IPC connection error happened. | -| 16500060 | A service connection error happened, please try again later. || - -**示例：** - -```ts -import formHost from '@ohos.app.form.formHost'; - -try { - formHost.getRunningFormInfos((error, data) => { - if (error) { - console.error(`error, code: ${error.code}, message: ${error.message}`); - } else { - console.log('formHost getRunningFormInfos, data: ${JSON.stringify(data)}'); - } - }, 'com.example.ohos.formjsdemo'); -} catch(error) { - console.error(`catch error, code: ${error.code}, message: ${error.message}`); -} -``` - -## getRunningFormInfos10+ - -getRunningFormInfos(hostBundleName?: string): Promise<Array<formInfo.RunningFormInfo>> - -获取设备上正在运行的所有非临时卡片信息。使用Promise异步回调。 - -**需要权限**：ohos.permission.REQUIRE_FORM - -**系统能力**：SystemCapability.Ability.Form - -**参数：** - -| 参数名 | 类型 | 必填 | 说明 | -| ------ | ------ | ---- | ------- | -| hostBundleName | string | 否 | 指定要查询的卡片使用方名称，指定后会仅返回该卡片使用方下正在运行的非临时卡片信息。
缺省时，返回设备上所有正在运行的非临时卡片信息。 | - -**返回值：** - -| 类型 | 说明 | -| :----------------------------------------------------------- | :---------------------------------- | -| Promise<Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>> | Promise对象，返回查询到的卡片信息。 | - -**错误码：** -以下错误码的详细介绍请参见[卡片错误码](../errorcodes/errorcode-form.md)。 - -| 错误码ID | 错误信息 | -| -------- | -------- | -| 16500050 | An IPC connection error happened. | -| 16500060 | A service connection error happened, please try again later. || - -**示例：** - -```ts -import formHost from '@ohos.app.form.formHost'; - -try { - formHost.getRunningFormInfos('com.example.ohos.formjsdemo').then((data) => { - console.log('formHost getRunningFormInfos, data: ${JSON.stringify(data)}'); - }).catch((error) => { - console.error(`error, code: ${error.code}, message: ${error.message}`); - }); -} catch(error) { - console.error(`catch error, code: ${error.code}, message: ${error.message}`); -} -``` - ## deleteInvalidForms deleteInvalidForms(formIds: Array<string>, callback: AsyncCallback<number>): void @@ -1583,138 +1494,6 @@ let callback = function(formId) { formHost.off('formUninstall', callback); ``` -## on('formAdd')10+ - - on(type: 'formAdd', observerCallback: Callback<formInfo.RunningFormInfo>, bundleName?: string): void - -订阅卡片新增事件。使用callback异步回调，返回当前新增卡片的[RunningFormInfo](js-apis-app-form-formInfo.md)。 - -**需要权限**：ohos.permission.REQUIRE_FORM - -**系统能力**：SystemCapability.Ability.Form - -**参数：** - -| 参数名 | 类型 | 必填 | 说明 | -| ------ | ------ | ---- | ------- | -| type | string | 是 | 填写'formAdd'，表示卡片新增事件。 | -| callback | Callback<formInfo.RunningFormInfo> | 是 | 回调函数。返回新增卡片的RunningFormInfo。 | -| bundleName | string | 否 | 指定订阅卡片使用方包的bundleName。缺省则订阅所有卡片使用方的卡片新增事件。 | - -**示例：** - -```ts -import formHost from '@ohos.app.form.formHost'; -let bundleName = 'ohos.samples.FormApplication'; -let callback = function(data) { - console.log('a new form added, data: ${JSON.stringify(data)'); -} - -formHost.on('formAdd', callback); -formHost.on('formAdd', callback, bundleName); -``` - -## off('formAdd')10+ - - off(type: "formAdd", observerCallback?: Callback<formInfo.RunningFormInfo>, bundleName?: string): void - -取消订阅卡片新增事件。使用callback异步回调，返回当前新增卡片的[RunningFormInfo](js-apis-app-form-formInfo.md)。 - -**需要权限**：ohos.permission.REQUIRE_FORM - -**系统能力**：SystemCapability.Ability.Form - -**参数：** - -| 参数名 | 类型 | 必填 | 说明 | -| ------ | ------ | ---- | ------- | -| type | string | 是 | 填写'formAdd'，表示卡片新增事件。 | -| callback | Callback<formInfo.RunningFormInfo> | 否 | 回调函数。返回卡片RunningFormInfo。缺省时，表示注销对应已注册事件回调。
需与对应on('formAdd')的callback一致。| -| bundleName | string | 否 | 指定订阅卡片使用方包的bundleName。
填写该参数时，与注册时填写bundleName的on接口对应。
缺省则订阅所有卡片使用方的卡片删除事件，与注册时未填写bundleName的on接口相对应。 | - -**示例：** - -```ts -import formHost from '@ohos.app.form.formHost'; -let bundleName = 'ohos.samples.FormApplication'; -let callback = function(data) { - console.log('a new form added, data: ${JSON.stringify(data)'); -} - -formHost.off('formAdd', callback); -formHost.off('formAdd', callback, bundleName); -``` -> **说明：** -> on('formAdd', callback)与off('formAdd', callback)相对应； -> on('formAdd', callback, bundleName)与off('formAdd', callback, bundleName)相对应； -> 订阅（on）只能由自己对应的取消订阅接口（off）取消。 - -## on('formRemove')10+ - - on(type: 'formRemove', observerCallback: Callback<formInfo.RunningFormInfo>, bundleName?: string): void - -订阅卡片删除事件。使用callback异步回调，返回当前删除卡片的[RunningFormInfo](js-apis-app-form-formInfo.md)。 - -**需要权限**：ohos.permission.REQUIRE_FORM - -**系统能力**：SystemCapability.Ability.Form - -**参数：** - -| 参数名 | 类型 | 必填 | 说明 | -| ------ | ------ | ---- | ------- | -| type | string | 是 | 填写'formRemove'，表示卡片删除事件。 | -| callback | Callback<formInfo.RunningFormInfo> | 是 | 回调函数。返回删除卡片的RunningFormInfo。 | -| bundleName | string | 否 | 指定订阅卡片使用方包的bundleName。缺省则订阅所有卡片使用方的卡片删除事件。 | - -**示例：** - -```ts -import formHost from '@ohos.app.form.formHost'; -let bundleName = 'ohos.samples.FormApplication'; -let callback = function(data) { - console.log('a new form added, data: ${JSON.stringify(data)'); -} - -formHost.on('formRemove', callback); -formHost.on('formRemove', callback, bundleName); -``` - -## off('formRemove')10+ - -off(type: "formRemove", observerCallback?: Callback<formInfo.RunningFormInfo>, bundleName?: string): void - -取消订阅卡片删除事件。使用callback异步回调，返回当前删除卡片的[RunningFormInfo](js-apis-app-form-formInfo.md)。 - -**需要权限**：ohos.permission.REQUIRE_FORM - -**系统能力**：SystemCapability.Ability.Form - -**参数：** - -| 参数名 | 类型 | 必填 | 说明 | -| ------ | ------ | ---- | ------- | -| type | string | 是 | 填写'formRemove'，表示卡片删除事件。 | -| callback | Callback<formInfo.RunningFormInfo> | 否 | 回调函数。返回卡片RunningFormInfo。缺省时，表示注销对应已注册事件回调。
需与对应on('formRemove')的callback一致。| -| bundleName | string | 否 | 指定订阅卡片使用方包的bundleName。
填写该参数时，与注册时填写bundleName的on接口对应。
缺省则订阅所有卡片使用方的卡片删除事件，与注册时未填写bundleName的on接口相对应。 | - -**示例：** - -```ts -import formHost from '@ohos.app.form.formHost'; -let bundleName = 'ohos.samples.FormApplication'; -let callback = function(data) { - console.log('a new form added, data: ${JSON.stringify(data)'); -} - -formHost.off('formRemove', callback); -formHost.off('formRemove', callback, bundleName); -``` -> **说明：** -> on('formRemove', callback)与off('formRemove', callback)相对应； -> on('formRemove', callback, bundleName)与off('formRemove', callback, bundleName)相对应； -> 订阅（on）只能由自己对应的取消订阅接口（off）取消。 - ## notifyFormsVisible notifyFormsVisible(formIds: Array<string>, isVisible: boolean, callback: AsyncCallback<void>): void @@ -2221,350 +2000,3 @@ try { console.error(`catch error, code: ${error.code}, message: ${error.message}`); } ``` - -## getRunningFormInfosByFilter10+ - -getRunningFormInfosByFilter(formProviderFilter: formInfo.FormProviderFilter): Promise<Array<formInfo.RunningFormInfo>> - -根据提供方信息查询卡片已有的使用方列表信息。使用Promise异步回调。 - -**需要权限**：ohos.permission.REQUIRE_FORM - -**系统能力**：SystemCapability.Ability.Form - -**参数：** - -| 参数名 | 类型 | 必填 | 说明 | -| ----------- | --------------- | ---- | -------------------------------- | -| formProviderFilter | [formInfo.FormProviderFilter](js-apis-app-form-formInfo.md#formProviderFilter) | 是 | 卡片提供方应用信息。 | - -**返回值：** - -| 类型 | 说明 | -| ------------------- | ------------------------- | -| Promise<Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md#RunningFormInfo)>> | Promise对象，返回查询到的使用方列表信息。 | - -**错误码：** - -以下错误码的详细介绍请参见[卡片错误码](../errorcodes/errorcode-form.md)。 - -| 错误码ID | 错误信息 | -| -------- | -------- | -| 201 | Permissions denied. | -| 202 | The application is not a system application. | -| 401 | If the input parameter is not valid parameter. | -| 16500050 | An IPC connection error happened. | -| 16500100 | Failed to obtain the configuration information. | -| 16501000 | An internal functional error occurred. | - - -```ts -import formHost from '@ohos.app.form.formHost'; - -let formInstanceFilter = { - bundleName: "com.example.formprovide", - abilityName: "EntryFormAbility", - formName: "widget", - moduleName: "entry" -} -try { - formHost.getRunningFormInfosByFilter(formInstanceFilter).then(data1 => { - console.info('formHost getRunningFormInfosByFilter return err :'); - }).catch((error) => { - console.error(`error, code: ${error.code}, message: ${error.message}`); - }); -} catch(error) { - console.error(`catch error, code: ${error.code}, message: ${error.message}`); -} -``` - -## getRunningFormInfosByFilter10+ - -getRunningFormInfosByFilter(formProviderFilter: formInfo.FormProviderFilter, callback: AsyncCallback<Array<formInfo.RunningFormInfo>>): void - -根据提供方信息查询卡片已有的使用方列表信息。使用callback异步回调。 - -**需要权限**：ohos.permission.REQUIRE_FORM - -**系统能力**：SystemCapability.Ability.Form - -**参数：** - -| 参数名 | 类型 | 必填 | 说明 | -| ----------- | --------------- | ---- | -------------------------------- | -| formProviderFilter | [formInfo.FormProviderFilter](js-apis-app-form-formInfo.md#formProviderFilter) | 是 | 卡片提供方应用信息。 | -| callback | AsyncCallback<Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>> | 是 | 回调函数。返回查询到的使用方列表信息，error为undefined，data为查询到的使用方列表信息；否则为错误对象。 | - -**错误码：** - -以下错误码的详细介绍请参见[卡片错误码](../errorcodes/errorcode-form.md)。 - -| 错误码ID | 错误信息 | -| -------- | -------- | -| 201 | Permissions denied. | -| 202 | The application is not a system application. | -| 401 | If the input parameter is not valid parameter. | -| 16500050 | An IPC connection error happened. | -| 16500100 | Failed to obtain the configuration information. | -| 16501000 | An internal functional error occurred. | - - -```ts -import formHost from '@ohos.app.form.formHost'; - -let formInstanceFilter = { - bundleName: "com.example.formprovide", - abilityName: "EntryFormAbility", - formName: "widget", - moduleName: "entry" -} -try { - formHost.getRunningFormInfosByFilter(formInstanceFilter,(error, data) => { - if (error) { - console.error(`error, code: ${error.code}, message: ${error.message}`); - } else { - console.log('formHost getRunningFormInfosByFilter, data: ${JSON.stringify(data)}'); - } - }); -} catch(error) { - console.error(`catch error, code: ${error.code}, message: ${error.message}`); -} -``` - -## getRunningFormInfoById10+ - -getRunningFormInfoById(formId: string): Promise<formInfo.RunningFormInfo> - - -根据formId查询卡片已有的使用方列表信息。使用Promise异步回调。 - -**需要权限**：ohos.permission.REQUIRE_FORM - -**系统能力**：SystemCapability.Ability.Form - -**参数：** - -| 参数名 | 类型 | 必填 | 说明 | -| ----------- | --------------- | ---- | -------------------------------- | -| formId | string | 是 | 卡片标识。 | - -**返回值：** - -| 类型 | 说明 | -| ------------------- | ------------------------- | -| Promise<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)> | Promise对象，返回查询到的使用方列表信息。 | - -**错误码：** - -以下错误码的详细介绍请参见[卡片错误码](../errorcodes/errorcode-form.md)。 - -| 错误码ID | 错误信息 | -| -------- | -------- | -| 201 | Permissions denied. | -| 202 | The application is not a system application. | -| 401 | If the input parameter is not valid parameter. | -| 16500050 | An IPC connection error happened. | -| 16500100 | Failed to obtain the configuration information. | -| 16501000 | An internal functional error occurred. | - - -```ts -import formHost from '@ohos.app.form.formHost'; -let formId = '12400633174999288'; -try { - formHost.getRunningFormInfoById(formId).then(data1 => { - console.info('formHost getRunningFormInfoById return err :'); - }).catch((error) => { - console.error(`error, code: ${error.code}, message: ${error.message}`); - }); -} catch(error) { - console.error(`catch error, code: ${error.code}, message: ${error.message}`); -} -``` - -## getRunningFormInfoById10+ - -getRunningFormInfoById(formId: string, callback: AsyncCallback<formInfo.RunningFormInfo>): void - -根据提供方信息查询卡片已有的使用方列表信息。使用callback异步回调。 - -**需要权限**：ohos.permission.REQUIRE_FORM - -**系统能力**：SystemCapability.Ability.Form - -**参数：** - -| 参数名 | 类型 | 必填 | 说明 | -| ----------- | --------------- | ---- | -------------------------------- | -| formId | string | 是 | 卡片标识。 | -| callback | AsyncCallback<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)> | 是 | 回调函数。返回查询到的使用方列表信息，error为undefined，data为查询到的使用方列表信息；否则为错误对象。 | - -**错误码：** - -以下错误码的详细介绍请参见[卡片错误码](../errorcodes/errorcode-form.md)。 - -| 错误码ID | 错误信息 | -| -------- | -------- | -| 201 | Permissions denied. | -| 202 | The application is not a system application. | -| 401 | If the input parameter is not valid parameter. | -| 16500050 | An IPC connection error happened. | -| 16500100 | Failed to obtain the configuration information. | -| 16501000 | An internal functional error occurred. | - -```ts -import formHost from '@ohos.app.form.formHost'; - -let formId = '12400633174999288'; -try { - formHost.getRunningFormInfoById(formId,(error, data) => { - if (error) { - console.error(`error, code: ${error.code}, message: ${error.message}`); - } else { - console.log('formHost getRunningFormInfoById, data: ${JSON.stringify(data)}'); - } - }); -} catch(error) { - console.error(`catch error, code: ${error.code}, message: ${error.message}`); -} -``` - -## on('notifyVisible')10+ - - on(type: 'notifyVisible', observerCallback: Callback<Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>>, bundleName?: string): void - -订阅通知卡片可见的事件。 - -​触发通知卡片可见场景为：调用notifyVisibleForms接口通知对应卡片可见性变更为可见状态 - -**需要权限**：ohos.permission.REQUIRE_FORM - -**系统能力**：SystemCapability.Ability.Form - -**参数：** - -| 参数名 | 类型 | 必填 | 说明 | -| ---------- | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | -| type | string | 是 | 仅允许填写'notifyVisible'，表示订阅通知卡片可见的事件。 | -| callback | Callback <Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>> | 是 | 回调函数。返回订阅通知卡片可见的RunningFormInfo。 | -| bundleName | string | 否 | 指定卡片使用方的bundleName，用于订阅卡片在该使用方的可见状态变更事件。 | - -**示例：** - -```ts -import formHost from '@ohos.app.form.formHost'; -let bundleName = 'ohos.samples.FormApplication'; -let callback = function(data) { - console.log('form change visibility, data: ${JSON.stringify(data)'); -} - -formHost.on('notifyVisible', callback); -formHost.on('notifyVisible', callback, bundleName); -``` - -## off('notifyVisible')10+ - - off(type: "notifyVisible", observerCallback?: Callback<Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>>, bundleName?: string): void - -取消订阅通知卡片可见的事件。 - -**需要权限**：ohos.permission.REQUIRE_FORM - -**系统能力**：SystemCapability.Ability.Form - -**参数：** - -| 参数名 | 类型 | 必填 | 说明 | -| ---------- | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | -| type | string | 是 | 仅允许填写'notifyVisible'，表示取消订阅通知卡片为可见的事件。 | -| callback | Callback <Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>> | 否 | 入参，注册时注册进去的callback。缺省时，表示注销对应已注册订阅的回调。
需与对应on('notifyVisible')的callback一致。 | -| bundleName | string | 否 | 指定卡片使用方的bundleName，用于订阅卡片在该使用方的可见状态变更事件。
填写该参数时，与注册时填写bundleName的on接口对应。 | - -**示例：** - -```ts -import formHost from '@ohos.app.form.formHost'; -let bundleName = 'ohos.samples.FormApplication'; -let callback = function(data) { - console.log('form change visibility, data: ${JSON.stringify(data)'); -} - -formHost.off('notifyVisible', callback); -formHost.off('notifyVisible', callback, bundleName); -``` - -> **说明：** -> on('notifyVisible', callback)与off('notifyVisible', callback)相对应； -> on('notifyVisible', callback, bundleName)与off('notifyVisible', callback, bundleName)相对应； -> 订阅（on）只能由自己对应的取消订阅接口（off）取消。 - - - -## on('notifyInvisible')10+ - - on(type: 'notifyInvisible', observerCallback: Callback<Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>>, bundleName?: string): void - -订阅通知卡片不可见的事件。 - -​触发通知卡片不可见场景为：调用notifyInvisibleForms接口通知对应卡片可见性变更为不可见状态 - -**需要权限**：ohos.permission.REQUIRE_FORM - -**系统能力**：SystemCapability.Ability.Form - -**参数：** - -| 参数名 | 类型 | 必填 | 说明 | -| ---------- | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | -| type | string | 是 | 仅允许填写'notifyInvisible'，表示订阅卡片不可见的事件。 | -| callback | Callback <Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>> | 是 | 回调函数。返回订阅通知卡片不可见的RunningFormInfo。 | -| bundleName | string | 否 | 指定卡片使用方的bundleName，用于订阅卡片在该使用方的可见状态变更事件。 | - -**示例：** - -```ts -import formHost from '@ohos.app.form.formHost'; -let bundleName = 'ohos.samples.FormApplication'; -let callback = function(data) { - console.log('form change invisibility, data: ${JSON.stringify(data)'); -} - -formHost.on('notifyInvisible', callback); -formHost.on('notifyInvisible', callback, bundleName); -``` - -## off('notifyInvisible')10+ - - off(type: "notifyInvisible", observerCallback?: Callback<Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>>, bundleName?: string): void - -取消订阅通知卡片不可见事件。 - -**需要权限**：ohos.permission.REQUIRE_FORM - -**系统能力**：SystemCapability.Ability.Form - -**参数：** - -| 参数名 | 类型 | 必填 | 说明 | -| ---------- | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | -| type | string | 是 | 仅允许填写'notifyInvisible'，表示卡片可见性变更为不可见。 | -| callback | Callback <Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>> | 否 | 入参，注册时注册进去的callback。缺省时，表示注销对应已注册事件回调。
需与对应on('notifyInvisible')的callback一致。 | -| bundleName | string | 否 | 指定卡片使用方的bundleName，用于订阅卡片在该使用方的可见状态变更事件。
填写该参数时，与注册时填写bundleName的on接口对应。
| - -**示例：** - -```ts -import formHost from '@ohos.app.form.formHost'; -let bundleName = 'ohos.samples.FormApplication'; -let callback = function(data) { - console.log('form change invisibility, data: ${JSON.stringify(data)'); -} - -formHost.off('notifyInvisible', callback); -formHost.off('notifyInvisible', callback, bundleName); -``` - -> **说明：** -> on('notifyInvisible', callback)与off('notifyInvisible', callback)相对应； -> on('notifyInvisible', callback, bundleName)与off('notifyInvisible', callback, bundleName)相对应； -> 订阅（on）只能由自己对应的取消订阅接口（off）取消。 \ No newline at end of file diff --git a/zh-cn/application-dev/reference/apis/js-apis-app-form-formObserver.md b/zh-cn/application-dev/reference/apis/js-apis-app-form-formObserver.md new file mode 100644 index 0000000000000000000000000000000000000000..7a3ed1f4cd871af1563f3c97d046cd1ad8d49f10 --- /dev/null +++ b/zh-cn/application-dev/reference/apis/js-apis-app-form-formObserver.md @@ -0,0 +1,699 @@ +# @ohos.app.form.formObserver (formObserver) + +formObserver模块提供了卡片监听方相关接口的能力，包括对同一用户下安装的卡片新增、删除、可见性变化事件的订阅和取消订阅，获取正在运行的卡片信息等。 + +> **说明：** +> +> 本模块首批接口从API version 10开始支持。后续版本的新增接口，采用上角标单独标记接口的起始版本。 +> 本模块接口均为系统接口。 + +## 导入模块 + +```ts +import formObserver from '@ohos.app.form.formObserver'; +``` + +## on('formAdd') + + on(type: 'formAdd', observerCallback: Callback<formInfo.RunningFormInfo>): void + +订阅卡片新增事件。使用callback异步回调，返回当前新增卡片的[RunningFormInfo](js-apis-app-form-formInfo.md)。 + +**需要权限**：ohos.permission.OBSERVE_FORM_RUNNING + +**系统能力**：SystemCapability.Ability.Form + +**参数：** + +| 参数名 | 类型 | 必填 | 说明 | +| ------ | ------ | ---- | ------- | +| type | string | 是 | 填写'formAdd'，表示卡片新增事件。 | +| callback | Callback<formInfo.RunningFormInfo> | 是 | 回调函数。返回新增卡片的RunningFormInfo。 | + +**示例：** + +```ts +import formObserver from '@ohos.app.form.formObserver'; +let callback = function(data) { + console.log('a new form added, data: ${JSON.stringify(data)'); +} + +formObserver.on('formAdd', callback); +``` + +## on('formAdd') + + on(type: 'formAdd', bundleName: string, observerCallback: Callback<formInfo.RunningFormInfo>): void + +订阅卡片新增事件。使用callback异步回调，返回指定卡片使用方应用新增卡片的[RunningFormInfo](js-apis-app-form-formInfo.md)。 + +**需要权限**：ohos.permission.OBSERVE_FORM_RUNNING + +**系统能力**：SystemCapability.Ability.Form + +**参数：** + +| 参数名 | 类型 | 必填 | 说明 | +| ------ | ------ | ---- | ------- | +| type | string | 是 | 填写'formAdd'，表示卡片新增事件。 | +| bundleName | string | 是 | 指定订阅卡片使用方包的bundleName。缺省则订阅所有卡片使用方的卡片新增事件。 | +| callback | Callback<formInfo.RunningFormInfo> | 是 | 回调函数。返回新增卡片的RunningFormInfo。 | + + +**示例：** + +```ts +import formObserver from '@ohos.app.form.formObserver'; +let bundleName = 'ohos.samples.FormApplication'; +let callback = function(data) { + console.log('a new form added, data: ${JSON.stringify(data)'); +} + +formObserver.on('formAdd', bundleName, callback); +``` + +## off('formAdd') + + off(type: "formAdd", bundleName?: string, observerCallback?: Callback<formInfo.RunningFormInfo>): void + +取消订阅卡片新增事件。使用callback异步回调，返回当前新增卡片的[RunningFormInfo](js-apis-app-form-formInfo.md)。 + +**需要权限**：ohos.permission.OBSERVE_FORM_RUNNING + +**系统能力**：SystemCapability.Ability.Form + +**参数：** + +| 参数名 | 类型 | 必填 | 说明 | +| ------ | ------ | ---- | ------- | +| type | string | 是 | 填写'formAdd'，表示卡片新增事件。 | +| bundleName | string | 否 | 指定订阅卡片使用方包的bundleName。
填写该参数时，与注册时填写bundleName的on接口对应。
缺省则订阅所有卡片使用方的卡片删除事件，与注册时未填写bundleName的on接口相对应。 | +| callback | Callback<formInfo.RunningFormInfo> | 否 | 回调函数。返回卡片RunningFormInfo。缺省时，表示注销对应已注册事件回调。
需与对应on('formAdd')的callback一致。| + + +**示例：** + +```ts +import formObserver from '@ohos.app.form.formObserver'; +let bundleName = 'ohos.samples.FormApplication'; +let callback = function(data) { + console.log('a new form added, data: ${JSON.stringify(data)'); +} + +formObserver.off('formAdd', callback); +formObserver.off('formAdd', bundleName, callback); +``` +> **说明：** +> on('formAdd', callback)与off('formAdd', callback)相对应； +> on('formAdd', bundleName, callback)与off('formAdd', bundleName, callback)相对应； +> 订阅（on）只能由自己对应的取消订阅接口（off）取消。 + +## on('formRemove') + + on(type: 'formRemove', observerCallback: Callback<formInfo.RunningFormInfo>): void + +订阅卡片删除事件。使用callback异步回调，返回当前删除卡片的[RunningFormInfo](js-apis-app-form-formInfo.md)。 + +**需要权限**：ohos.permission.OBSERVE_FORM_RUNNING + +**系统能力**：SystemCapability.Ability.Form + +**参数：** + +| 参数名 | 类型 | 必填 | 说明 | +| ------ | ------ | ---- | ------- | +| type | string | 是 | 填写'formRemove'，表示卡片删除事件。 | +| callback | Callback<formInfo.RunningFormInfo> | 是 | 回调函数。返回删除卡片的RunningFormInfo。 | + +**示例：** + +```ts +import formObserver from '@ohos.app.form.formObserver'; +let callback = function(data) { + console.log('form deleted, data: ${JSON.stringify(data)'); +} + +formObserver.on('formRemove', callback); +``` + +## on('formRemove') + + on(type: 'formRemove', bundleName: string, observerCallback: Callback<formInfo.RunningFormInfo>): void + +订阅卡片删除事件。使用callback异步回调，返回指定卡片使用方应用被删除卡片的[RunningFormInfo](js-apis-app-form-formInfo.md)。 + +**需要权限**：ohos.permission.OBSERVE_FORM_RUNNING + +**系统能力**：SystemCapability.Ability.Form + +**参数：** + +| 参数名 | 类型 | 必填 | 说明 | +| ------ | ------ | ---- | ------- | +| type | string | 是 | 填写'formRemove'，表示卡片删除事件。 | +| bundleName | string | 是 | 指定订阅卡片使用方包的bundleName。缺省则订阅所有卡片使用方的卡片删除事件。 | +| callback | Callback<formInfo.RunningFormInfo> | 是 | 回调函数。返回删除卡片的RunningFormInfo。 | + + +**示例：** + +```ts +import formObserver from '@ohos.app.form.formObserver'; +let bundleName = 'ohos.samples.FormApplication'; +let callback = function(data) { + console.log('form deleted, data: ${JSON.stringify(data)'); +} + +formObserver.on('formRemove', bundleName, callback); +``` + +## off('formRemove') + +off(type: "formRemove", bundleName?: string, observerCallback?: Callback<formInfo.RunningFormInfo>): void + +取消订阅卡片删除事件。使用callback异步回调，返回当前删除卡片的[RunningFormInfo](js-apis-app-form-formInfo.md)。 + +**需要权限**：ohos.permission.OBSERVE_FORM_RUNNING + +**系统能力**：SystemCapability.Ability.Form + +**参数：** + +| 参数名 | 类型 | 必填 | 说明 | +| ------ | ------ | ---- | ------- | +| type | string | 是 | 填写'formRemove'，表示卡片删除事件。 | +| bundleName | string | 否 | 指定订阅卡片使用方包的bundleName。
填写该参数时，与注册时填写bundleName的on接口对应。
缺省则订阅所有卡片使用方的卡片删除事件，与注册时未填写bundleName的on接口相对应。 | +| callback | Callback<formInfo.RunningFormInfo> | 否 | 回调函数。返回卡片RunningFormInfo。缺省时，表示注销对应已注册事件回调。
需与对应on('formRemove')的callback一致。| + +**示例：** + +```ts +import formObserver from '@ohos.app.form.formObserver'; +let bundleName = 'ohos.samples.FormApplication'; +let callback = function(data) { + console.log('a new form added, data: ${JSON.stringify(data)'); +} + +formObserver.off('formRemove', callback); +formObserver.off('formRemove', bundleName, callback); +``` +> **说明：** +> on('formRemove', callback)与off('formRemove', callback)相对应； +> on('formRemove', bundleName, callback)与off('formRemove', bundleName, callback)相对应； +> 订阅（on）只能由自己对应的取消订阅接口（off）取消。 + +## on('notifyVisible') + + on(type: 'notifyVisible', observerCallback: Callback<Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>>): void + +订阅通知卡片可见的事件。 + +​触发通知卡片可见场景为：调用notifyVisibleForms接口通知对应卡片可见性变更为可见状态 + +**需要权限**：ohos.permission.OBSERVE_FORM_RUNNING + +**系统能力**：SystemCapability.Ability.Form + +**参数：** + +| 参数名 | 类型 | 必填 | 说明 | +| ---------- | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | +| type | string | 是 | 仅允许填写'notifyVisible'，表示订阅通知卡片可见的事件。 | +| callback | Callback <Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>> | 是 | 回调函数。返回订阅通知卡片可见的RunningFormInfo。 | + +**示例：** + +```ts +import formObserver from '@ohos.app.form.formObserver'; +let callback = function(data) { + console.log('form change visibility, data: ${JSON.stringify(data)'); +} + +formObserver.on('notifyVisible', callback); +``` + +## on('notifyVisible') + + on(type: 'notifyVisible', bundleName: string, observerCallback: Callback<Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>>): void + +订阅通知卡片可见的事件。 + +​触发通知卡片可见场景为：调用notifyVisibleForms接口通知对应卡片可见性变更为可见状态 + +**需要权限**：ohos.permission.OBSERVE_FORM_RUNNING + +**系统能力**：SystemCapability.Ability.Form + +**参数：** + +| 参数名 | 类型 | 必填 | 说明 | +| ---------- | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | +| type | string | 是 | 仅允许填写'notifyVisible'，表示订阅通知卡片可见的事件。 | +| bundleName | string | 是 | 指定卡片使用方的bundleName，用于订阅卡片在该使用方的可见状态变更事件。 | +| callback | Callback <Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>> | 是 | 回调函数。返回订阅通知卡片可见的RunningFormInfo。 | + + +**示例：** + +```ts +import formObserver from '@ohos.app.form.formObserver'; +let bundleName = 'ohos.samples.FormApplication'; +let callback = function(data) { + console.log('form change visibility, data: ${JSON.stringify(data)'); +} + +formObserver.on('notifyVisible', bundleName, callback); +``` + +## off('notifyVisible') + + off(type: "notifyVisible", bundleName?: string, observerCallback?: Callback<Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>>): void + +取消订阅通知卡片可见的事件。 + +**需要权限**：ohos.permission.OBSERVE_FORM_RUNNING + +**系统能力**：SystemCapability.Ability.Form + +**参数：** + +| 参数名 | 类型 | 必填 | 说明 | +| ---------- | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | +| type | string | 是 | 仅允许填写'notifyVisible'，表示取消订阅通知卡片为可见的事件。 | +| bundleName | string | 否 | 指定卡片使用方的bundleName，用于订阅卡片在该使用方的可见状态变更事件。
填写该参数时，与注册时填写bundleName的on接口对应。 | +| callback | Callback <Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>> | 否 | 入参，注册时注册进去的callback。缺省时，表示注销对应已注册订阅的回调。
需与对应on('notifyVisible')的callback一致。 | + + +**示例：** + +```ts +import formObserver from '@ohos.app.form.formObserver'; +let bundleName = 'ohos.samples.FormApplication'; +let callback = function(data) { + console.log('form change visibility, data: ${JSON.stringify(data)'); +} + +formObserver.off('notifyVisible', callback); +formObserver.off('notifyVisible', bundleName, callback); +``` + +> **说明：** +> on('notifyVisible', callback)与off('notifyVisible', callback)相对应； +> on('notifyVisible', bundleName, callback)与off('notifyVisible', bundleName, callback)相对应； +> 订阅（on）只能由自己对应的取消订阅接口（off）取消。 + +## on('notifyInvisible') + + on(type: 'notifyInvisible', observerCallback: Callback<Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>>): void + +订阅通知卡片不可见的事件。 + +​触发通知卡片不可见场景为：调用notifyInvisibleForms接口通知对应卡片可见性变更为不可见状态 + +**需要权限**：ohos.permission.OBSERVE_FORM_RUNNING + +**系统能力**：SystemCapability.Ability.Form + +**参数：** + +| 参数名 | 类型 | 必填 | 说明 | +| ---------- | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | +| type | string | 是 | 仅允许填写'notifyInvisible'，表示订阅卡片不可见的事件。 | +| callback | Callback <Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>> | 是 | 回调函数。返回订阅通知卡片不可见的RunningFormInfo。 | + +**示例：** + +```ts +import formObserver from '@ohos.app.form.formObserver'; +let callback = function(data) { + console.log('form change invisibility, data: ${JSON.stringify(data)'); +} + +formObserver.on('notifyInvisible', callback); +``` + + +## on('notifyInvisible') + + on(type: 'notifyInvisible', bundleName: string, observerCallback: Callback<Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>>): void + +订阅通知卡片不可见的事件。 + +​触发通知卡片不可见场景为：调用notifyInvisibleForms接口通知对应卡片可见性变更为不可见状态 + +**需要权限**：ohos.permission.OBSERVE_FORM_RUNNING + +**系统能力**：SystemCapability.Ability.Form + +**参数：** + +| 参数名 | 类型 | 必填 | 说明 | +| ---------- | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | +| type | string | 是 | 仅允许填写'notifyInvisible'，表示订阅卡片不可见的事件。 | +| bundleName | string | 是 | 指定卡片使用方的bundleName，用于订阅卡片在该使用方的可见状态变更事件。 | +| callback | Callback <Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>> | 是 | 回调函数。返回订阅通知卡片不可见的RunningFormInfo。 | + +**示例：** + +```ts +import formObserver from '@ohos.app.form.formObserver'; +let bundleName = 'ohos.samples.FormApplication'; +let callback = function(data) { + console.log('form change invisibility, data: ${JSON.stringify(data)'); +} + +formObserver.on('notifyInvisible', bundleName, callback); +``` + +## off('notifyInvisible') + + off(type: "notifyInvisible", bundleName?: string, observerCallback?: Callback<Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>>): void + +取消订阅通知卡片不可见事件。 + +**需要权限**：ohos.permission.OBSERVE_FORM_RUNNING + +**系统能力**：SystemCapability.Ability.Form + +**参数：** + +| 参数名 | 类型 | 必填 | 说明 | +| ---------- | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | +| type | string | 是 | 仅允许填写'notifyInvisible'，表示卡片可见性变更为不可见。 | +| bundleName | string | 否 | 指定卡片使用方的bundleName，用于订阅卡片在该使用方的可见状态变更事件。
填写该参数时，与注册时填写bundleName的on接口对应。
| +| callback | Callback <Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>> | 否 | 入参，注册时注册进去的callback。缺省时，表示注销对应已注册事件回调。
需与对应on('notifyInvisible')的callback一致。 | + +**示例：** + +```ts +import formObserver from '@ohos.app.form.formObserver'; +let bundleName = 'ohos.samples.FormApplication'; +let callback = function(data) { + console.log('form change invisibility, data: ${JSON.stringify(data)'); +} + +formObserver.off('notifyInvisible', callback); +formObserver.off('notifyInvisible', bundleName, callback); +``` + +> **说明：** +> on('notifyInvisible', callback)与off('notifyInvisible', callback)相对应； +> on('notifyInvisible', bundleName, callback)与off('notifyInvisible', bundleName, callback)相对应； +> 订阅（on）只能由自己对应的取消订阅接口（off）取消。 + + +## getRunningFormInfos + +getRunningFormInfos(callback: AsyncCallback<Array<formInfo.RunningFormInfo>>, hostBundleName?: string): void + +获取设备上正在运行的所有非临时卡片信息。使用callback异步回调。 + +**需要权限**：ohos.permission.OBSERVE_FORM_RUNNING + +**系统能力**：SystemCapability.Ability.Form + +**参数：** + +| 参数名 | 类型 | 必填 | 说明 | +| ------ | ------ | ---- | ------- | +| callback | AsyncCallback<Array<formInfo.RunningFormInfo>> | 是 | 回调函数。获取设备上指定应用为卡片使用方的当前卡片信息成功，error为undefined，data为查询到的卡片信息。| +| hostBundleName | string | 否 | 指定要查询的卡片使用方名称，指定后会仅返回该卡片使用方下正在运行的非临时卡片信息。
缺省时，返回设备上所有正在运行的非临时卡片信息。 | + +**错误码：** +以下错误码的详细介绍请参见[卡片错误码](../errorcodes/errorcode-form.md)。 + +| 错误码ID | 错误信息 | +| -------- | -------- | +| 16500050 | An IPC connection error happened. | +| 16500060 | A service connection error happened, please try again later. || + +**示例：** + +```ts +import formObserver from '@ohos.app.form.formObserver'; + +try { + formObserver.getRunningFormInfos((error, data) => { + if (error) { + console.error(`error, code: ${error.code}, message: ${error.message}`); + } else { + console.log('formObserver getRunningFormInfos, data: ${JSON.stringify(data)}'); + } + }, 'com.example.ohos.formjsdemo'); +} catch(error) { + console.error(`catch error, code: ${error.code}, message: ${error.message}`); +} +``` + +## getRunningFormInfos + +getRunningFormInfos(hostBundleName?: string): Promise<Array<formInfo.RunningFormInfo>> + +获取设备上正在运行的所有非临时卡片信息。使用Promise异步回调。 + +**需要权限**：ohos.permission.OBSERVE_FORM_RUNNING + +**系统能力**：SystemCapability.Ability.Form + +**参数：** + +| 参数名 | 类型 | 必填 | 说明 | +| ------ | ------ | ---- | ------- | +| hostBundleName | string | 否 | 指定要查询的卡片使用方名称，指定后会仅返回该卡片使用方下正在运行的非临时卡片信息。
缺省时，返回设备上所有正在运行的非临时卡片信息。 | + +**返回值：** + +| 类型 | 说明 | +| :----------------------------------------------------------- | :---------------------------------- | +| Promise<Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>> | Promise对象，返回查询到的卡片信息。 | + +**错误码：** +以下错误码的详细介绍请参见[卡片错误码](../errorcodes/errorcode-form.md)。 + +| 错误码ID | 错误信息 | +| -------- | -------- | +| 16500050 | An IPC connection error happened. | +| 16500060 | A service connection error happened, please try again later. || + +**示例：** + +```ts +import formObserver from '@ohos.app.form.formObserver'; + +try { + formObserver.getRunningFormInfos('com.example.ohos.formjsdemo').then((data) => { + console.log('formObserver getRunningFormInfos, data: ${JSON.stringify(data)}'); + }).catch((error) => { + console.error(`error, code: ${error.code}, message: ${error.message}`); + }); +} catch(error) { + console.error(`catch error, code: ${error.code}, message: ${error.message}`); +} +``` + +## getRunningFormInfosByFilter + +getRunningFormInfosByFilter(formProviderFilter: formInfo.FormProviderFilter): Promise<Array<formInfo.RunningFormInfo>> + +根据提供方信息查询卡片已有的使用方列表信息。使用Promise异步回调。 + +**需要权限**：ohos.permission.OBSERVE_FORM_RUNNING + +**系统能力**：SystemCapability.Ability.Form + +**参数：** + +| 参数名 | 类型 | 必填 | 说明 | +| ----------- | --------------- | ---- | -------------------------------- | +| formProviderFilter | [formInfo.FormProviderFilter](js-apis-app-form-formInfo.md#formProviderFilter) | 是 | 卡片提供方应用信息。 | + +**返回值：** + +| 类型 | 说明 | +| ------------------- | ------------------------- | +| Promise<Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md#RunningFormInfo)>> | Promise对象，返回查询到的使用方列表信息。 | + +**错误码：** + +以下错误码的详细介绍请参见[卡片错误码](../errorcodes/errorcode-form.md)。 + +| 错误码ID | 错误信息 | +| -------- | -------- | +| 201 | Permissions denied. | +| 202 | The application is not a system application. | +| 401 | If the input parameter is not valid parameter. | +| 16500050 | An IPC connection error happened. | +| 16500100 | Failed to obtain the configuration information. | +| 16501000 | An internal functional error occurred. | + + +```ts +import formObserver from '@ohos.app.form.formObserver'; + +let formInstanceFilter = { + bundleName: "com.example.formprovide", + abilityName: "EntryFormAbility", + formName: "widget", + moduleName: "entry" +} +try { + formObserver.getRunningFormInfosByFilter(formInstanceFilter).then(data1 => { + console.info('formObserver getRunningFormInfosByFilter return err :'); + }).catch((error) => { + console.error(`error, code: ${error.code}, message: ${error.message}`); + }); +} catch(error) { + console.error(`catch error, code: ${error.code}, message: ${error.message}`); +} +``` + +## getRunningFormInfosByFilter + +getRunningFormInfosByFilter(formProviderFilter: formInfo.FormProviderFilter, callback: AsyncCallback<Array<formInfo.RunningFormInfo>>): void + +根据提供方信息查询卡片已有的使用方列表信息。使用callback异步回调。 + +**需要权限**：ohos.permission.OBSERVE_FORM_RUNNING + +**系统能力**：SystemCapability.Ability.Form + +**参数：** + +| 参数名 | 类型 | 必填 | 说明 | +| ----------- | --------------- | ---- | -------------------------------- | +| formProviderFilter | [formInfo.FormProviderFilter](js-apis-app-form-formInfo.md#formProviderFilter) | 是 | 卡片提供方应用信息。 | +| callback | AsyncCallback<Array<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)>> | 是 | 回调函数。返回查询到的使用方列表信息，error为undefined，data为查询到的使用方列表信息；否则为错误对象。 | + +**错误码：** + +以下错误码的详细介绍请参见[卡片错误码](../errorcodes/errorcode-form.md)。 + +| 错误码ID | 错误信息 | +| -------- | -------- | +| 201 | Permissions denied. | +| 202 | The application is not a system application. | +| 401 | If the input parameter is not valid parameter. | +| 16500050 | An IPC connection error happened. | +| 16500100 | Failed to obtain the configuration information. | +| 16501000 | An internal functional error occurred. | + + +```ts +import formObserver from '@ohos.app.form.formObserver'; + +let formInstanceFilter = { + bundleName: "com.example.formprovide", + abilityName: "EntryFormAbility", + formName: "widget", + moduleName: "entry" +} +try { + formObserver.getRunningFormInfosByFilter(formInstanceFilter,(error, data) => { + if (error) { + console.error(`error, code: ${error.code}, message: ${error.message}`); + } else { + console.log('formObserver getRunningFormInfosByFilter, data: ${JSON.stringify(data)}'); + } + }); +} catch(error) { + console.error(`catch error, code: ${error.code}, message: ${error.message}`); +} +``` + +## getRunningFormInfoById + +getRunningFormInfoById(formId: string): Promise<formInfo.RunningFormInfo> + + +根据formId查询卡片已有的使用方列表信息。使用Promise异步回调。 + +**需要权限**：ohos.permission.OBSERVE_FORM_RUNNING + +**系统能力**：SystemCapability.Ability.Form + +**参数：** + +| 参数名 | 类型 | 必填 | 说明 | +| ----------- | --------------- | ---- | -------------------------------- | +| formId | string | 是 | 卡片标识。 | + +**返回值：** + +| 类型 | 说明 | +| ------------------- | ------------------------- | +| Promise<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)> | Promise对象，返回查询到的使用方列表信息。 | + +**错误码：** + +以下错误码的详细介绍请参见[卡片错误码](../errorcodes/errorcode-form.md)。 + +| 错误码ID | 错误信息 | +| -------- | -------- | +| 201 | Permissions denied. | +| 202 | The application is not a system application. | +| 401 | If the input parameter is not valid parameter. | +| 16500050 | An IPC connection error happened. | +| 16500100 | Failed to obtain the configuration information. | +| 16501000 | An internal functional error occurred. | + + +```ts +import formObserver from '@ohos.app.form.formObserver'; +let formId = '12400633174999288'; +try { + formObserver.getRunningFormInfoById(formId).then(data1 => { + console.info('formObserver getRunningFormInfoById return err :'); + }).catch((error) => { + console.error(`error, code: ${error.code}, message: ${error.message}`); + }); +} catch(error) { + console.error(`catch error, code: ${error.code}, message: ${error.message}`); +} +``` + +## getRunningFormInfoById + +getRunningFormInfoById(formId: string, callback: AsyncCallback<formInfo.RunningFormInfo>): void + +根据提供方信息查询卡片已有的使用方列表信息。使用callback异步回调。 + +**需要权限**：ohos.permission.OBSERVE_FORM_RUNNING + +**系统能力**：SystemCapability.Ability.Form + +**参数：** + +| 参数名 | 类型 | 必填 | 说明 | +| ----------- | --------------- | ---- | -------------------------------- | +| formId | string | 是 | 卡片标识。 | +| callback | AsyncCallback<[formInfo.RunningFormInfo](js-apis-app-form-formInfo.md)> | 是 | 回调函数。返回查询到的使用方列表信息，error为undefined，data为查询到的使用方列表信息；否则为错误对象。 | + +**错误码：** + +以下错误码的详细介绍请参见[卡片错误码](../errorcodes/errorcode-form.md)。 + +| 错误码ID | 错误信息 | +| -------- | -------- | +| 201 | Permissions denied. | +| 202 | The application is not a system application. | +| 401 | If the input parameter is not valid parameter. | +| 16500050 | An IPC connection error happened. | +| 16500100 | Failed to obtain the configuration information. | +| 16501000 | An internal functional error occurred. | + +```ts +import formObserver from '@ohos.app.form.formObserver'; + +let formId = '12400633174999288'; +try { + formObserver.getRunningFormInfoById(formId,(error, data) => { + if (error) { + console.error(`error, code: ${error.code}, message: ${error.message}`); + } else { + console.log('formObserver getRunningFormInfoById, data: ${JSON.stringify(data)}'); + } + }); +} catch(error) { + console.error(`catch error, code: ${error.code}, message: ${error.message}`); +} +``` diff --git a/zh-cn/application-dev/reference/apis/js-apis-base.md b/zh-cn/application-dev/reference/apis/js-apis-base.md index 5524b1852b829c838b29798a47b0c15974bd7044..7aed8b1614ce6d14af6dc976212b3598097428a8 100644 --- a/zh-cn/application-dev/reference/apis/js-apis-base.md +++ b/zh-cn/application-dev/reference/apis/js-apis-base.md @@ -40,7 +40,7 @@ ErrorCallback\ { 通用回调函数，携带错误参数。 -回调返回的信息为[BusinessError](https://gitee.com/openharmony/docs/pulls/20172/files#businesserror)类型的信息。 +回调返回的信息为[BusinessError](#businesserror)类型的信息。 **系统能力**：SystemCapability.Base @@ -60,7 +60,7 @@ AsyncCallback\ { 通用回调函数，携带错误参数和异步返回值。 -错误参数为[BusinessError](https://gitee.com/openharmony/docs/pulls/20172/files#businesserror)类型的信息。 +错误参数为[BusinessError](#businesserror)类型的信息。 异步返回值的类型由开发者自定义，回调将返回对应类型的信息。 @@ -68,7 +68,7 @@ AsyncCallback\ { | 名称 | 类型 | 必填 | 说明 | | ---- | ------------------------------------------------------------ | ---- | ---------------------------- | -| err | [BusinessError](https://gitee.com/openharmony/docs/pulls/20172/files#businesserror) | 是 | 接口调用失败的公共错误信息。 | +| err | [BusinessError](#businesserror) | 是 | 接口调用失败的公共错误信息。 | | data | T | 是 | 接口调用时的公共回调信息。 | ## BusinessError diff --git a/zh-cn/application-dev/reference/apis/js-apis-fileAccess.md b/zh-cn/application-dev/reference/apis/js-apis-fileAccess.md index cf36172ac70f9180f241988cbfd2ef3468d9f056..dedb6a0dcb8d5c590ca43c0e805be64156e851c1 100644 --- a/zh-cn/application-dev/reference/apis/js-apis-fileAccess.md +++ b/zh-cn/application-dev/reference/apis/js-apis-fileAccess.md @@ -1392,90 +1392,6 @@ getFileInfoFromRelativePath(relativePath: string, callback: AsyncCallback\10+ - -getThumbnail(uri: string, size: image.Size) : Promise<image.PixelMap> - -通过指定uri和尺寸获取媒体文件的Pixelmap对象，使用Promise异步回调。 - -**系统能力**：SystemCapability.FileManagement.UserFileService - -**需要权限**：ohos.permission.FILE_ACCESS_MANAGER - -**参数：** - -| 参数名 | 类型 | 必填 | 说明 | -| ------ | ----------------------------------- | ---- | ----------- | -| uri | string | 是 | 媒体文件uri | -| size | [image.Size](js-apis-image.md#size) | 是 | 缩略图尺寸 | - -**返回值：** - -| 类型 | 说明 | -| :---------------------------- | :----------------- | -| Promise<[image.PixelMap](js-apis-image.md#pixelmap7)> | 返回的Pixelmap对象 | - -**示例：** - -```js -// 以媒体库uri为例 -// 示例代码targetUri表示Download目录下某个媒体文件(图片、音频、视频)，该uri是对应的fileInfo中uri -// 开发者应根据自己实际获取的uri进行开发 -let targetUri = "file://media/image/100"; -let size = { width: 128, height: 128 }; -try { - // fileAccessHelper 参考 fileAccess.createFileAccessHelper 示例代码获取 - let pixelMap = await fileAccessHelper.getThumbnail(targetUri, size); - let imageInfo = await pixelMap.getImageInfo(); - console.log("getThumbnail sucess, pixelMap.width: " + imageInfo.size.width); - console.log("getThumbnail sucess, pixelMap.height: " + imageInfo.size.height); -} catch (error) { - console.error("getThumbnail failed, errCode:" + error.code + ", errMessage:" + error.message); -}; -``` - -### getThumbnail10+ - - getThumbnail(uri: string, size: image.Size, callback: AsyncCallback<image.PixelMap>) : void - -通过指定uri和尺寸获取媒体文件的Pixelmap对象，使用callback异步回调。 - -**系统能力**：SystemCapability.FileManagement.UserFileService - -**需要权限**：ohos.permission.FILE_ACCESS_MANAGER - -**参数：** - -| 参数名 | 类型 | 必填 | 说明 | -| -------- | ----------------------------------- | ---- | ------------------ | -| uri | string | 是 | 媒体文件uri | -| size | [image.Size](js-apis-image.md#size) | 是 | 缩略图尺寸 | -| callback | AsyncCallback<[image.PixelMap](js-apis-image.md#pixelmap7)> | 是 | 返回的Pixelmap对象 | - -**示例：** - -```js -// 以媒体库uri为例 -// 示例代码targetUri表示Download目录下某个媒体文件(图片、音频、视频)，该uri是对应的fileInfo中uri -// 开发者应根据自己实际获取的uri进行开发 -let targetUri = "file://media/image/100"; -let size = { width: 128, height: 128 }; -try { - // fileAccessHelper 参考 fileAccess.createFileAccessHelper 示例代码获取 - fileAccessHelper.getThumbnail(targetUri, size, async(err, pixelMap) => { - if (err) { - console.error("Failed to getThumbnail in async, errCode:" + err.code + ", errMessage:" + err.message); - return; - } - let imageInfo = await pixelMap.getImageInfo(); - console.log("getThumbnail sucess, pixelMap.width: " + imageInfo.size.width); - console.log("getThumbnail sucess, pixelMap.height: " + imageInfo.size.height); - }); -} catch (error) { - console.error("getThumbnail failed, errCode:" + error.code + ", errMessage:" + error.message); -}; -``` - ### query10+ query(uri:string, metaJson: string) : Promise<string> @@ -1771,6 +1687,3 @@ try { | DATE_MODIFIED | 'date_modified' | 文件的修改日期，例如1665310670 | | RELATIVE_PATH | 'relative_path' | 相对路径，例如Pictures/Screenshots/ | | FILE_SIZE | 'size' | 文件（夹）大小（单位：字节） | -| WIDTH | 'width' | 图像文件的宽度（单位：像素） | -| HEIGHT | 'height' | 图像文件的高度（单位：像素） | -| DURATION | 'duration' | 音频和视频文件的时长（单位：毫秒） | diff --git a/zh-cn/application-dev/reference/apis/js-apis-geoLocationManager.md b/zh-cn/application-dev/reference/apis/js-apis-geoLocationManager.md index b2bd9467c2d1dd1754ad5b68160e055f3e00dd74..4c7aee35cdec1bfe58b1ac17ab55b07379f5c36d 100644 --- a/zh-cn/application-dev/reference/apis/js-apis-geoLocationManager.md +++ b/zh-cn/application-dev/reference/apis/js-apis-geoLocationManager.md @@ -110,11 +110,11 @@ import geoLocationManager from '@ohos.geoLocationManager'; | 名称 | 类型 | 可读|可写 | 说明 | | -------- | -------- | -------- | -------- | -------- | -| priority | [LocationRequestPriority](#locationrequestpriority) | 是 | 是 | 表示优先级信息。取值范围见[LocationRequestPriority](#locationrequestpriority)的定义。 | -| scenario | [LocationRequestScenario](#locationrequestscenario) | 是 | 是 | 表示场景信息。取值范围见[LocationRequestScenario](#locationrequestscenario)的定义。 | -| timeInterval | number | 是 | 是 | 表示上报位置信息的时间间隔，单位是秒。取值范围为大于0。 | -| distanceInterval | number | 是 | 是 | 表示上报位置信息的距离间隔。单位是米，取值范围为大于0。 | -| maxAccuracy | number | 是 | 是 | 表示精度信息。仅在精确位置功能场景下有效，模糊位置功能生效场景下该字段无意义。取值范围为大于0。 | +| priority | [LocationRequestPriority](#locationrequestpriority) | 是 | 是 | 表示优先级信息。当scenario取值为UNSET时，priority参数生效，否则priority参数不生效；当scenario和priority均取值为UNSET时，无法发起定位请求。取值范围见[LocationRequestPriority](#locationrequestpriority)的定义。 | +| scenario | [LocationRequestScenario](#locationrequestscenario) | 是 | 是 | 表示场景信息。当scenario取值为UNSET时，priority参数生效，否则priority参数不生效；当scenario和priority均取值为UNSET时，无法发起定位请求。取值范围见[LocationRequestScenario](#locationrequestscenario)的定义。 | +| timeInterval | number | 是 | 是 | 表示上报位置信息的时间间隔，单位是秒。默认值为1，取值范围为大于等于0。 | +| distanceInterval | number | 是 | 是 | 表示上报位置信息的距离间隔。单位是米，默认值为0，取值范围为大于等于0。 | +| maxAccuracy | number | 是 | 是 | 表示精度信息，单位是米。仅在精确位置功能场景下有效，模糊位置功能生效场景下该字段无意义。默认值为0，取值范围为大于等于0。 | ## CurrentLocationRequest @@ -426,7 +426,7 @@ on(type: 'locationChange', request: LocationRequest, callback: Callback<Locat ```ts import geoLocationManager from '@ohos.geoLocationManager'; - let requestInfo = {'priority': 0x203, 'scenario': 0x300, 'timeInterval': 0, 'distanceInterval': 0, 'maxAccuracy': 0}; + let requestInfo = {'priority': geoLocationManager.LocationRequestPriority.FIRST_FIX, 'scenario': geoLocationManager.LocationRequestScenario.UNSET, 'timeInterval': 1, 'distanceInterval': 0, 'maxAccuracy': 0}; let locationChange = (location) => { console.log('locationChanger: data: ' + JSON.stringify(location)); }; @@ -470,7 +470,7 @@ off(type: 'locationChange', callback?: Callback<Location>): void ```ts import geoLocationManager from '@ohos.geoLocationManager'; - let requestInfo = {'priority': 0x203, 'scenario': 0x300, 'timeInterval': 0, 'distanceInterval': 0, 'maxAccuracy': 0}; + let requestInfo = {'priority': geoLocationManager.LocationRequestPriority.FIRST_FIX, 'scenario': geoLocationManager.LocationRequestScenario.UNSET, 'timeInterval': 1, 'distanceInterval': 0, 'maxAccuracy': 0}; let locationChange = (location) => { console.log('locationChanger: data: ' + JSON.stringify(location)); }; @@ -1134,7 +1134,7 @@ getCurrentLocation(request: CurrentLocationRequest, callback: AsyncCallback<L ```ts import geoLocationManager from '@ohos.geoLocationManager'; - let requestInfo = {'priority': 0x203, 'scenario': 0x300,'maxAccuracy': 0}; + let requestInfo = {'priority': geoLocationManager.LocationRequestPriority.FIRST_FIX, 'scenario': geoLocationManager.LocationRequestScenario.UNSET,'maxAccuracy': 0}; let locationChange = (err, location) => { if (err) { console.log('locationChanger: err=' + JSON.stringify(err)); @@ -1233,7 +1233,7 @@ getCurrentLocation(request?: CurrentLocationRequest): Promise<Location> ```ts import geoLocationManager from '@ohos.geoLocationManager'; - let requestInfo = {'priority': 0x203, 'scenario': 0x300,'maxAccuracy': 0}; + let requestInfo = {'priority': geoLocationManager.LocationRequestPriority.FIRST_FIX, 'scenario': geoLocationManager.LocationRequestScenario.UNSET,'maxAccuracy': 0}; try { geoLocationManager.getCurrentLocation(requestInfo).then((result) => { console.log('current location: ' + JSON.stringify(result)); diff --git a/zh-cn/application-dev/reference/apis/js-apis-hidebug.md b/zh-cn/application-dev/reference/apis/js-apis-hidebug.md index 0a32b4464ab06f177c195a68b21b10fd3af841d5..beda73a15b7392155a2c505a5680bfc77ffa21b2 100644 --- a/zh-cn/application-dev/reference/apis/js-apis-hidebug.md +++ b/zh-cn/application-dev/reference/apis/js-apis-hidebug.md @@ -175,23 +175,30 @@ getServiceDump(serviceid : number, fd : number, args : Array\) : void ```js import fs from '@ohos.file.fs' import hidebug from '@ohos.hidebug' -import featureAbility from '@ohos.ability.featureAbility' - -let context = featureAbility.getContext(); -context.getFilesDir().then((data) => { - var path = data + "/serviceInfo.txt"; - console.info("output path: " + path); - let file = fs.openSync(path, fs.OpenMode.READ_WRITE | fs.OpenMode.CREATE); - var serviceId = 10; - var args = new Array("allInfo"); - try { - hidebug.getServiceDump(serviceId, file.fd, args); - } catch (error) { - console.info(error.code); - console.info(error.message); - } - fs.closeSync(file); -}) +import common from '@ohos.app.ability.common' + +let applicationContext: common.Context; +try { + applicationContext = this.context.getApplicationContext(); +} catch (error) { + console.info(error.code); + console.info(error.message); +} + +var filesDir = applicationContext.filesDir; +var path = filesDir + "/serviceInfo.txt"; +console.info("output path: " + path); +let file = fs.openSync(path, fs.OpenMode.READ_WRITE | fs.OpenMode.CREATE); +var serviceId = 10; +var args = new Array("allInfo"); + +try { + hidebug.getServiceDump(serviceId, file.fd, args); +} catch (error) { + console.info(error.code); + console.info(error.message); +} +fs.closeSync(file); ``` ## hidebug.startJsCpuProfiling9+ diff --git a/zh-cn/application-dev/reference/apis/js-apis-inner-application-MediaControlExtensionContext.md b/zh-cn/application-dev/reference/apis/js-apis-inner-application-MediaControlExtensionContext.md new file mode 100644 index 0000000000000000000000000000000000000000..1e97ece124ae2bd167ac935ae713403bed97660a --- /dev/null +++ b/zh-cn/application-dev/reference/apis/js-apis-inner-application-MediaControlExtensionContext.md @@ -0,0 +1,11 @@ +# MediaControlExtensionContext (播控扩展能力上下文) + +MediaControlExtensionContext是[MediaControlExtensionAbility](js-apis-app-ability-MediaControlExtensionAbility.md)的上下文环境，继承自[UIExtensionContext](js-apis-inner-application-uiExtensionContext.md)，提供MediaControlExtensionAbility的相关配置信息以及操作UIAbility的方法，如启动UIAbility等。 + +**系统能力：** SystemCapability.Multimedia.AVSession.Core + +> **说明：** +> +> - 本模块首批接口从API version 10开始支持。后续版本的新增接口，采用上角标单独标记接口的起始版本。 +> - 本模块接口仅可在Stage模型下使用。 +> - 本模块接口为系统接口。 diff --git a/zh-cn/application-dev/reference/apis/js-apis-inner-notification-notificationRequest.md b/zh-cn/application-dev/reference/apis/js-apis-inner-notification-notificationRequest.md index f7fdc512d97872ebf1218007633937637dc7b784..51816f591c664cdb73d6a3c9bdf2fd88c543a857 100644 --- a/zh-cn/application-dev/reference/apis/js-apis-inner-notification-notificationRequest.md +++ b/zh-cn/application-dev/reference/apis/js-apis-inner-notification-notificationRequest.md @@ -10,45 +10,45 @@ **系统能力**：以下各项对应的系统能力均为SystemCapability.Notification.Notification -| 名称 | 类型 | 必填 | 说明 | -| --------------------- | --------------------------------------------- | --- | -------------------------- | -| content | [NotificationContent](js-apis-inner-notification-notificationContent.md#notificationcontent) | 是 | 通知内容。 | -| id | number | 否 | 通知ID。 | -| slotType | [SlotType](js-apis-notificationManager.md#slottype) | 否 | 通道类型。 | -| isOngoing | boolean | 否 | 是否进行时通知。 | -| isUnremovable | boolean | 否 | 是否可移除。 | -| deliveryTime | number | 否 | 通知发送时间。 | -| tapDismissed | boolean | 否 | 通知是否自动清除。 | -| autoDeletedTime | number | 否 | 自动清除的时间。 | -| wantAgent | [WantAgent](js-apis-app-ability-wantAgent.md) | 否 | WantAgent封装了应用的行为意图，点击通知时触发该行为。 | -| extraInfo | {[key: string]: any} | 否 | 扩展参数。 | -| color | number | 否 | 通知背景颜色。预留能力，暂未支持。 | -| colorEnabled | boolean | 否 | 通知背景颜色是否使能。预留能力，暂未支持。 | -| isAlertOnce | boolean | 否 | 设置是否仅有一次此通知提醒。 | -| isStopwatch | boolean | 否 | 是否显示已用时间。 | -| isCountDown | boolean | 否 | 是否显示倒计时时间。 | -| isFloatingIcon | boolean | 否 | 是否显示状态栏图标。 | -| label | string | 否 | 通知标签。 | -| badgeIconStyle | number | 否 | 通知角标类型。预留能力，暂未支持。 | -| showDeliveryTime | boolean | 否 | 是否显示分发时间。 | -| actionButtons | Array\<[NotificationActionButton](js-apis-inner-notification-notificationActionButton.md)\> | 否 | 通知按钮，最多三个按钮。 | -| smallIcon | [image.PixelMap](js-apis-image.md#pixelmap7) | 否 | 通知小图标。可选字段，大小不超过30KB。 | -| largeIcon | [image.PixelMap](js-apis-image.md#pixelmap7) | 否 | 通知大图标。可选字段，大小不超过30KB。 | -| creatorBundleName | string | 否 | 创建通知的包名。 | -| creatorUid | number | 否 | 创建通知的UID。 | -| creatorPid | number | 否 | 创建通知的PID。 | -| creatorUserId8+ | number | 否 | 创建通知的UserId。 | -| hashCode | string | 否 | 通知唯一标识。 | -| classification | string | 否 | 通知分类。
**系统API**: 此接口为系统接口，三方应用不支持调用。 | -| groupName8+ | string | 否 | 组通知名称。 | -| template8+ | [NotificationTemplate](./js-apis-inner-notification-notificationTemplate.md) | 否 | 通知模板。 | -| isRemoveAllowed10+ | boolean | 否 | 通知是否能被移除。
**系统API**: 此接口为系统接口，三方应用不支持调用。 | -| source8+ | number | 否 | 通知源。
**系统API**: 此接口为系统接口，三方应用不支持调用。 | -| distributedOption8+ | [DistributedOptions](#distributedoptions) | 否 | 分布式通知的选项。 | -| deviceId8+ | string | 否 | 通知源的deviceId。
**系统API**: 此接口为系统接口，三方应用不支持调用。 | -| notificationFlags8+ | [NotificationFlags](js-apis-inner-notification-notificationFlags.md#notificationflags) | 否 | 获取NotificationFlags。 | -| removalWantAgent9+ | [WantAgent](js-apis-app-ability-wantAgent.md) | 否 | 当移除通知时，通知将被重定向到的WantAgent实例。 | -| badgeNumber9+ | number | 否 | 应用程序图标上显示的通知数。 | +| 名称 | 类型 | 必填 | 说明 | +| --------------------- | --------------------------------------------- | --- |-----------------------------------------------------------------------| +| content | [NotificationContent](js-apis-inner-notification-notificationContent.md#notificationcontent) | 是 | 通知内容。 | +| id | number | 否 | 通知ID。 | +| slotType | [SlotType](js-apis-notificationManager.md#slottype) | 否 | 通道类型。 | +| isOngoing | boolean | 否 | 是否进行时通知。 | +| isUnremovable | boolean | 否 | 是否可移除（应用于长时间通知任务上，比如地图、音乐播放；点击通知下方删除按钮无法删除，左滑点击单个删除按钮可删除）。 | +| deliveryTime | number | 否 | 通知发送时间。 | +| tapDismissed | boolean | 否 | 通知是否自动清除。 | +| autoDeletedTime | number | 否 | 自动清除的时间。 | +| wantAgent | [WantAgent](js-apis-app-ability-wantAgent.md) | 否 | WantAgent封装了应用的行为意图，点击通知时触发该行为。 | +| extraInfo | {[key: string]: any} | 否 | 扩展参数。 | +| color | number | 否 | 通知背景颜色。预留能力，暂未支持。 | +| colorEnabled | boolean | 否 | 通知背景颜色是否使能。预留能力，暂未支持。 | +| isAlertOnce | boolean | 否 | 设置是否仅有一次此通知提醒。 | +| isStopwatch | boolean | 否 | 是否显示已用时间。 | +| isCountDown | boolean | 否 | 是否显示倒计时时间。 | +| isFloatingIcon | boolean | 否 | 是否显示状态栏图标。 | +| label | string | 否 | 通知标签。 | +| badgeIconStyle | number | 否 | 通知角标类型。预留能力，暂未支持。 | +| showDeliveryTime | boolean | 否 | 是否显示分发时间。 | +| actionButtons | Array\<[NotificationActionButton](js-apis-inner-notification-notificationActionButton.md)\> | 否 | 通知按钮，最多三个按钮。 | +| smallIcon | [image.PixelMap](js-apis-image.md#pixelmap7) | 否 | 通知小图标。可选字段，大小不超过30KB。 | +| largeIcon | [image.PixelMap](js-apis-image.md#pixelmap7) | 否 | 通知大图标。可选字段，大小不超过30KB。 | +| creatorBundleName | string | 否 | 创建通知的包名。 | +| creatorUid | number | 否 | 创建通知的UID。 | +| creatorPid | number | 否 | 创建通知的PID。 | +| creatorUserId8+ | number | 否 | 创建通知的UserId。 | +| hashCode | string | 否 | 通知唯一标识。 | +| classification | string | 否 | 通知分类。
**系统API**: 此接口为系统接口，三方应用不支持调用。 | +| groupName8+ | string | 否 | 组通知名称。 | +| template8+ | [NotificationTemplate](./js-apis-inner-notification-notificationTemplate.md) | 否 | 通知模板。 | +| isRemoveAllowed10+ | boolean | 否 | 通知是否能被移除（点击通知下方删除按钮无法删除，左滑不出现删除按钮）。
**系统API**: 此接口为系统接口，三方应用不支持调用。 | +| source8+ | number | 否 | 通知源。
**系统API**: 此接口为系统接口，三方应用不支持调用。 | +| distributedOption8+ | [DistributedOptions](#distributedoptions) | 否 | 分布式通知的选项。 | +| deviceId8+ | string | 否 | 通知源的deviceId。
**系统API**: 此接口为系统接口，三方应用不支持调用。 | +| notificationFlags8+ | [NotificationFlags](js-apis-inner-notification-notificationFlags.md#notificationflags) | 否 | 获取NotificationFlags。 | +| removalWantAgent9+ | [WantAgent](js-apis-app-ability-wantAgent.md) | 否 | 当移除通知时，通知将被重定向到的WantAgent实例。 | +| badgeNumber9+ | number | 否 | 应用程序图标上显示的通知数。 | ## DistributedOptions diff --git a/zh-cn/application-dev/reference/apis/js-apis-notification.md b/zh-cn/application-dev/reference/apis/js-apis-notification.md index 12d12966b90dbc4b7901324066251e1ecfd2152e..9a2ff46e0e53ce413961432256d26cb32e67dd91 100644 --- a/zh-cn/application-dev/reference/apis/js-apis-notification.md +++ b/zh-cn/application-dev/reference/apis/js-apis-notification.md @@ -4,7 +4,7 @@ > **说明：** > -> 本模块首批接口从API version 7开始支持。后续版本的新增接口，采用上角标单独标记接口的起始版本。 +> 本模块首批接口从API version 7开始支持。后续版本的新增接口，采用上角标单独标记接口的起始版本。（从API version 9开始停止维护） > > 通知订阅和取消订阅仅对系统应用开放。 diff --git a/zh-cn/application-dev/reference/apis/js-apis-router.md b/zh-cn/application-dev/reference/apis/js-apis-router.md index d88f45cea824d220350e30674b41f994f6d44c9e..07773f706bd647c579992fdf9cbdb11b38bd0c5f 100644 --- a/zh-cn/application-dev/reference/apis/js-apis-router.md +++ b/zh-cn/application-dev/reference/apis/js-apis-router.md @@ -409,7 +409,7 @@ pushNamedRoute(options: NamedRouterOptions): Promise<void> | 100003 | if the pages are pushed too much. | | 100004 | if the named route is not exist. | -**示例：** +**示例：** ```ts try { @@ -427,6 +427,8 @@ try { } ``` +详细示例请参考：[UI开发-页面路由](../../ui/arkts-routing.md#命名路由) + ## router.pushNamedRoute10+ pushNamedRoute(options: NamedRouterOptions, callback: AsyncCallback<void>): void diff --git a/zh-cn/application-dev/reference/apis/js-apis-sms.md b/zh-cn/application-dev/reference/apis/js-apis-sms.md index e3377be097917dd1267707c6f0b130284556ecb6..a5e3f36cd6a4a390db28a3a474d056ae35cbceaa 100644 --- a/zh-cn/application-dev/reference/apis/js-apis-sms.md +++ b/zh-cn/application-dev/reference/apis/js-apis-sms.md @@ -135,10 +135,10 @@ sendMessage\(options: SendMessageOptions\): void **示例：** ```js -let sendCallback = function (err, data) { +let sendCallback = function (err, data) { console.log(`sendCallback: err->${JSON.stringify(err)}, data->${JSON.stringify(data)}`); } -let deliveryCallback = function (err, data) { +let deliveryCallback = function (err, data) { console.log(`deliveryCallback: err->${JSON.stringify(err)}, data->${JSON.stringify(data)}`); } let slotId = 0; diff --git a/zh-cn/application-dev/reference/apis/js-apis-socket.md b/zh-cn/application-dev/reference/apis/js-apis-socket.md index 693a90b9da75cbf820149b7b25325bc8a833b458..bca9cb71fb40ead44c0284d288d0df1f1e9ffb28 100644 --- a/zh-cn/application-dev/reference/apis/js-apis-socket.md +++ b/zh-cn/application-dev/reference/apis/js-apis-socket.md @@ -747,6 +747,9 @@ bind(address: NetAddress, callback: AsyncCallback\): void 绑定IP地址和端口，端口可以指定或由系统随机分配。使用callback方法作为异步方法。 +> **说明：** +> bind方法失败会由系统随机分配端口号。 + **需要权限**：ohos.permission.INTERNET **系统能力**：SystemCapability.Communication.NetStack @@ -784,6 +787,9 @@ bind(address: NetAddress): Promise\ 绑定IP地址和端口，端口可以指定或由系统随机分配。使用Promise方法作为异步方法。 +> **说明：** +> bind方法失败会由系统随机分配端口号。 + **需要权限**：ohos.permission.INTERNET **系统能力**：SystemCapability.Communication.NetStack @@ -1686,7 +1692,7 @@ listen(address: NetAddress, callback: AsyncCallback\): void 绑定IP地址和端口，端口可以指定或由系统随机分配。监听并接受与此套接字建立的TCPSocket连接。该接口使用多线程并发处理客户端的数据。使用callback方法作为异步方法。 > **说明：** -> 服务端使用该方法完成bind，listen，accept操作。 +> 服务端使用该方法完成bind，listen，accept操作，bind方法失败会由系统随机分配端口号。 **需要权限**：ohos.permission.INTERNET @@ -1731,7 +1737,7 @@ listen(address: NetAddress): Promise\ 绑定IP地址和端口，端口可以指定或由系统随机分配。监听并接受与此套接字建立的TCPSocket连接。该接口使用多线程并发处理客户端的数据。使用Promise方法作为异步方法。 > **说明：** -> 服务端使用该方法完成bind，listen，accept操作。 +> 服务端使用该方法完成bind，listen，accept操作，bind方法失败会由系统随机分配端口号。 **需要权限**：ohos.permission.INTERNET @@ -1991,6 +1997,9 @@ on(type: 'connect', callback: Callback\): void 订阅TCPSocketServer的连接事件。使用callback方式作为异步方法。 +> **说明：** +> listen方法调用成功后，才可调用此方法。 + **系统能力**：SystemCapability.Communication.NetStack **参数：** @@ -2058,6 +2067,9 @@ on(type: 'error', callback: ErrorCallback): void 订阅TCPSocketServer连接的error事件。使用callback方式作为异步方法。 +> **说明：** +> listen方法调用成功后，才可调用此方法。 + **系统能力**：SystemCapability.Communication.NetStack **参数：** @@ -4534,7 +4546,7 @@ tlsServer.getProtocol().then(data => { }); ``` -### on('connect') +### on('connect')10+ on(type: 'connect', callback: Callback\): void @@ -4589,7 +4601,7 @@ tlsServer.on('connect', function(data) { }); ``` -### off('connect') +### off('connect')10+ off(type: 'connect', callback?: Callback\): void @@ -4650,7 +4662,7 @@ tlsServer.off('connect', callback); tlsServer.off('connect'); ``` -### on('error') +### on('error')10+ on(type: 'error', callback: ErrorCallback): void @@ -4705,7 +4717,7 @@ tlsServer.on('error', err => { }); ``` -### off('error') +### off('error')10+ off(type: 'error', callback?: ErrorCallback): void diff --git a/zh-cn/application-dev/reference/arkui-ts/figures/arkts-progressSmoothEffect.gif b/zh-cn/application-dev/reference/arkui-ts/figures/arkts-progressSmoothEffect.gif new file mode 100644 index 0000000000000000000000000000000000000000..65daefb814d4f64f4e85f0d3ef8be14fa04998dc Binary files /dev/null and b/zh-cn/application-dev/reference/arkui-ts/figures/arkts-progressSmoothEffect.gif differ diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-datepicker.md b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-datepicker.md index 9eb6ea3b66e032f8a441b65e509759dda062a37f..1ef16e32d86c20e5846aaee774ba87680d1b15c3 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-datepicker.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-datepicker.md @@ -68,9 +68,10 @@ DatePicker(options?: {start?: Date, end?: Date, selected?: Date}) 除支持[通用事件](ts-universal-events-click.md)外，还支持以下事件： -| 名称 | 功能描述 | -| ---------------------------------------- | ----------- | -| onChange(callback: (value: DatePickerResult) => void) | 选择日期时触发该事件。 | +| 名称 | 功能描述 | +| ------------------------------------------------------------ | ------------------------------------------------------------ | +| onChange(callback: (value: DatePickerResult) => void)(deprecated) | 选择日期时触发该事件。
**说明：**
从API version 8 开始支持，从 API version 10 开始废弃，建议使用onDateChange(callback: (value: Date) => void)。 | +| onDateChange(callback: (value: Date) => void)10+ | 选择日期时触发该事件。 | ## DatePickerResult对象说明 @@ -108,9 +109,9 @@ struct DatePickerExample { .textStyle({color: '#ff182431', font: {size: '18fp', weight: FontWeight.Normal}}) .selectedTextStyle({color: '#ff0000FF', font: {size: '26fp', weight: FontWeight.Regular}}) .lunar(this.isLunar) - .onChange((value: DatePickerResult) => { - this.selectedDate.setFullYear(value.year, value.month, value.day) - console.info('select current date is: ' + JSON.stringify(value)) + .onDateChange((value: Date) => { + this.selectedDate = value + console.info('select current date is: ' + value.toString()) }) }.width('100%') diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-image.md b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-image.md index 4e4158658ff7940b443f618a3bb944c8f048a791..9b433727bf4bc79ac6639fccc37423c2f28919d8 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-image.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-image.md @@ -52,7 +52,7 @@ Image组件加载图片失败或图片尺寸为0时，图片组件大小自动 | syncLoad8+ | boolean | 设置是否同步加载图片，默认是异步加载。同步加载时阻塞UI线程，不会显示占位图。
默认值：false
从API version 9开始，该接口支持在ArkTS卡片中使用。
**说明：**
建议加载尺寸较小的本地图片时将syncLoad设为true，因为耗时较短，在主线程上执行即可。 | | copyOption9+ | [CopyOptions](ts-appendix-enums.md#copyoptions9) | 设置图片是否可复制。
当copyOption设置为非CopyOptions.None时，支持使用长按、鼠标右击、快捷组合键'CTRL+C'等方式进行复制。
默认值：CopyOptions.None
从API version 9开始，该接口支持在ArkTS卡片中使用。
**说明：**
svg图片不支持复制。 | | colorFilter9+ | [ColorFilter](ts-types.md#colorfilter9) | 给图像设置颜色滤镜效果，入参为一个的4x5的RGBA转换矩阵。
矩阵第一行表示R（红色）的向量值，第二行表示G（绿色）的向量值，第三行表示B（蓝色）的向量值，第四行表示A（透明度）的向量值，4行分别代表不同的RGBA的向量值。
RGBA值分别是0和1之间的浮点数字，当矩阵对角线值为1时，保持图片原有色彩。
**计算规则：**
如果输入的滤镜矩阵为：
![image-matrix-1](figures/image-matrix-1.jpg)
像素点为[R, G, B, A]
则过滤后的颜色为 [R’, G’, B’, A’]
![image-matrix-2](figures/image-matrix-2.jpg)
从API version 9开始，该接口支持在ArkTS卡片中使用。 | -| draggable(deprecated) | boolean | 设置组件默认拖拽效果，设置为true时，组件可拖拽。
不能和[onDragStart](ts-universal-events-drag-drop.md)事件同时使用。
默认值：false
**说明：**
从 API version 9 开始支持，从 API version 10 开始废弃，建议使用通用属性[draggable](ts-universal-events-drag-drop.md)替代。 | +| draggable(deprecated) | boolean | 设置组件默认拖拽效果，设置为true时，组件可拖拽。
不能和[onDragStart](ts-universal-events-drag-drop.md)事件同时使用。
默认值：false
**说明：**
从 API version 9 开始支持，从 API version 10 开始废弃，建议使用通用属性[draggable](ts-universal-attributes-drag-drop.md)替代。 | > **说明：** > diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-progress.md b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-progress.md index d731e8ca1ad125ccefcf9947b748d1062074e811..6c920619bc70bf2ef064f678c0bf3ef6e98e1c42 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-progress.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-progress.md @@ -70,6 +70,7 @@ Progress(options: {value: number, total?: number, type?: ProgressType}) | strokeWidth | [Length](ts-types.md#length) | 否 | 设置进度条宽度（不支持百分比设置）。
默认值：4.0vp | | scaleCount | number | 否 | 设置环形进度条总刻度数。
默认值：120 | | scaleWidth | [Length](ts-types.md#length) | 否 | 设置环形进度条刻度粗细（不支持百分比设置），刻度粗细大于进度条宽度时，为系统默认粗细。
默认值：2.0vp | +| enableSmoothEffect10+ | boolean | 否 | 进度平滑动效的开关。开启平滑动效后设置进度，进度会从当前值渐变至设定值，否则进度从当前值突变至设定值。
默认值：true | ## CapsuleStyleOptions10+ | 名称 | 参数类型 | 必填 | 描述 | @@ -81,6 +82,7 @@ Progress(options: {value: number, total?: number, type?: ProgressType}) | fontColor | [ResourceColor](ts-types.md#resourcecolor) | 否 | 文本颜色。
默认值：'\#ff182431' | | enableScanEffect | boolean | 否 | 扫光效果的开关。
默认值：false | | showDefaultPercentage | boolean | 否 | 显示百分比文本的开关，开启后会在进度条上显示当前进度的百分比。设置了content属性时该属性不生效。
默认值：false | +| enableSmoothEffect | boolean | 否 | 进度平滑动效的开关。开启平滑动效后设置进度，进度会从当前值渐变至设定值，否则进度从当前值突变至设定值。
默认值：true | ## RingStyleOptions10+ | 名称 | 参数类型 | 必填 | 描述 | @@ -89,12 +91,14 @@ Progress(options: {value: number, total?: number, type?: ProgressType}) | shadow | boolean | 否 | 进度条阴影开关。
默认值：false | | status | [ProgressStatus10+](#progressstatus10枚举说明) | 否 | 进度条状态，当设置为LOADING时会开启检查更新动效，此时设置进度值不生效。当从LOADING设置为PROGRESSING，检查更新动效会执行到终点再停止。
默认值： ProgressStatus.PROGRESSING | | enableScanEffect | boolean | 否 | 进度条扫光效果的开关。
默认值： false | +| enableSmoothEffect | boolean | 否 | 进度平滑动效的开关。开启平滑动效后设置进度，进度会从当前值渐变至设定值，否则进度从当前值突变至设定值。
默认值：true | ## LinearStyleOptions10+ | 名称 | 参数类型 | 必填 | 描述 | | ------------- | ---------------------------- | ---- | ------------------------------------------------------------------------------------------ | | strokeWidth | [Length](ts-types.md#length) | 否 | 设置进度条宽度（不支持百分比设置）。
默认值：4.0vp | | enableScanEffect | boolean | 否 | 进度条扫光效果的开关。
默认值： false | +| enableSmoothEffect | boolean | 否 | 进度平滑动效的开关。开启平滑动效后设置进度，进度会从当前值渐变至设定值，否则进度从当前值突变至设定值。
默认值：true | ## ScaleRingStyleOptions10+ | 名称 | 参数类型 | 必填 | 描述 | @@ -102,15 +106,18 @@ Progress(options: {value: number, total?: number, type?: ProgressType}) | strokeWidth | [Length](ts-types.md#length) | 否 | 设置进度条宽度（不支持百分比设置）。
默认值：4.0vp | | scaleCount | number | 否 | 设置环形进度条总刻度数。
默认值：120 | | scaleWidth | [Length](ts-types.md#length) | 否 | 设置环形进度条刻度粗细（不支持百分比设置），刻度粗细大于进度条宽度时，为系统默认粗细。
默认值：2.0vp | +| enableSmoothEffect | boolean | 否 | 进度平滑动效的开关。开启平滑动效后设置进度，进度会从当前值渐变至设定值，否则进度从当前值突变至设定值。
默认值：true | ## EclipseStyleOptions10+ -暂无参数。 +| 名称 | 参数类型 | 必填 | 描述 | +| ------------ | ---------------------------- | ---- | ------------------------------------------------------------------------------------------ | +| enableSmoothEffect | boolean | 否 | 进度平滑动效的开关。开启平滑动效后设置进度，进度会从当前值渐变至设定值，否则进度从当前值突变至设定值。
默认值：true | ## ProgressStatus10+枚举说明 | 名称 | 描述 | | ----------------------- | ---------------- | -| LOADING10+ | 加载中。 | -| PROGRESSING10+ | 进度更新中。 | +| LOADING | 加载中。 | +| PROGRESSING | 进度更新中。 | ## 事件 @@ -249,3 +256,38 @@ struct ProgressExample { } ``` ![capsuleProgressStyleEffect](figures/arkts-capsuleProgressStyleEffect.png) + +### 示例5 +进度平滑动效 +```ts +@Entry +@Component +struct Index { + @State value: number = 0 + + build() { + Column({space: 10}) { + Text('enableSmoothEffect: true').fontSize(9).fontColor(0xCCCCCC).width('90%').margin(5) + .margin({top: 20}) + Progress({value: this.value, total: 100, type:ProgressType.Linear}) + .style({strokeWidth: 10, enableSmoothEffect: true}) + + Text('enableSmoothEffect: false').fontSize(9).fontColor(0xCCCCCC).width('90%').margin(5) + Progress({value: this.value, total: 100, type:ProgressType.Linear}) + .style({strokeWidth: 10, enableSmoothEffect: false}) + + Button('value +10').onClick(() => { + this.value += 10 + }) + .width(75) + .height(15) + .fontSize(9) + } + .width('50%') + .height('100%') + .margin({left:20}) + } +} + +``` +![progressSmoothEffect](figures/arkts-progressSmoothEffect.gif) diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-textarea.md b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-textarea.md index 62816195d70832835372f204356618f9cc477fb7..aeeff72281ceddfbd76bc590b2be2dd30fed5983 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-textarea.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-textarea.md @@ -37,7 +37,7 @@ TextArea(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: Tex | caretColor | [ResourceColor](ts-types.md#resourcecolor) | 设置输入框光标颜色。
默认值：'#007DFF'。 | | inputFilter8+ | {
value: [ResourceStr](ts-types.md#resourcestr),
error?: (value: string) => void
} | 通过正则表达式设置输入过滤器。匹配表达式的输入允许显示，不匹配的输入将被过滤。仅支持单个字符匹配，不支持字符串匹配。
- value：设置正则表达式。
- error：正则匹配失败时，返回被过滤的内容。 | | copyOption9+ | [CopyOptions](ts-appendix-enums.md#copyoptions9) | 设置输入的文本是否可复制。
默认值：CopyOptions.LocalDevice，支持设备内复制。
设置CopyOptions.None时，当前TextArea中的文字无法被复制或剪切，仅支持粘贴。 | -| maxLength10+ | number | 设置文本的最大输入字符数。
默认不设置最大输入字符数限制。 | +| maxLength10+ | number | 设置文本的最大输入字符数。
默认不设置最大输入字符数限制。
到达文本最大字符限制，将无法继续输入字符，同时边框变为红色。 | | showCounter10+ | boolean | 设置文本最大输入字符数后，是否显示字数。
默认值：false | | style10+ | [TextContentStyle](ts-appendix-enums.md#textcontentstyle10) | 设置文本框多态样式。
默认值：TextContentStyle.DEFAULT | | enableKeyboardOnFocus10+ | boolean | TextArea获焦时，是否绑定输入法
默认值：true。从API version 10开始，获焦默认绑定输入法。 | diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md b/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md index 4b0c12ecf5e6fa934154ae4f9fc4d651e5e021ad..0eb644b0a1d4636e3c275fed02c979c1719e2929 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-canvasrenderingcontext2d.md @@ -40,9 +40,9 @@ RenderingContextSettings(antialias?: boolean) | 名称 | 类型 | 描述 | | ---------------------------------------- | ---------------------------------------- | ---------------------------------------- | -| [fillStyle](#fillstyle) | string \|number10+ \|[CanvasGradient](ts-components-canvas-canvasgradient.md) \| [CanvasPattern](ts-components-canvas-canvaspattern.md#canvaspattern) | 指定绘制的填充色。
- 类型为string时，表示设置填充区域的颜色。
- 类型为number时，表示设置填充区域的颜色。
- 类型为CanvasGradient时，表示渐变对象，使用[createLinearGradient](#createlineargradient)方法创建。
- 类型为CanvasPattern时，使用[createPattern](#createpattern)方法创建。
从API version 9开始，该接口支持在ArkTS卡片中使用。 | -| [lineWidth](#linewidth) | number | 设置绘制线条的宽度。 | -| [strokeStyle](#strokestyle) | string \|number10+ \|[CanvasGradient](ts-components-canvas-canvasgradient.md) \| [CanvasPattern](ts-components-canvas-canvaspattern.md#canvaspattern) | 设置描边的颜色。
- 类型为string时，表示设置描边使用的颜色。
- 类型为number时，表示设置描边使用的颜色。
- 类型为CanvasGradient时，表示渐变对象，使用[createLinearGradient](#createlineargradient)方法创建。
- 类型为CanvasPattern时，使用[createPattern](#createpattern)方法创建。
从API version 9开始，该接口支持在ArkTS卡片中使用。 | +| [fillStyle](#fillstyle) | string \|number10+ \|[CanvasGradient](ts-components-canvas-canvasgradient.md) \| [CanvasPattern](ts-components-canvas-canvaspattern.md#canvaspattern) | 指定绘制的填充色。
- 类型为string时，表示设置填充区域的颜色。
默认值：'black'
- 类型为number时，表示设置填充区域的颜色。
默认值：'#000000'
- 类型为CanvasGradient时，表示渐变对象，使用[createLinearGradient](#createlineargradient)方法创建。
- 类型为CanvasPattern时，使用[createPattern](#createpattern)方法创建。
从API version 9开始，该接口支持在ArkTS卡片中使用。 | +| [lineWidth](#linewidth) | number | 设置绘制线条的宽度。
默认值：1(px) | +| [strokeStyle](#strokestyle) | string \|number10+ \|[CanvasGradient](ts-components-canvas-canvasgradient.md) \| [CanvasPattern](ts-components-canvas-canvaspattern.md#canvaspattern) | 设置描边的颜色。
- 类型为string时，表示设置描边使用的颜色。
默认值：'black'
- 类型为number时，表示设置描边使用的颜色。
默认值：'#000000'
- 类型为CanvasGradient时，表示渐变对象，使用[createLinearGradient](#createlineargradient)方法创建。
- 类型为CanvasPattern时，使用[createPattern](#createpattern)方法创建。
从API version 9开始，该接口支持在ArkTS卡片中使用。 | | [lineCap](#linecap) | CanvasLineCap | 指定线端点的样式，可选值为：
- 'butt'：线端点以方形结束。
- 'round'：线端点以圆形结束。
- 'square'：线端点以方形结束，该样式下会增加一个长度和线段厚度相同，宽度是线段厚度一半的矩形。
默认值：'butt'
从API version 9开始，该接口支持在ArkTS卡片中使用。 | | [lineJoin](#linejoin) | CanvasLineJoin | 指定线段间相交的交点样式，可选值为：
- 'round'：在线段相连处绘制一个扇形，扇形的圆角半径是线段的宽度。
- 'bevel'：在线段相连处使用三角形为底填充， 每个部分矩形拐角独立。
- 'miter'：在相连部分的外边缘处进行延伸，使其相交于一点，形成一个菱形区域，该属性可以通过设置miterLimit属性展现效果。
默认值：'miter'
从API version 9开始，该接口支持在ArkTS卡片中使用。 | | [miterLimit](#miterlimit) | number | 设置斜接面限制值，该值指定了线条相交处内角和外角的距离。
默认值：10
从API version 9开始，该接口支持在ArkTS卡片中使用。 | diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-imagebitmap.md b/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-imagebitmap.md index 7fe21a0d935662f4bba21710a553216f5b7df001..d6c5d6129d38b8694652115f0ac3688a81ca826d 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-imagebitmap.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-imagebitmap.md @@ -24,8 +24,8 @@ ImageBitmap(src: string) | 属性 | 类型 | 描述 | | -------- | -------- | -------- | -| width | number | ImageBitmap的像素宽度。
从API version 9开始，该接口支持在ArkTS卡片中使用。 | -| height | number | ImageBitmap的像素高度。
从API version 9开始，该接口支持在ArkTS卡片中使用。 | +| width | number | ImageBitmap的像素宽度，当前值为0。。
从API version 9开始，该接口支持在ArkTS卡片中使用。 | +| height | number | ImageBitmap的像素高度，当前值为0。。
从API version 9开始，该接口支持在ArkTS卡片中使用。 | **示例：** diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-listitem.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-listitem.md index 5ef2d3622ec875996e9fd224339b8a27d346608e..7702bf2fd524ddf4e6000ab0749640c78016354a 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-container-listitem.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-listitem.md @@ -97,9 +97,10 @@ List垂直布局，ListItem向右滑动，item左边的长距离滑动删除选 | -------- | -------- | | onSelect(event: (isSelected: boolean) => void)8+ | ListItem元素被鼠标框选的状态改变时触发回调。
isSelected：进入鼠标框选范围即被选中返回true， 移出鼠标框选范围即未被选中返回false。 | - ## 示例 +### 示例1 + ```ts // xxx.ets @Entry @@ -126,6 +127,8 @@ struct ListItemExample { ![zh-cn_image_0000001219864159](figures/zh-cn_image_0000001219864159.gif) +### 示例2 + ```ts // xxx.ets @@ -192,7 +195,8 @@ struct ListItemExample2 { ``` ![deleteListItem](figures/deleteListItem.gif) -## 示例3 +### 示例3 + ```ts // xxx.ets @Entry diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-tabcontent.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-tabcontent.md index 9cfb9370daadf9a476edd194670a93a6bfa9b9fd..7993af8e18546dc9228fa1918cdfeeda631e9426 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-container-tabcontent.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-tabcontent.md @@ -140,7 +140,7 @@ BottomTabBarStyle的静态构造函数。 ## 示例 -示例1： +### 示例1 ```ts // xxx.ets @@ -246,7 +246,7 @@ struct TabContentExample { ![tabContent](figures/tabContent1.gif) -示例2： +### 示例2 ```ts // xxx.ets @@ -302,7 +302,7 @@ struct TabContentExample { ![tabContent](figures/tabContent2.gif) -示例3： +### 示例3 ```ts // xxx.ets @@ -400,7 +400,7 @@ struct TabBarStyleExample { ![tabbarStyle](figures/TabBarStyle.jpeg) -示例4： +### 示例4 ```ts // xxx.ets @@ -627,7 +627,7 @@ struct TabsAttr { ![tabContent3](figures/tabContent3.gif) -示例5： +### 示例5 ```ts // xxx.ets diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-ui-extension-component.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-ui-extension-component.md index a24cfce3bbd72d22ea4b2eb41d9bb5aab5b7e3c0..7528e56e4bee5d273ecdd19c7fdfdd084c378eac 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-container-ui-extension-component.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-ui-extension-component.md @@ -41,6 +41,7 @@ UIExtensionComponent(want: Want) send(data: { [key: string]: Object }): void **参数：** + | 参数名 | 参数类型 | 必填 | 参数描述 | | ---- | ---------------------------------------- | ---- | --------------- | | data | { [key: string]: Object } | 是 | 发送给被拉起的扩展Ability的数据。 | @@ -89,6 +90,8 @@ onResult(callback: [Callback](../apis/js-apis-base.md#callback)\<{code: number; 本回调内可处理对端Ability的结果数据，可参考[AbilityResult](../apis/js-apis-inner-ability-abilityResult.md)。 +**参数：** + | 参数名 | 类型 | 说明 | | ---------------------------- | ------ | ------------------------------------------------------------ | | code | number | 收到来自对端Ability的处理結果code。 | @@ -102,7 +105,9 @@ onRelease(callback: [Callback](../apis/js-apis-base.md#callback)\) 被拉起的Ability扩展调用terminateSelfWithResult或者terminateSelf时会触发本回调，此时releaseCode为0，即正常销毁。 -被拉起的Ability扩展意外Crash或被kill时，触发本回调，此时releaseCode为1，即异常死亡。 +被拉起的Ability扩展意外Crash或被kill时，触发本回调，此时releaseCode为1。 + +**参数：** | 参数名 | 类型 | 说明 | | ---------------------------- | ------ | ------------------------------------------------------------ | @@ -114,6 +119,8 @@ onError(callback:[ErrorCallback](../apis/js-apis-base.md#errorcallback)) 被拉起的Ability扩展在运行过程中发生异常时触发本回调。可通过回调参数中的code、name和message获取错误信息并做处理。 +**参数：** + | 参数名 | 类型 | 说明 | | ---------------------------- | ------ | ------------------------------------------------------------ | | err | [BusinessError](../apis/js-apis-base.md#businesserror) | 报错信息。 | diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-methods-datepicker-dialog.md b/zh-cn/application-dev/reference/arkui-ts/ts-methods-datepicker-dialog.md index 5fa377760f5659035aca6ad1aa8f2ced4841a889..115bafbc70ed614e1a14d4a77ee27b4771d44e92 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-methods-datepicker-dialog.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-methods-datepicker-dialog.md @@ -29,9 +29,11 @@ show(options?: DatePickerDialogOptions) | disappearTextStyle10+ | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 否 | 设置所有选项中最上和最下两个选项的文本颜色、字号、字体粗细。
默认值：
{
color: '#ff182431',
font: {
size: '14fp',
weight: FontWeight.Regular
}
} | | textStyle10+ | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 否 | 设置所有选项中除了最上、最下及选中项以外的文本颜色、字号、字体粗细。
默认值：
{
color: '#ff182431',
font: {
size: '16fp',
weight: FontWeight.Regular
}
} | | selectedTextStyle10+ | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 否 | 设置选中项的文本颜色、字号、字体粗细。
默认值：
{
color: '#ff007dff',
font: {
size: '20vp',
weight: FontWeight.Medium
}
} | -| onAccept | (value: [DatePickerResult](ts-basic-components-datepicker.md#DatePickerResult对象说明)) => void | 否 | 点击弹窗中的“确定”按钮时触发该回调。 | +| onAccept(deprecated) | (value: [DatePickerResult](ts-basic-components-datepicker.md#DatePickerResult对象说明)) => void | 否 | 点击弹窗中的“确定”按钮时触发该回调。
**说明：**
从API version 8 开始支持，从 API version 10 开始废弃，建议使用onDateAccept。 | | onCancel | () => void | 否 | 点击弹窗中的“取消”按钮时触发该回调。 | -| onChange | (value: [DatePickerResult](ts-basic-components-datepicker.md#DatePickerResult对象说明)) => void | 否 | 滑动弹窗中的滑动选择器使当前选中项改变时触发该回调。 | +| onChange(deprecated) | (value: [DatePickerResult](ts-basic-components-datepicker.md#DatePickerResult对象说明)) => void | 否 | 滑动弹窗中的滑动选择器使当前选中项改变时触发该回调。
**说明：**
从API version 8 开始支持，从 API version 10 开始废弃，建议使用onDateChange。 | +| onDateAccept10+ | (value: Date) => void | 否 | 点击弹窗中的“确定”按钮时触发该回调。
**说明：**
当showTime设置为true时，回调接口返回值value中时和分为选择器选择的时和分。否则，返回值value中时和分为系统时间的时和分。 | +| onDateChange10+ | (value: Date) => void | 否 | 滑动弹窗中的滑动选择器使当前选中项改变时触发该回调。
**说明：**
当showTime设置为true时，回调接口返回值value中时和分为选择器选择的时和分。否则，返回值value中时和分为系统时间的时和分。 | **异常情形说明:** @@ -76,16 +78,16 @@ struct DatePickerDialogExample { disappearTextStyle: {color: Color.Pink, font: {size: '22fp', weight: FontWeight.Bold}}, textStyle: {color: '#ff00ff00', font: {size: '18fp', weight: FontWeight.Normal}}, selectedTextStyle: {color: '#ff182431', font: {size: '14fp', weight: FontWeight.Regular}}, - onAccept: (value: DatePickerResult) => { + onDateAccept: (value: Date) => { // 通过Date的setFullYear方法设置按下确定按钮时的日期，这样当弹窗再次弹出时显示选中的是上一次确定的日期 - this.selectedDate.setFullYear(value.year, value.month, value.day) - console.info("DatePickerDialog:onAccept()" + JSON.stringify(value)) + this.selectedDate = value + console.info("DatePickerDialog:onDateAccept()" + value.toString()) }, onCancel: () => { console.info("DatePickerDialog:onCancel()") }, - onChange: (value: DatePickerResult) => { - console.info("DatePickerDialog:onChange()" + JSON.stringify(value)) + onDateChange: (value: Date) => { + console.info("DatePickerDialog:onDateChange()" + value.toString()) } }) }) @@ -101,15 +103,15 @@ struct DatePickerDialogExample { disappearTextStyle: {color: Color.Pink, font: {size: '22fp', weight: FontWeight.Bold}}, textStyle: {color: '#ff00ff00', font: {size: '18fp', weight: FontWeight.Normal}}, selectedTextStyle: {color: '#ff182431', font: {size: '14fp', weight: FontWeight.Regular}}, - onAccept: (value: DatePickerResult) => { - this.selectedDate.setFullYear(value.year, value.month, value.day) - console.info("DatePickerDialog:onAccept()" + JSON.stringify(value)) + onDateAccept: (value: Date) => { + this.selectedDate = value + console.info("DatePickerDialog:onDateAccept()" + value.toString()) }, onCancel: () => { console.info("DatePickerDialog:onCancel()") }, - onChange: (value: DatePickerResult) => { - console.info("DatePickerDialog:onChange()" + JSON.stringify(value)) + onDateChange: (value: Date) => { + console.info("DatePickerDialog:onDateChange()" + value.toString()) } }) }) diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-motion-path-animation.md b/zh-cn/application-dev/reference/arkui-ts/ts-motion-path-animation.md index 7b7bbcf002c7b6c351e3ef1e0d21f809d1383b14..3c4242aa7b50640606c83bea7ecd29f3a3092f04 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-motion-path-animation.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-motion-path-animation.md @@ -11,7 +11,7 @@ | 名称 | 参数类型 | 默认值 | 描述 | | -------- | -------- | -------- | -------- | -| motionPath | {
path: string,
from?: number,
to?: number,
rotatable?: boolean
}
**说明：**
path中支持使用start和end进行起点和终点的替代，如：
'Mstart.x start.y L50 50 Lend.x end.y Z'，更多说明请参考[绘制路径](../../ui/ui-js-components-svg-path.md)。 | {
'',
0.0,
1.0,
false
} | 设置组件的运动路径，入参说明如下：
- path：位移动画的运动路径，使用svg路径字符串。
- from：运动路径的起点。
默认值：0.0
取值范围：[0, 1]
设置小于0的值时，按值为0处理。设置大于1的值时，按值为1处理。
- to：运动路径的终点。
默认值：1.0
取值范围：[0, 1]
设置小于0的值时，按值为0处理。设置大于1的值时，按值为1处理。
- rotatable：是否跟随路径进行旋转。 | +| motionPath | {
path: string,
from?: number,
to?: number,
rotatable?: boolean
} | {
'',
0.0,
1.0,
false
} | 设置组件的运动路径，入参说明如下：
- path：位移动画的运动路径，使用svg路径字符串。path中支持使用start和end进行起点和终点的替代，如：'Mstart.x start.y L50 50 Lend.x end.y Z'，更多说明请参考[绘制路径](../../ui/ui-js-components-svg-path.md)。
- from：运动路径的起点。
默认值：0.0
取值范围：[0, 1]
设置小于0或大于1的值时，按默认值0处理。
- to：运动路径的终点。
默认值：1.0
取值范围：[0, 1]
设置小于0或大于1的值时，按默认值1处理，且满足to值 >= 异常值处理后的from值。
- rotatable：是否跟随路径进行旋转。 | ## 示例 diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-drag-drop.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-drag-drop.md index 291aeb168e1a2a4d8b401084e78cf967b7cbe370..748be0477b86159155efb8ce1861d2f6baaca3ab 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-drag-drop.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-drag-drop.md @@ -6,9 +6,13 @@ > > 从API Version 8开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。 > -> 已实现默认拖拽效果组件：[Image](../arkui-ts/ts-basic-components-image.md)、[Text](../arkui-ts/ts-basic-components-text.md)、[TextArea](../arkui-ts/ts-basic-components-textarea.md)、[Search](../arkui-ts/ts-basic-components-search.md)。 +> 默认支持拖拽（拖入和拖出）的组件：Search、TextInput、TextArea > -> 应用中的预置资源文件不支持拖拽（即应用在安装前的HAP包中已经存在的资源文件）。 +> 默认支持拖入的组件：Video +> +> 默认支持拖出的组件：Text、List、Grid、FormComponent、Image、Hyperlink +> +> 应用本身预置的资源文件（即应用在安装前的HAP包中已经存在的资源文件）仅支持本地应用内拖拽。 ## 事件 | 名称 | 支持冒泡 | 功能描述 | diff --git a/zh-cn/application-dev/reference/errorcodes/errorcode-i18n.md b/zh-cn/application-dev/reference/errorcodes/errorcode-i18n.md index ed93aeb58b8fcb1129f96fa23a6bdde2b9caaaab..6d760af024cc973dba8d19715cc192183ceb14e9 100644 --- a/zh-cn/application-dev/reference/errorcodes/errorcode-i18n.md +++ b/zh-cn/application-dev/reference/errorcodes/errorcode-i18n.md @@ -8,7 +8,7 @@ **错误信息** -Unspported para value. +param value not valid **错误描述** @@ -17,25 +17,7 @@ Unspported para value. **可能原因** 该错误码表示参数错误，可能原因是传入参数的类型错误。 - + **处理步骤** 检查参数的类型是否正确。 - -## 890002 配置项参数错误 - -**错误信息** - -param value not valid - -**错误描述** - -当接口的option配置参数中包含不合法的配置项时，系统会产生此错误码。 - -**可能原因** - -该错误码表示配置项参数错误，可能原因是option参数中使用了不支持的配置项。 - -**处理步骤** - -检查option参数中是否使用了不合法的配置项。 \ No newline at end of file diff --git a/zh-cn/application-dev/security/permission-list.md b/zh-cn/application-dev/security/permission-list.md index 3af6ac1bbce8a2fad0989c3248de7f3f5c4797d2..f2f4b0d505ac3094625a6f4c89acd20f87fd0b14 100644 --- a/zh-cn/application-dev/security/permission-list.md +++ b/zh-cn/application-dev/security/permission-list.md @@ -2686,7 +2686,7 @@ ## ohos.permission.MANAGE_DEVICE_AUTH_CRED -允许应用调用设备认证华为帐号凭据管理应用接口。 +允许应用调用设备认证分布式帐号凭据管理应用接口。 **权限级别**：system_basic diff --git a/zh-cn/application-dev/ui/arkts-routing.md b/zh-cn/application-dev/ui/arkts-routing.md index d2942ee01f323ab8184b863f14eebde15141135f..ae258c15c816e3c19df7f79131274551045344b0 100644 --- a/zh-cn/application-dev/ui/arkts-routing.md +++ b/zh-cn/application-dev/ui/arkts-routing.md @@ -323,3 +323,64 @@ function onBackClick() { ``` 当用户点击“返回”按钮时，会弹出自定义的询问框，询问用户是否确认返回。选择“取消”将停留在当前页目标页面；选择“确认”将触发router.back()方法，并根据参数决定如何执行跳转。 + +## 命名路由 + +在开发中为了跳转到[共享包中的页面](../quick-start/shared-guide.md)（即共享包中路由跳转），可以使用[router.pushNamedRoute()](../reference/apis/js-apis-router.md#routerpushnamedroute)来实现。 + +在使用页面路由Router相关功能之前，需要在代码中先导入Router模块。 + + +```ts +import router from '@ohos.router'; +``` + +在想要跳转到的[共享包](../quick-start/shared-guide.md)页面里，给[@Entry修饰的自定义组件](../quick-start/arkts-create-custom-components.md#entryoptions10)命名： + +```ts +// library/src/main/ets/pages/Index.ets +@Entry({ routeName : 'myPage' }) +@Component +struct MyComponent { +} +``` + +配置成功后需要在需要跳转的页面中引入命名路由的页面： + +```ts +// entry/src/main/ets/pages/Index.ets +import router from '@ohos.router'; +import '@ohos/library/src/main/ets/Index.ets' // 引入共享包library中的命名路由页面 + +@Entry +@Component +struct Index { + build() { + Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { + Text('Hello World') + .fontSize(50) + .fontWeight(FontWeight.Bold) + .margin({ top: 20 }) + .backgroundColor('#ccc') + .onClick(() => { // 点击跳转到其他共享包中的页面 + try { + router.pushNamedRoute({ + name: 'myPage', + params: { + data1: 'message', + data2: { + data3: [123, 456, 789] + } + } + }) + } catch (err) { + console.error(`pushNamedRoute failed, code is ${err.code}, message is ${err.message}`); + } + }) + } + .width('100%') + .height('100%') + } +} +``` + diff --git a/zh-cn/application-dev/ui/arkui-overview.md b/zh-cn/application-dev/ui/arkui-overview.md index c638196d60e87bba137c8e9bf6aa9923c707d6af..e1b1a3dc2500f6316adc895aaa558a2505e2bcf3 100644 --- a/zh-cn/application-dev/ui/arkui-overview.md +++ b/zh-cn/application-dev/ui/arkui-overview.md @@ -13,7 +13,7 @@ ## 两种开发范式 -针对不用的应用场景及技术背景，方舟开发框架提供了两种开发范式，分别是[基于ArkTS的声明式开发范式](arkts-ui-development-overview.md)（简称“声明式开发范式”）和[兼容JS的类Web开发范式](../ui/ui-js-overview.md)（简称“类Web开发范式”）。 +针对不同的应用场景及技术背景，方舟开发框架提供了两种开发范式，分别是[基于ArkTS的声明式开发范式](arkts-ui-development-overview.md)（简称“声明式开发范式”）和[兼容JS的类Web开发范式](../ui/ui-js-overview.md)（简称“类Web开发范式”）。 - **声明式开发范式**：采用基于TypeScript声明式UI语法扩展而来的[ArkTS语言](../quick-start/arkts-get-started.md)，从组件、动画和状态管理三个维度提供UI绘制能力。 diff --git a/zh-cn/application-dev/website.md b/zh-cn/application-dev/website.md index 71a4f8dfae088930624a44c22101c4a0bfb93014..67ba3f68680626ac2c3f524e7562e96dd7ff808c 100644 --- a/zh-cn/application-dev/website.md +++ b/zh-cn/application-dev/website.md @@ -963,21 +963,21 @@ - UI界面 - [@ohos.animator (动画)](reference/apis/js-apis-animator.md) - [@ohos.arkui.componentSnapshot (组件截图)](reference/apis/js-apis-arkui-componentSnapshot.md) + - [@ohos.arkui.componentUtils (componentUtils)](reference/apis/js-apis-arkui-componentUtils.md) - [@ohos.arkui.dragController (DragController)](reference/apis/js-apis-arkui-dragController.md) - [@ohos.arkui.drawableDescriptor (DrawableDescriptor)](reference/apis/js-apis-arkui-drawableDescriptor.md) - [@ohos.arkui.inspector (布局回调)](reference/apis/js-apis-arkui-inspector.md) + - [ @ohos.arkui.performanceMonitor (性能监测)](reference/apis/js-apis-arkui-performancemonitor.md) - [@ohos.arkui.UIContext (UIContext)](reference/apis/js-apis-arkui-UIContext.md) - - [@ohos.arkui.componentUtils (componentUtils)](reference/apis/js-apis-arkui-componentUtils.md) - [@ohos.curves (插值计算)](reference/apis/js-apis-curve.md) - [@ohos.font (注册自定义字体)](reference/apis/js-apis-font.md) - [@ohos.matrix4 (矩阵变换)](reference/apis/js-apis-matrix4.md) + - [@ohos.measure (文本计算)](reference/apis/js-apis-measure.md) - [@ohos.mediaquery (媒体查询)](reference/apis/js-apis-mediaquery.md) - [@ohos.pluginComponent (PluginComponentManager)](reference/apis/js-apis-plugincomponent.md) - [@ohos.promptAction (弹窗)](reference/apis/js-apis-promptAction.md) - [@ohos.router (页面路由)](reference/apis/js-apis-router.md) - - [@ohos.measure (文本计算)](reference/apis/js-apis-measure.md) - [@ohos.uiAppearance (用户界面外观)](reference/apis/js-apis-uiappearance.md) - - [ @ohos.arkui.performanceMonitor (性能监测)](reference/apis/js-apis-arkui-performancemonitor.md) - 图形图像 - [@ohos.animation.windowAnimationManager (窗口动画管理)](reference/apis/js-apis-windowAnimationManager.md) - [@ohos.application.WindowExtensionAbility (窗口扩展能力)](reference/apis/js-apis-application-windowExtensionAbility.md) @@ -991,12 +991,15 @@ - [webgl (WebGL)](reference/apis/js-apis-webgl.md) - [webgl2 (WebGL2)](reference/apis/js-apis-webgl2.md) - 媒体 + - [@ohos.app.ability.MediaControlExtensionAbility (播控扩展能力)](reference/apis/js-apis-app-ability-MediaControlExtensionAbility.md) - [@ohos.multimedia.audio (音频管理)](reference/apis/js-apis-audio.md) - [@ohos.multimedia.avsession (媒体会话管理)](reference/apis/js-apis-avsession.md) - [@ohos.multimedia.camera (相机管理)](reference/apis/js-apis-camera.md) - [@ohos.multimedia.image (图片处理)](reference/apis/js-apis-image.md) - [@ohos.multimedia.media (媒体服务)](reference/apis/js-apis-media.md) - [@ohos.multimedia.systemSoundManager (系统声音管理)](reference/apis/js-apis-systemSoundManager.md) + - application + - [MediaControlExtensionContext (播控扩展能力上下文)](reference/apis/js-apis-inner-application-MediaControlExtensionContext.md) - multimedia - [ringtonePlayer (铃声播放器)](reference/apis/js-apis-inner-multimedia-ringtonePlayer.md) - 资源管理 @@ -1044,8 +1047,8 @@ - [@ohos.file.fileuri (文件URI)](reference/apis/js-apis-file-fileuri.md) - [@ohos.file.fs (文件管理)](reference/apis/js-apis-file-fs.md) - [@ohos.file.hash (文件哈希处理)](reference/apis/js-apis-file-hash.md) - - [@ohos.file.picker (选择器)](reference/apis/js-apis-file-picker.md) - [@ohos.file.photoAccessHelper (相册管理模块)](reference/apis/js-apis-photoAccessHelper.md) + - [@ohos.file.picker (选择器)](reference/apis/js-apis-file-picker.md) - [@ohos.file.securityLabel (数据标签)](reference/apis/js-apis-file-securityLabel.md) - [@ohos.file.statvfs (文件系统空间统计)](reference/apis/js-apis-file-statvfs.md) - [@ohos.file.storageStatistics (应用空间统计)](reference/apis/js-apis-file-storage-statistics.md) @@ -1420,6 +1423,7 @@ - [Swiper](reference/arkui-ts/ts-container-swiper.md) - [Tabs](reference/arkui-ts/ts-container-tabs.md) - [TabContent](reference/arkui-ts/ts-container-tabcontent.md) + - [UIExtensionComponent](reference/arkui-ts/ts-container-ui-extension-component.md) - [WaterFlow](reference/arkui-ts/ts-container-waterflow.md) - 媒体组件 - [Video](reference/arkui-ts/ts-media-components-video.md) diff --git "a/zh-cn/design/ux-design/figures/OpenHarmony\345\272\224\347\224\250\345\233\276\346\240\207\346\250\241\347\211\210.zip" "b/zh-cn/design/ux-design/figures/OpenHarmony\345\272\224\347\224\250\345\233\276\346\240\207\346\250\241\347\211\210.zip" index 0d602f61f6835802452e124de56692d265e5f386..b115633098fa5c8170a65665859eaa697a3c6706 100644 --- "a/zh-cn/design/ux-design/figures/OpenHarmony\345\272\224\347\224\250\345\233\276\346\240\207\346\250\241\347\211\210.zip" +++ "b/zh-cn/design/ux-design/figures/OpenHarmony\345\272\224\347\224\250\345\233\276\346\240\207\346\250\241\347\211\210.zip" @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:d29115dec3138599c50b9a1c5fd69b337ed90c57539f140d6896f9e464db7f7c -size 20190 +oid sha256:2a79d4a6541f2502fecf2741eb5a8a89d3b9ae69e216b19845e591b114e7e0d7 +size 7743 diff --git a/zh-cn/device-dev/subsystems/subsys-build-component.md b/zh-cn/device-dev/subsystems/subsys-build-component.md index 25211ea1daa6840f87137057a965deaef144dae7..3945679dc39c3ef13a630fa1a6dfe795fbc967ad 100644 --- a/zh-cn/device-dev/subsystems/subsys-build-component.md +++ b/zh-cn/device-dev/subsystems/subsys-build-component.md @@ -34,7 +34,8 @@ ], "third_party": [ # 部件依赖的三方开源软件 "bounds_checking_function" - ] + ], + "hisysevent_config": [] # 部件HiSysEvent打点配置文件编译入口 } "build": { # 编译相关配置 "sub_component": [ @@ -61,6 +62,8 @@ component 部件配置中需要配置部件的名称、源码路径、功能简介、是否必选、编译目标、RAM、ROM、编译输出、已适配的内核、可配置的特性和依赖等属性定义。 +> **注意**：部件配置中HiSysEvent打点配置文件使用说明，请参考文档[HiSysEvent打点配置](subsys-dfx-hisysevent-logging-config.md)。 + 新增部件时需要在对应子系统json文件中添加相应的部件定义。产品所配置的部件必须在某个子系统中被定义过，否则会校验失败。 ### 新增并编译部件 diff --git a/zh-cn/device-dev/subsystems/subsys-dfx-hisysevent-logging-config.md b/zh-cn/device-dev/subsystems/subsys-dfx-hisysevent-logging-config.md index 175b49816ea59a74ed28651cdca2b607fc8f1c7d..7f94d9ac9fa80ddbee3e1aa5ec3c5944a235c8e8 100644 --- a/zh-cn/device-dev/subsystems/subsys-dfx-hisysevent-logging-config.md +++ b/zh-cn/device-dev/subsystems/subsys-dfx-hisysevent-logging-config.md @@ -33,10 +33,11 @@ | 字段名称 | 描述 | | -------- | -------- | - | type | 字段说明：必选字段，用来标识该事件名称的类型。
取值范围：
- FAULT：错误类型。
- STATISTIC：统计类型。
- SECURITY：安全性。
- BEHAVIOR：用户行为。 | + | type | 字段说明：必选字段，用来标识该事件名称的类型。
取值范围：
- FAULT：故障类型。
- STATISTIC：统计类型。
- SECURITY：安全类型。
- BEHAVIOR：行为类型。 | | level | 字段说明：必选字段，用来标识该事件名称的级别。
取值范围：
- CRITICAL：严重。
- MINOR：一般。 | - | tag | 字段说明：可选字段，用来标识该事件名称的标签。
定义规则：
- 最多可同时定义5个标签，标签之间使用空格来分隔。
- 单个标签最多包含16个字符，字符范围[a-zA-Z0-9] | - | desc | 字段说明：必选字段，用来对该事件名称进行描述。
定义规则：
- 至少包含3个字符，最多包含128个字符，字符范围[a-zA-Z0-9 _] | + | tag | 字段说明：可选字段，用来标识该事件名称的标签。
定义规则：
- 最多可同时定义5个标签，标签之间使用空格来分隔。
- 单个标签最多包含16个字符，字符范围[a-zA-Z0-9]。 | + | desc | 字段说明：必选字段，用来对该事件名称进行描述。
定义规则：
- 至少包含3个字符，最多包含128个字符。 | + | preserve | 字段说明：可选字段，用来标识事件是否需要落盘，默认值为true。
取值范围：
- true：事件需要落盘。
- false：事件不需要落盘。 | **表2** 自定义参数字段说明 @@ -44,7 +45,7 @@ | -------- | -------- | | type | 字段说明：必选字段，用来标识该参数的类型。
取值范围：
- BOOL
- INT8
- UINT8
- INT16
- UINT16
- INT32
- UINT32
- INT64
- UINT64
- FLOAT
- DOUBLE
- STRING | | arrsize | 字段作用：可选字段，用来标识数组类型参数的长度。
取值范围：
- 1~100 | - | desc | 字段作用：必选字段，用来对该参数进行描述。
定义规则：
- 至少包含3个字符，最多包含128个字符，字符范围[a-zA-Z0-9 _] | + | desc | 字段作用：必选字段，用来对该参数进行描述。
定义规则：
- 至少包含3个字符，最多包含128个字符。 | ## 开发步骤 diff --git a/zh-cn/release-notes/OpenHarmony-v4.0-beta2.md b/zh-cn/release-notes/OpenHarmony-v4.0-beta2.md new file mode 100644 index 0000000000000000000000000000000000000000..e5e53ec45d8ec171506c65cba3d7a8a32b76d342 --- /dev/null +++ b/zh-cn/release-notes/OpenHarmony-v4.0-beta2.md @@ -0,0 +1,450 @@ +# OpenHarmony 4.0 Beta2 + +## 版本概述 + +OpenHarmony 4.0版本标准系统能力持续完善：ArkUI进一步增强基础组件能力，应用框架支持ArkTS卡片代理刷新，应用包支持应用、支持原子化服务数据共享、支持企业应用的安装管理，分布式软总线支持会话级的传输能力协商，分布式数据管理UDMF（统一数据管理框架）支持跨设备拖拽场景下对分布式目录的文件临时授权、文件管理支持公共图片文件在设备端和云端进行同步，媒体进一步增强音频/媒体播放/音视频编解码能力，图形渲染库升级至Skia 0310新版本，窗口控件化能力继续增强，事件通知支持选定通知并批量删除通知，安全基础提供DSA数字签名算法能力，ArkCompiler方舟运行时支持JSContext功能、支持动态PGO功能，DFX提供统一的采集框架能力，方便开发者对应用的调试调测。 + +## 特性说明 + + +### 应用框架 + +- 更新ArkTS卡片刷新方式，支持通过数据代理的方式刷新内容。 + +- ArkTS卡片支持静态卡片配置、静态图展示。 + + +### ArkUI + +- Xcomponent组件支持Texture模式绘制、popup支持位置自定义、弹框支持通过键盘ESC键逐层退出、ListItem支持长距离左滑删除手势、ArkTS/JS卡片支持渲染完成回调、Image/Text组件支持隐私遮罩、ContextMenu支持分段显示能力。 + +- 动画效果增强，包括：布局属性、背景图片大小位置属性、显隐属性支持隐式动效，list支持scrollToIndex动效、Tabs模糊动效、popup出现/消失动效，支持自定义动画，满足开发者多种多样动画诉求。 + +- 开发效率增强：支持命名路由的能力，借助此能力可针对不同页面设置不同的切换动效；轻量级ArkUI框架支持定义全局数据对象，可进行应用内页面间的数据共享。 + +- 全局API支持Stage模型多实例场景。 + + +### 应用包管理 + +- 支持对应用分发类型和附件信息的设置和查询。 + +- 支持通过文件扩展名列出支持打开该文件的应用列表，实现了文件扩展名与应用的匹配关系。 + +- 支持企业应用的安装管理，对于证书类型为“enterprise”的应用，安装需要申请“ohos.permission.INSTALL_ENTERPRISE_BUNDLE”。 + + +### 分布式数据管理 + +- UDMF（统一数据管理框架）支持跨设备拖拽场景下对分布式目录的文件临时授权。 + +- 提供RDBstore NDK接口 ：包含增/删/改/查/事务、数据加密、数据分级保护、备份/恢复能力。 + +- Key-Value和分布式数据对象支持根据数据量自动选择数据同步的通道。系统会根据数据量大小自动选择蓝牙通道或基于WiFi的P2P通道进行数据的同步。 + + +### 分布式软总线 + +- 支持对基于软总线连接的link信息进行管理。 + +- 支持会话级的传输能力协商，可通过协商确定设备间传输的能力。 + + +### 分布式硬件 + +- 分布式场景下的音频录制时延性能得到优化。 + +- 分布式文件系统支持在以蓝牙引导的P2P连接环境下进行文件互访。 + +- 支持组网设备名称变化的监听。 + + +### 文件管理 + +- 支持公共图片文件在设备端和云端进行同步（设备登录的帐号需开通云端服务），支持通过picker选择云端的图片。 + +- 支持应用定制备份恢复的目录。 + +- 支持公共图片的分类管理，用户可以在图库中通过相册对用户图片进行组织分类。 + +- 支持应用监听沙箱内的文件的增改删。 + +- 支持应用跨设备分享沙箱内的文件。 + + +### 图形显示及窗口 + +**图形** + +- 支持对选定区域取色，可选定区域后获得该区域的主色值、平均色值等参数并按需使用。 + +- 支持设置旋转中心在Z轴锚点的偏移，允许在旋转过程中修改渲染的锚点。 + +- 图形处理依赖的渲染库升级至Skia 0310新版本，提升了显示性能。 + +**窗口** + +- 优化了display模块的参数值获取方式，从原先软件方式优化为从硬件直接获取真实值。 + +- 窗口控件化能力增强：窗口以控件化的方式支持窗口属性、子窗口、模态窗口、窗口效果、窗口装饰、亮灭屏流程、截屏录屏。 + + +### 媒体 + +**音频** + +- 支持音效框架：设备厂商可配置音效策略和加载自定义音效；应用可查询音频输出的音效模式，切换或关闭音效模式。 + +- 支持系统内录音能力：可根据音频场景属性筛选，录制系统内播放的音频数据。 + +- 支持获取音频设备显示名：播放对象详细信息内可获取当前播放输出归属的设备名。 + +**媒体播放** + +支持音效参数配置，可以在音频框架支持音效的能力基础上进一步配置音效。 + +**音视频编解码** + +- 支持通过Native API查询系统的音视频编解码能力。 + +- 支持通过Native API完成音视频封装，即将音频、视频等编码后的媒体数据，按一定的格式存储到文件里。 + +- 支持通过Native API完成音视频解封装，即从比特流数据中取出音频、视频等媒体帧数据。 + + +### 事件通知 + +- 支持选定通知并批量删除通知。 + +- emitter支持取消按条件指定订阅回调能力。 + + +### 基础通信 + +- WiFi支持后台扫描的能力。 + +- WiFi支持STA模式下的随机MAC能力。 + + +### 网络与通信 + +- 支持与服务器端通过TCP Socket进行通信。 + +- 支持用户将数据传送到远程服务器。 + +- 支持HTTPS证书的管理适配。 + +- 支持网卡代理。 + + +### 系统服务管理 + +- 支持系统服务按需启动，例如外部调用、事件触发，同时支持在设备空闲时自动退出系统服务。 + +- 系统服务配置格式优化，使用JSON格式替代XML格式。 + + +### 电源 + +- 新增接口，支持设置系统立即进入睡眠状态。 + +- 新增休眠源定制能力，支持根据不同的休眠源定制事件及行为。 + +- 新增唤醒源定制能力，支持根据不同的唤醒源定制唤醒事件。 + + +### 多模输入 + +- 支持将键盘输入设备的原始事件映射为归一化交互的意图事件，使开发者在开发应用时无需关注输入行为是来自触控还是键盘。 + +- 支持用户根据个人习惯设置触控板功能的个性化配置： + - 支持两种触发模式映射鼠标左键功能： 按压、轻点。 + - 支持两种触发模式映射鼠标右键功能：点按左/右下角、双指点按或轻点。 + - 跟踪速度：支持10档速度调节。 + - 支持两种交互模式映射鼠标滚轮功能：内容随手指移动方向、内容随手指反向移动。 + + +### 主题框架 + +- 锁屏管理服务支持锁屏事件回调机制、静态/动态壁纸、查询锁屏时的业务状态。 + +- 壁纸管理服务支持自定义壁纸、锁屏/解锁操作、重置壁纸。 + + +### 上传下载 + +支持查询上传和下载的任务、任务状态信息同步和任务记录持久化、任务状态查询和异常的恢复。 + + +### 安全 + +**加解密算法库框架** + +- 提供DSA数字签名算法能力。 + +- 提供DSA、ECC、RSA密钥解析和密钥参数的获取能力。 + +- 提供安全随机数生成算法类型的获取能力。 + +- 提供SM4密钥的随机生成与转换，以及加密解密能力。 + +- 提供SM3密钥的HMAC和HASH的能力。 + +- 提供SM2密钥的随机生成与转换、签名及验签、以及加密解密能力。 + +**密钥管理** + +- 支持HUKS密钥加密保护。 + +- 支持KeyAttestation公钥证书中增加对密钥所属业务身份字段。 + +- 支持标准HDI南向接口。 + +**设备互信认证** + +支持在以下两种场景的设备间互信认证流程中生成假名，支持识别及和标识设备的假名化名称。 + +- 对使用同帐号登录的多个设备进行互信认证。 + +- 对非同帐号的点对点互联的两个设备进行互信认证。 + + +### 程序访问控制 + +- 优化权限管理的菜单呈现，拆分媒体和文件的权限组，相应权限的授权粒度更加精细化。 + +- 支持treble架构下对SELinux的兼容能力。 + + +### 帐号 + +- 支持帐号授权能力扩展和三方应用使用帐号授权能力。 + +- 支持对域帐号插件的管理，从而支持域帐号管理和认证能力。 + + +### WebView + +- W3C能力补充完善：补充Web Camera能力，以及bindContextMenu、Select、date类型input等H5标签能力。 + +- 支持多渲染进程的进程拆分。 + +- 支持文字、图片基础拖拽能力。 + +- 支持WebRTC的视频会议能力（不含摄像头共享）。 + +- 支持渲染进程独立SELinux标签，增强安全基础能力。 + + +### ArkCompiler + +- 方舟运行时支持JSContext功能；支持动态PGO功能，可采集运行期的类型和函数热点信息，并生成AP文件；支持动态import加载NAPI库。 + +- 方舟编译器type编译模式下前端编译工具链切换到es2abc。 + +- NAPI buffer、object、arraybuffer、object type接口功能补齐。 + +- Taskpool支持任务中断和取消，支持定义任务组（TaskGroup），支持对任务的状态和调度信息进行打点，支持超长等待的任务进行识别和恢复。 + +- 编译构建能力提供OpenHarmony系统user和root不同权限版本的构建，user版本能力同步支持Wukong测试工具和XTS测试能力。 + +- 编译工具链支持预览器上的调试能力。 + + +### DFX + +- 提供统一的采集框架能力，方便开发者对应用的调试调测。 + +- 提供统一的trace采集能力。 + +- 提供Native的HiTraceMeter打点接口。 + +- 性能雷达提供工具类，方便各业务模块（子系统）在业务流程上传递性能埋点记录及结算性能数据。 + + +### 内核 + +代码执行权限管控能力增强，新增了以下能力： + +- 支持安全内存机制。 + +- 提供满足不同场景的代码执行权限管控策略。 + +- 提供代码执行权限管控的全生命周期管理能力。 + +- 支持解析可执行文件获取代码段信息。 + +- 支持代码页的完整性保护能力。 + + +### 驱动 + +- 扩展设备驱动框架提供以下能力： + - 扩展设备驱动框架基于“驱动扩展Ability（DriverExtensionAbility）”的能力，构建应用态扩展驱动包的开发、部署、安装、更新、卸载、运行能力，开放全流程生命周期管理能力。 + - 支持三方设备厂商开发的非标准协议的可插拔USB设备扩展驱动包，正常安装到OpenHarmony系统。插入USB设备后，能正常识别USB设备并与扩展驱动包匹配。 + - 支持三方应用通过扩展外部设备管理框架查询并绑定USB设备扩展驱动包，完成对扩展驱动包定制功能的操作。 + +- 相机驱动提供以下能力： + - 提供USB相机热插拔识别能力，支持开机启动检查识别和启动后热插拔识别。 + - 支持USB相机的预览、拍照、录像能力，提供相机格式、分辨率查询和配置能力。 + +- 编解码驱动提供JPEG图片硬件解码加速能力，包括获取硬件解码信息，初始化/去初始化，解码，申请/释放buffer，提升用户浏览图片流畅度体验。 + +- 传感器驱动提供温湿度传感器设备驱动能力，支持小型设备温湿度器件查询，器件使能/去使能，数据查询能力，丰富智能设备传感器能力。 + + +## 配套关系 + +**表1** 版本软件和工具配套关系 + +| 软件 | 版本 | 备注 | +| -------- | -------- | -------- | +| OpenHarmony | 4.0 Beta2 | NA | +| Public SDK | Ohos_sdk_public 4.0.9.6 (API Version 10 Beta2) | 面向应用开发者提供，不包含需要使用系统权限的系统接口。通过DevEco Studio默认获取的SDK为Public SDK。 | +| HUAWEI DevEco Studio（可选） | 4.0 Beta2 | OpenHarmony应用开发推荐使用。获取方式：
*待发布* | +| HUAWEI DevEco Device Tool（可选） | 4.0 Beta1 | OpenHarmony智能设备集成开发环境推荐使用。获取方式：
[点击跳转至下载页面](https://device.harmonyos.com/cn/develop/ide#download) | + + +## 源码获取 + + +### 前提条件 + +1. 注册码云gitee帐号。 + +2. 注册码云SSH公钥，请参考[码云帮助中心](https://gitee.com/help/articles/4191)。 + +3. 安装[git客户端](https://gitee.com/link?target=https%3A%2F%2Fgit-scm.com%2Fbook%2Fzh%2Fv2%2F%25E8%25B5%25B7%25E6%25AD%25A5-%25E5%25AE%2589%25E8%25A3%2585-Git)和[git-lfs](https://gitee.com/vcs-all-in-one/git-lfs?_from=gitee_search#downloading)并配置用户信息。 + + ``` + git config --global user.name "yourname" + git config --global user.email "your-email-address" + git config --global credential.helper store + ``` + +4. 安装码云repo工具，可以执行如下命令。 + + ``` + curl -s https://gitee.com/oschina/repo/raw/fork_flow/repo-py3 > /usr/local/bin/repo #如果没有权限，可下载至其他目录，并将其配置到环境变量中chmod a+x /usr/local/bin/repo + pip3 install -i https://repo.huaweicloud.com/repository/pypi/simple requests + ``` + + +### 通过repo获取 + +**方式一（推荐）** + +通过repo + ssh 下载（需注册公钥，请参考[码云帮助中心](https://gitee.com/help/articles/4191)）。 + +- 从版本分支获取源码。可获取该版本分支的最新源码，包括版本发布后在该分支的合入。 + ``` + repo init -u git@gitee.com:openharmony/manifest.git -b OpenHarmony-4.0-Beta2 --no-repo-verify + repo sync -c + repo forall -c 'git lfs pull' + ``` + +- 从版本发布Tag节点获取源码。可获取与版本发布时完全一致的源码。 + ``` + repo init -u git@gitee.com:openharmony/manifest.git -b refs/tags/OpenHarmony-v4.0-Beta2 --no-repo-verify + repo sync -c + repo forall -c 'git lfs pull' + ``` + +**方式二** + +通过repo + https 下载。 + +- 从版本分支获取源码。可获取该版本分支的最新源码，包括版本发布后在该分支的合入。 + ``` + repo init -u https://gitee.com/openharmony/manifest -b OpenHarmony-4.0-Beta2 --no-repo-verify + repo sync -c + repo forall -c 'git lfs pull' + ``` + +- 从版本发布Tag节点获取源码。可获取与版本发布时完全一致的源码。 + ``` + repo init -u https://gitee.com/openharmony/manifest -b refs/tags/OpenHarmony-v4.0-Beta2 --no-repo-verify + repo sync -c + repo forall -c 'git lfs pull' + ``` + + +### 从镜像站点获取 + + **表2** 获取源码路径 + +| 版本源码 | **版本信息** | **下载站点** | **SHA256校验码** | **软件包容量** | +| --------------------------------------- | ------------ | ------------------------------------------------------------ | ------------------------------------------------------------ | -------- | +| 全量代码（标准、轻量和小型系统） | 4.0 Beta2 | [站点](https://repo.huaweicloud.com/openharmony/os/4.0-Beta2/code-v4.0-Beta2.tar.gz) | [SHA256校验码](https://repo.huaweicloud.com/openharmony/os/4.0-Beta2/code-v4.0-Beta2.tar.gz.sha256) | 27.7 GB | +| Hi3861解决方案（二进制） | 4.0 Beta2 | [站点](https://repo.huaweicloud.com/openharmony/os/4.0-Beta2/hispark_pegasus.tar.gz) | [SHA256校验码](https://repo.huaweicloud.com/openharmony/os/4.0-Beta2/hispark_pegasus.tar.gz.sha256) | 27.5 MB | +| Hi3516解决方案-LiteOS（二进制） | 4.0 Beta2 | [站点](https://repo.huaweicloud.com/openharmony/os/4.0-Beta2/hispark_taurus_LiteOS.tar.gz) | [SHA256校验码](https://repo.huaweicloud.com/openharmony/os/4.0-Beta2/hispark_taurus_LiteOS.tar.gz.sha256) | 300.9 MB | +| Hi3516解决方案-Linux（二进制） | 4.0 Beta2 | [站点](https://repo.huaweicloud.com/openharmony/os/4.0-Beta2/hispark_taurus_Linux.tar.gz) | [SHA256校验码](https://repo.huaweicloud.com/openharmony/os/4.0-Beta2/hispark_taurus_Linux.tar.gz.sha256) | 192.4 MB | +| RK3568标准系统解决方案（二进制） | 4.0 Beta2 | [站点](https://repo.huaweicloud.com/openharmony/os/4.0-Beta2/dayu200_standard_arm32.tar.gz) | [SHA256校验码](https://repo.huaweicloud.com/openharmony/os/4.0-Beta2/dayu200_standard_arm32.tar.gz.sha256) | 5.2 GB | +| 标准系统Public SDK包（Mac） | 4.0.9.6 | [站点](https://repo.huaweicloud.com/openharmony/os/4.0-Beta2/ohos-sdk-mac-public.tar.gz) | [SHA256校验码](https://repo.huaweicloud.com/openharmony/os/4.0-Beta2/ohos-sdk-mac-public.tar.gz.sha256) | 832.3 MB | +| 标准系统Public SDK包（Mac-M1） | 4.0.9.6 | [站点](https://repo.huaweicloud.com/openharmony/os/4.0-Beta2/L2-SDK-MAC-M1-PUBLIC.tar.gz) | [SHA256校验码](https://repo.huaweicloud.com/openharmony/os/4.0-Beta2/L2-SDK-MAC-M1-PUBLIC.tar.gz.sha256) | 788.4 MB | +| 标准系统Public SDK包（Windows/Linux） | 4.0.9.6 | [站点](https://repo.huaweicloud.com/openharmony/os/4.0-Beta2/ohos-sdk-windows_linux-public.tar.gz) | [SHA256校验码](https://repo.huaweicloud.com/openharmony/os/4.0-Beta2/ohos-sdk-windows_linux-public.tar.gz.sha256) | 2.0 GB | + + +## 更新说明 + +本版本在OpenHarmony 4.0 Beta1的基础上有如下变更: + +### API + +OpenHarmony 4.0 Beta2的API范围相比4.0 Beta1，API变更的清单请参见“[API差异报告](https://gitee.com/openharmony/docs/blob/OpenHarmony-4.0-Beta2/zh-cn/release-notes/api-diff/v4.0-beta2/Readme-CN.md)”。极少量接口的变更可能影响到已开发的应用（使用API 9或更早版本API开发的应用），变更影响的说明和接口的适配指导请参见“[changelogs](https://gitee.com/openharmony/docs/blob/OpenHarmony-4.0-Beta2/zh-cn/release-notes/changelogs/v4.0-beta2/Readme-CN.md)”。 + + +### 特性变更 + +详见[版本概述](#版本概述)。 + +### 芯片及开发板适配 + +芯片及开发板适配状态请参考[SIG-Devboard](https://gitee.com/openharmony/community/blob/master/sig/sig_devboard/sig_devboard_cn.md)信息。 + + +### Samples + +**表3** 新增Samples + +| 子系统 | 名称 | 简介 | 开发语言 | +| -------- | -------- | -------- | -------- | +| 网络与连接 | [上传和下载](https://gitee.com/openharmony/applications_app_samples/tree/OpenHarmony-4.0-Beta2/code/BasicFeature/Connectivity/UploadAndDownLoad) | 本示例使用\@ohos.request接口创建上传和下载任务，实现上传、下载功能，hfs作为服务器，实现了文件的上传和下载和任务的查询功能。 | ArkTS | +| 文件管理 | [应用接入数据备份恢复](https://gitee.com/openharmony/applications_app_samples/tree/OpenHarmony-4.0-Beta2/code/BasicFeature/FileManagement/FileBackupExtension)
（Full SDK） | 应用接入数据备份恢复需要通过配置BackupExtensionAbility实现。
BackupExtensionAbility，是Stage模型中扩展组件ExtensionAbility的派生类。开发者可以通过修改配置文件定制备份恢复框架的行为，包括是否允许备份恢复，备份哪些文件等。
本sample主要给备份流程提供应用，用于生成数据和显示数据。 | ArkTS | +| 事件通知 | [自定义通知角标](https://gitee.com/openharmony/applications_app_samples/tree/OpenHarmony-4.0-Beta2/code/BasicFeature/Notification/CustomNotificationBadge) | 本示例主要展示了设定应用的桌面图标角标的功能，使用\@ohos.notificationManager 接口，进行桌面角标的设置，通知的发送，获取等。 | ArkTS | +| 事件通知 | [自定义通知推送](https://gitee.com/openharmony/applications_app_samples/tree/OpenHarmony-4.0-Beta2/code/BasicFeature/Notification/CustomNotificationPush)
（Full SDK） | 本示例主要展示了通知过滤回调管理的功能，使用\@ohos.notificationManager 接口，进行通知监听回调，决定应用通知是否发送。 | ArkTS | +| NDK | [Native Xcomponent](https://gitee.com/openharmony/applications_app_samples/tree/master/code/BasicFeature/Native/NdkXComponent)
（Native SDK） | 本示例中主要介绍开发者如何使用Native XComponent接口来获取NativeWindow实例、获取布局/事件信息、注册事件回调并通过OpenGL/EGL实现在页面上绘制形状。功能主要包括点击按钮绘制一个五角星，并可以通过点击XComponent区域改变五角星的颜色。 | Native C++ | +| 应用模型 | [数据代理卡片-数据库刷新](https://gitee.com/openharmony/applications_app_samples/tree/OpenHarmony-4.0-Beta2/code/SystemFeature/ApplicationModels/PersistentProxyForm)
（Full SDK） | 本示例主要展示了数据代理卡片的功能，使用\@ohos.application.DataShareExtensionAbility、\@ohos.data.dataShare、\@ohos.data.dataSharePredicates等接口，实现了修改卡片订阅信息后，当rdb数据库中的数据发生变化时，卡片中对应信息也发生相应变化的功能。 | ArkTS | +| 应用模型 | [数据代理卡片-仿push应用刷新](https://gitee.com/openharmony/applications_app_samples/tree/OpenHarmony-4.0-Beta2/code/SystemFeature/ApplicationModels/ProcessProxyForm)
（Full SDK） | 本示例主要展示了使用push应用形式的数据代理卡片功能，使用\@ohos.data.dataShare等接口，实现了数据代理卡片的修改订阅条件功能及卡片的发布数据功能。 | ArkTS | +| 应用模型 | [编辑应用](https://gitee.com/openharmony/applications_app_samples/tree/OpenHarmony-4.0-Beta2/code/SystemFeature/ApplicationModels/Receiver) | 本示例主要实现了基于UIExtension实现简单的分享功能。支持取消分享，点击“返回Share”按钮，返回调用方应用；支持完成分享，点击“留在编辑应用”按钮，留在当前接收分享结果应用。 | ArkTS | +| 应用模型 | [发起分享应用](https://gitee.com/openharmony/applications_app_samples/tree/OpenHarmony-4.0-Beta2/code/SystemFeature/ApplicationModels/Share)
（Full SDK） | 本示例主要实现了点击“分享”按钮发起分享，显示出分享文本应用图标和分享编辑应用图标，点击相对应应用图标可以发起分享并跳转到其对应应用显示。 | ArkTS | +| 应用模型 | [文本应用](https://gitee.com/openharmony/applications_app_samples/tree/OpenHarmony-4.0-Beta2/code/SystemFeature/ApplicationModels/Template)
（Full SDK） | 本示例主要实现了基于UIExtension实现简单的分享功能。支持取消分享，点击“返回Share”按钮，返回调用方应用；支持完成分享，点击“留在文本应用”按钮，留在当前文本应用。 | ArkTS | + +请访问[Samples](https://gitee.com/openharmony/applications_app_samples)仓了解更多信息。 + + +## 修复缺陷列表 + +**表4** 修复缺陷ISSUE列表 + +| ISSUE单 | 问题描述 | +| -------- | -------- | +| I6U4ZT | 拍照后立刻断电源，图库的第一张图片点击打不开。 | +| I79752 | 中概率由进程com.ohos.smartperf下的.ohos.smartperf线程导致libark_jsruntime.so出现cppcrash。 | +| I79P3K | 低概率由进程com.ohos.callui导致jscrash，栈名：onDestroy。 | +| I79TCB | 低概率由进程com.ohos.note下的VizCompositorTh线程导致libweb_engine.soTh出现cppcrash。 | +| I78CBC | 反复进入某相册的图片宫格浏览界面，导致libace.z.so出现内存泄露。 | +| I78CH7 | 反复在dock栏添加/移除应用，导致libace.z.so出现内存泄露。 | + + +## 遗留缺陷列表 + +**表5** 遗留缺陷列表 + +| ISSUE | 问题描述 | 影响 | 计划解决日期 | +| -------- | -------- | -------- | -------- | +| I78C9W | 反复进入大图浏览界面后返回，导致libace.z.so出现内存泄露。 | 非常用场景，应用重启后泄露问题消失，影响可控。 | 2023年8月30日 | +| I7BF3M | 长时间运行测试，launcher进程概率性出现appfreeze，原因是STRINGID:APPLICATION_BLOCK_INPUT卡在libeventhandler.z.so。 | 该问题不会引起系统重启，整体影响可控。 | 2023年8月30日 | +| I7M51R | 低概率出现进程com.ohos.systemui下的线程render_service出现cppcrash。 | 低概率问题，且render_service进程出现cppcrash后，系统会自动重新启动render_service进程，对业务影响可控。 | 2023年8月30日 | +| I7NWF3 | 因兼容性问题，使用3.2.x版本的设备和4.0.x版本的设备通过Wi-Fi引导P2P连接时开启会话失败。 | 在使用4.0.x版本的设备间此问题不存在，影响可控。 | 2023年8月30日 | +| I7BOAO | 三方仓GLES3多个测试用例执行失败。 | 三方仓问题，厂商正在适配修改。 | 2023年8月30日 | \ No newline at end of file diff --git a/zh-cn/release-notes/api-diff/v4.0-beta2/Readme-CN.md b/zh-cn/release-notes/api-diff/v4.0-beta2/Readme-CN.md new file mode 100644 index 0000000000000000000000000000000000000000..0615e586b47d2deeb3332ac50259e31a9709adcc --- /dev/null +++ b/zh-cn/release-notes/api-diff/v4.0-beta2/Readme-CN.md @@ -0,0 +1,34 @@ +# Readme + +- [元能力](js-apidiff-ability.md) +- [帐号](js-apidiff-account.md) +- [AI](js-apidiff-ai.md) +- [应用](js-apidiff-application.md) +- [ArkUI](js-apidiff-arkui.md) +- [电源管理](js-apidiff-battery.md) +- [包管理](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-distributed-hardware.md) +- [上传下载](js-apidiff-download-upload.md) +- [驱动](js-apidiff-driver.md) +- [文件管理](js-apidiff-file-management.md) +- [位置服务](js-apidiff-geolocation.md) +- [全球化](js-apidiff-global.md) +- [Misc软件](js-apidiff-misc.md) +- [MSDP](js-apidiff-msdp.md) +- [多模输入](js-apidiff-multi-modal-input.md) +- [媒体](js-apidiff-multimedia.md) +- [事件通知](js-apidiff-notification.md) +- [资源调度](js-apidiff-resource-scheduler.md) +- [安全](js-apidiff-security.md) +- [泛Sensor](js-apidiff-sensor.md) +- [启动](js-apidiff-start-up.md) +- [电话服务](js-apidiff-telephony.md) +- [测试框架](js-apidiff-unitest.md) +- [USB](js-apidiff-usb.md) +- [Web](js-apidiff-web.md) +- [窗口](js-apidiff-window.md) diff --git a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-ability.md b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-ability.md index b09793d8a9a29aa8f0bba48e307bf3008888f30f..9c30bf21e5cd172e7190072c7dd8d4063b80b40a 100644 --- a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-ability.md +++ b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-ability.md @@ -744,69 +744,3 @@ |type有变化|类名：WantAgentInfo;
方法or属性：requestCode: number;
旧版本信息：|类名：WantAgentInfo;
方法or属性：requestCode: number;
新版本信息：number|wantAgentInfo.d.ts| |type有变化|类名：WantAgentInfo;
方法or属性：wantAgentFlags?: Array\;
旧版本信息：|类名：WantAgentInfo;
方法or属性：wantAgentFlags?: Array\;
新版本信息：?Array\|wantAgentInfo.d.ts| |type有变化|类名：WantAgentInfo;
方法or属性：extraInfo?: { [key: string]: any };
旧版本信息：|类名：WantAgentInfo;
方法or属性：extraInfo?: { [key: string]: any };
新版本信息：?object|wantAgentInfo.d.ts| -|跨平台能力有变化|类名：abilityDelegatorRegistry;
方法or属性：declare abilityDelegatorRegistry
旧版本信息：|类名：abilityDelegatorRegistry;
方法or属性：declare abilityDelegatorRegistry
新版本信息：crossplatform|@ohos.app.ability.abilityDelegatorRegistry.d.ts| -|跨平台能力有变化|类名：abilityDelegatorRegistry;
方法or属性：function getAbilityDelegator(): AbilityDelegator;
旧版本信息：|类名：abilityDelegatorRegistry;
方法or属性：function getAbilityDelegator(): AbilityDelegator;
新版本信息：crossplatform|@ohos.app.ability.abilityDelegatorRegistry.d.ts| -|跨平台能力有变化|类名：abilityDelegatorRegistry;
方法or属性：function getArguments(): AbilityDelegatorArgs;
旧版本信息：|类名：abilityDelegatorRegistry;
方法or属性：function getArguments(): AbilityDelegatorArgs;
新版本信息：crossplatform|@ohos.app.ability.abilityDelegatorRegistry.d.ts| -|跨平台能力有变化|类名：abilityDelegatorRegistry;
方法or属性：export type AbilityDelegator = _AbilityDelegator;
旧版本信息：|类名：abilityDelegatorRegistry;
方法or属性：export type AbilityDelegator = _AbilityDelegator;
新版本信息：crossplatform|@ohos.app.ability.abilityDelegatorRegistry.d.ts| -|跨平台能力有变化|类名：abilityDelegatorRegistry;
方法or属性：export type AbilityDelegatorArgs = _AbilityDelegatorArgs;
旧版本信息：|类名：abilityDelegatorRegistry;
方法or属性：export type AbilityDelegatorArgs = _AbilityDelegatorArgs;
新版本信息：crossplatform|@ohos.app.ability.abilityDelegatorRegistry.d.ts| -|跨平台能力有变化|类名：abilityDelegatorRegistry;
方法or属性：export type AbilityMonitor = _AbilityMonitor;
旧版本信息：|类名：abilityDelegatorRegistry;
方法or属性：export type AbilityMonitor = _AbilityMonitor;
新版本信息：crossplatform|@ohos.app.ability.abilityDelegatorRegistry.d.ts| -|跨平台能力有变化|类名：AbilityLifecycleState;
方法or属性：export enum AbilityLifecycleState
旧版本信息：|类名：AbilityLifecycleState;
方法or属性：export enum AbilityLifecycleState
新版本信息：crossplatform|@ohos.app.ability.abilityDelegatorRegistry.d.ts| -|跨平台能力有变化|类名：AbilityLifecycleState;
方法or属性：UNINITIALIZED
旧版本信息：|类名：AbilityLifecycleState;
方法or属性：UNINITIALIZED
新版本信息：crossplatform|@ohos.app.ability.abilityDelegatorRegistry.d.ts| -|跨平台能力有变化|类名：AbilityLifecycleState;
方法or属性：CREATE
旧版本信息：|类名：AbilityLifecycleState;
方法or属性：CREATE
新版本信息：crossplatform|@ohos.app.ability.abilityDelegatorRegistry.d.ts| -|跨平台能力有变化|类名：AbilityLifecycleState;
方法or属性：FOREGROUND
旧版本信息：|类名：AbilityLifecycleState;
方法or属性：FOREGROUND
新版本信息：crossplatform|@ohos.app.ability.abilityDelegatorRegistry.d.ts| -|跨平台能力有变化|类名：AbilityLifecycleState;
方法or属性：BACKGROUND
旧版本信息：|类名：AbilityLifecycleState;
方法or属性：BACKGROUND
新版本信息：crossplatform|@ohos.app.ability.abilityDelegatorRegistry.d.ts| -|跨平台能力有变化|类名：AbilityLifecycleState;
方法or属性：DESTROY
旧版本信息：|类名：AbilityLifecycleState;
方法or属性：DESTROY
新版本信息：crossplatform|@ohos.app.ability.abilityDelegatorRegistry.d.ts| -|跨平台能力有变化|类名：ColorMode;
方法or属性：COLOR_MODE_NOT_SET = -1
旧版本信息：|类名：ColorMode;
方法or属性：COLOR_MODE_NOT_SET = -1
新版本信息：crossplatform|@ohos.app.ability.ConfigurationConstant.d.ts| -|跨平台能力有变化|类名：ColorMode;
方法or属性：COLOR_MODE_DARK = 0
旧版本信息：|类名：ColorMode;
方法or属性：COLOR_MODE_DARK = 0
新版本信息：crossplatform|@ohos.app.ability.ConfigurationConstant.d.ts| -|跨平台能力有变化|类名：ColorMode;
方法or属性：COLOR_MODE_LIGHT = 1
旧版本信息：|类名：ColorMode;
方法or属性：COLOR_MODE_LIGHT = 1
新版本信息：crossplatform|@ohos.app.ability.ConfigurationConstant.d.ts| -|跨平台能力有变化|类名：Direction;
方法or属性：DIRECTION_NOT_SET = -1
旧版本信息：|类名：Direction;
方法or属性：DIRECTION_NOT_SET = -1
新版本信息：crossplatform|@ohos.app.ability.ConfigurationConstant.d.ts| -|跨平台能力有变化|类名：Direction;
方法or属性：DIRECTION_VERTICAL = 0
旧版本信息：|类名：Direction;
方法or属性：DIRECTION_VERTICAL = 0
新版本信息：crossplatform|@ohos.app.ability.ConfigurationConstant.d.ts| -|跨平台能力有变化|类名：Direction;
方法or属性：DIRECTION_HORIZONTAL = 1
旧版本信息：|类名：Direction;
方法or属性：DIRECTION_HORIZONTAL = 1
新版本信息：crossplatform|@ohos.app.ability.ConfigurationConstant.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：export interface AbilityDelegator
旧版本信息：|类名：AbilityDelegator;
方法or属性：export interface AbilityDelegator
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：addAbilityMonitor(monitor: AbilityMonitor, callback: AsyncCallback\): void;
旧版本信息：|类名：AbilityDelegator;
方法or属性：addAbilityMonitor(monitor: AbilityMonitor, callback: AsyncCallback\): void;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：addAbilityMonitor(monitor: AbilityMonitor): Promise\;
旧版本信息：|类名：AbilityDelegator;
方法or属性：addAbilityMonitor(monitor: AbilityMonitor): Promise\;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：addAbilityStageMonitor(monitor: AbilityStageMonitor, callback: AsyncCallback\): void;
旧版本信息：|类名：AbilityDelegator;
方法or属性：addAbilityStageMonitor(monitor: AbilityStageMonitor, callback: AsyncCallback\): void;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：addAbilityStageMonitor(monitor: AbilityStageMonitor): Promise\;
旧版本信息：|类名：AbilityDelegator;
方法or属性：addAbilityStageMonitor(monitor: AbilityStageMonitor): Promise\;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：removeAbilityMonitor(monitor: AbilityMonitor, callback: AsyncCallback\): void;
旧版本信息：|类名：AbilityDelegator;
方法or属性：removeAbilityMonitor(monitor: AbilityMonitor, callback: AsyncCallback\): void;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：removeAbilityMonitor(monitor: AbilityMonitor): Promise\;
旧版本信息：|类名：AbilityDelegator;
方法or属性：removeAbilityMonitor(monitor: AbilityMonitor): Promise\;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：removeAbilityStageMonitor(monitor: AbilityStageMonitor, callback: AsyncCallback\): void;
旧版本信息：|类名：AbilityDelegator;
方法or属性：removeAbilityStageMonitor(monitor: AbilityStageMonitor, callback: AsyncCallback\): void;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：removeAbilityStageMonitor(monitor: AbilityStageMonitor): Promise\;
旧版本信息：|类名：AbilityDelegator;
方法or属性：removeAbilityStageMonitor(monitor: AbilityStageMonitor): Promise\;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：waitAbilityMonitor(monitor: AbilityMonitor, callback: AsyncCallback\): void;
旧版本信息：|类名：AbilityDelegator;
方法or属性：waitAbilityMonitor(monitor: AbilityMonitor, callback: AsyncCallback\): void;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：waitAbilityMonitor(monitor: AbilityMonitor, timeout: number, callback: AsyncCallback\): void;
旧版本信息：|类名：AbilityDelegator;
方法or属性：waitAbilityMonitor(monitor: AbilityMonitor, timeout: number, callback: AsyncCallback\): void;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：waitAbilityMonitor(monitor: AbilityMonitor, timeout?: number): Promise\;
旧版本信息：|类名：AbilityDelegator;
方法or属性：waitAbilityMonitor(monitor: AbilityMonitor, timeout?: number): Promise\;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：waitAbilityStageMonitor(monitor: AbilityStageMonitor, callback: AsyncCallback\): void;
旧版本信息：|类名：AbilityDelegator;
方法or属性：waitAbilityStageMonitor(monitor: AbilityStageMonitor, callback: AsyncCallback\): void;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：waitAbilityStageMonitor(monitor: AbilityStageMonitor, timeout: number, callback: AsyncCallback\): void;
旧版本信息：|类名：AbilityDelegator;
方法or属性：waitAbilityStageMonitor(monitor: AbilityStageMonitor, timeout: number, callback: AsyncCallback\): void;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：waitAbilityStageMonitor(monitor: AbilityStageMonitor, timeout?: number): Promise\;
旧版本信息：|类名：AbilityDelegator;
方法or属性：waitAbilityStageMonitor(monitor: AbilityStageMonitor, timeout?: number): Promise\;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：getAppContext(): Context;
旧版本信息：|类名：AbilityDelegator;
方法or属性：getAppContext(): Context;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：getAbilityState(ability: UIAbility): number;
旧版本信息：|类名：AbilityDelegator;
方法or属性：getAbilityState(ability: UIAbility): number;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：getCurrentTopAbility(callback: AsyncCallback\): void;
旧版本信息：|类名：AbilityDelegator;
方法or属性：getCurrentTopAbility(callback: AsyncCallback\): void;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：getCurrentTopAbility(): Promise\;
旧版本信息：|类名：AbilityDelegator;
方法or属性：getCurrentTopAbility(): Promise\;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：startAbility(want: Want, callback: AsyncCallback\): void;
旧版本信息：|类名：AbilityDelegator;
方法or属性：startAbility(want: Want, callback: AsyncCallback\): void;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：startAbility(want: Want): Promise\;
旧版本信息：|类名：AbilityDelegator;
方法or属性：startAbility(want: Want): Promise\;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：doAbilityForeground(ability: UIAbility, callback: AsyncCallback\): void;
旧版本信息：|类名：AbilityDelegator;
方法or属性：doAbilityForeground(ability: UIAbility, callback: AsyncCallback\): void;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：doAbilityForeground(ability: UIAbility): Promise\;
旧版本信息：|类名：AbilityDelegator;
方法or属性：doAbilityForeground(ability: UIAbility): Promise\;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：doAbilityBackground(ability: UIAbility, callback: AsyncCallback\): void;
旧版本信息：|类名：AbilityDelegator;
方法or属性：doAbilityBackground(ability: UIAbility, callback: AsyncCallback\): void;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：doAbilityBackground(ability: UIAbility): Promise\;
旧版本信息：|类名：AbilityDelegator;
方法or属性：doAbilityBackground(ability: UIAbility): Promise\;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：print(msg: string, callback: AsyncCallback\): void;
旧版本信息：|类名：AbilityDelegator;
方法or属性：print(msg: string, callback: AsyncCallback\): void;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：print(msg: string): Promise\;
旧版本信息：|类名：AbilityDelegator;
方法or属性：print(msg: string): Promise\;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：printSync(msg: string): void;
旧版本信息：|类名：AbilityDelegator;
方法or属性：printSync(msg: string): void;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：finishTest(msg: string, code: number, callback: AsyncCallback\): void;
旧版本信息：|类名：AbilityDelegator;
方法or属性：finishTest(msg: string, code: number, callback: AsyncCallback\): void;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegator;
方法or属性：finishTest(msg: string, code: number): Promise\;
旧版本信息：|类名：AbilityDelegator;
方法or属性：finishTest(msg: string, code: number): Promise\;
新版本信息：crossplatform|AbilityDelegator.d.ts| -|跨平台能力有变化|类名：AbilityDelegatorArgs;
方法or属性：export interface AbilityDelegatorArgs
旧版本信息：|类名：AbilityDelegatorArgs;
方法or属性：export interface AbilityDelegatorArgs
新版本信息：crossplatform|abilityDelegatorArgs.d.ts| -|跨平台能力有变化|类名：AbilityDelegatorArgs;
方法or属性：bundleName: string;
旧版本信息：|类名：AbilityDelegatorArgs;
方法or属性：bundleName: string;
新版本信息：crossplatform|abilityDelegatorArgs.d.ts| -|跨平台能力有变化|类名：AbilityDelegatorArgs;
方法or属性：parameters: { [key: string]: string };
旧版本信息：|类名：AbilityDelegatorArgs;
方法or属性：parameters: { [key: string]: string };
新版本信息：crossplatform|abilityDelegatorArgs.d.ts| -|跨平台能力有变化|类名：AbilityDelegatorArgs;
方法or属性：testCaseNames: string;
旧版本信息：|类名：AbilityDelegatorArgs;
方法or属性：testCaseNames: string;
新版本信息：crossplatform|abilityDelegatorArgs.d.ts| -|跨平台能力有变化|类名：AbilityDelegatorArgs;
方法or属性：testRunnerClassName: string;
旧版本信息：|类名：AbilityDelegatorArgs;
方法or属性：testRunnerClassName: string;
新版本信息：crossplatform|abilityDelegatorArgs.d.ts| -|跨平台能力有变化|类名：AbilityMonitor;
方法or属性：export interface AbilityMonitor
旧版本信息：|类名：AbilityMonitor;
方法or属性：export interface AbilityMonitor
新版本信息：crossplatform|AbilityMonitor.d.ts| -|跨平台能力有变化|类名：AbilityMonitor;
方法or属性：abilityName: string;
旧版本信息：|类名：AbilityMonitor;
方法or属性：abilityName: string;
新版本信息：crossplatform|AbilityMonitor.d.ts| -|跨平台能力有变化|类名：AbilityMonitor;
方法or属性：moduleName?: string;
旧版本信息：|类名：AbilityMonitor;
方法or属性：moduleName?: string;
新版本信息：crossplatform|AbilityMonitor.d.ts| -|跨平台能力有变化|类名：AbilityMonitor;
方法or属性：onAbilityCreate?: (ability: UIAbility) => void;
旧版本信息：|类名：AbilityMonitor;
方法or属性：onAbilityCreate?: (ability: UIAbility) => void;
新版本信息：crossplatform|AbilityMonitor.d.ts| -|跨平台能力有变化|类名：AbilityMonitor;
方法or属性：onAbilityForeground?: (ability: UIAbility) => void;
旧版本信息：|类名：AbilityMonitor;
方法or属性：onAbilityForeground?: (ability: UIAbility) => void;
新版本信息：crossplatform|AbilityMonitor.d.ts| -|跨平台能力有变化|类名：AbilityMonitor;
方法or属性：onAbilityBackground?: (ability: UIAbility) => void;
旧版本信息：|类名：AbilityMonitor;
方法or属性：onAbilityBackground?: (ability: UIAbility) => void;
新版本信息：crossplatform|AbilityMonitor.d.ts| -|跨平台能力有变化|类名：AbilityMonitor;
方法or属性：onAbilityDestroy?: (ability: UIAbility) => void;
旧版本信息：|类名：AbilityMonitor;
方法or属性：onAbilityDestroy?: (ability: UIAbility) => void;
新版本信息：crossplatform|AbilityMonitor.d.ts| -|跨平台能力有变化|类名：AbilityMonitor;
方法or属性：onWindowStageCreate?: (ability: UIAbility) => void;
旧版本信息：|类名：AbilityMonitor;
方法or属性：onWindowStageCreate?: (ability: UIAbility) => void;
新版本信息：crossplatform|AbilityMonitor.d.ts| -|跨平台能力有变化|类名：AbilityMonitor;
方法or属性：onWindowStageDestroy?: (ability: UIAbility) => void;
旧版本信息：|类名：AbilityMonitor;
方法or属性：onWindowStageDestroy?: (ability: UIAbility) => void;
新版本信息：crossplatform|AbilityMonitor.d.ts| -|跨平台能力有变化|类名：AbilityStageMonitor;
方法or属性：export interface AbilityStageMonitor
旧版本信息：|类名：AbilityStageMonitor;
方法or属性：export interface AbilityStageMonitor
新版本信息：crossplatform|AbilityStageMonitor.d.ts| -|跨平台能力有变化|类名：AbilityStageMonitor;
方法or属性：moduleName: string;
旧版本信息：|类名：AbilityStageMonitor;
方法or属性：moduleName: string;
新版本信息：crossplatform|AbilityStageMonitor.d.ts| -|跨平台能力有变化|类名：AbilityStageMonitor;
方法or属性：srcEntrance: string;
旧版本信息：|类名：AbilityStageMonitor;
方法or属性：srcEntrance: string;
新版本信息：crossplatform|AbilityStageMonitor.d.ts| -|跨平台能力有变化|类名：UIAbilityContext;
方法or属性：config: Configuration;
旧版本信息：|类名：UIAbilityContext;
方法or属性：config: Configuration;
新版本信息：crossplatform|UIAbilityContext.d.ts| diff --git a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-arkui.md b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-arkui.md index 8f3a23c3e1e35d05332ae00ba4a90899490dc4a4..ef29755ca928791e091909e0034b02c4592a28ab 100644 --- a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-arkui.md +++ b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-arkui.md @@ -831,51 +831,3 @@ |卡片应用支持性有变化|类名：ClickEvent;
方法or属性：screenX: number;
旧版本信息：form|类名：ClickEvent;
方法or属性：screenX: number;
新版本信息：|common.d.ts| |卡片应用支持性有变化|类名：ClickEvent;
方法or属性：screenY: number;
旧版本信息：form|类名：ClickEvent;
方法or属性：screenY: number;
新版本信息：|common.d.ts| |卡片应用支持性有变化|类名：TextAttribute;
方法or属性：textShadow(value: ShadowOptions): TextAttribute;
旧版本信息：|类名：TextAttribute;
方法or属性：textShadow(value: ShadowOptions): TextAttribute;
新版本信息：form|text.d.ts| -|跨平台能力有变化|类名：componentSnapshot;
方法or属性：declare componentSnapshot
旧版本信息：|类名：componentSnapshot;
方法or属性：declare componentSnapshot
新版本信息：crossplatform|@ohos.arkui.componentSnapshot.d.ts| -|跨平台能力有变化|类名：componentSnapshot;
方法or属性：function get(id: string, callback: AsyncCallback\): void;
旧版本信息：|类名：componentSnapshot;
方法or属性：function get(id: string, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.arkui.componentSnapshot.d.ts| -|跨平台能力有变化|类名：componentSnapshot;
方法or属性：function get(id: string): Promise\;
旧版本信息：|类名：componentSnapshot;
方法or属性：function get(id: string): Promise\;
新版本信息：crossplatform|@ohos.arkui.componentSnapshot.d.ts| -|跨平台能力有变化|类名：componentSnapshot;
方法or属性：function createFromBuilder(builder: CustomBuilder, callback: AsyncCallback\): void;
旧版本信息：|类名：componentSnapshot;
方法or属性：function createFromBuilder(builder: CustomBuilder, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.arkui.componentSnapshot.d.ts| -|跨平台能力有变化|类名：componentSnapshot;
方法or属性：function createFromBuilder(builder: CustomBuilder): Promise\;
旧版本信息：|类名：componentSnapshot;
方法or属性：function createFromBuilder(builder: CustomBuilder): Promise\;
新版本信息：crossplatform|@ohos.arkui.componentSnapshot.d.ts| -|跨平台能力有变化|类名：matrix4;
方法or属性：function copy(): Matrix4Transit;
旧版本信息：crossplatform|类名：matrix4;
方法or属性：function copy(): Matrix4Transit;
新版本信息：|@ohos.matrix4.d.ts| -|跨平台能力有变化|类名：matrix4;
方法or属性：function invert(): Matrix4Transit;
旧版本信息：crossplatform|类名：matrix4;
方法or属性：function invert(): Matrix4Transit;
新版本信息：|@ohos.matrix4.d.ts| -|跨平台能力有变化|类名：matrix4;
方法or属性：function combine(options: Matrix4Transit): Matrix4Transit;
旧版本信息：crossplatform|类名：matrix4;
方法or属性：function combine(options: Matrix4Transit): Matrix4Transit;
新版本信息：|@ohos.matrix4.d.ts| -|跨平台能力有变化|类名：matrix4;
方法or属性：function translate(options: TranslateOption): Matrix4Transit;
旧版本信息：crossplatform|类名：matrix4;
方法or属性：function translate(options: TranslateOption): Matrix4Transit;
新版本信息：|@ohos.matrix4.d.ts| -|跨平台能力有变化|类名：matrix4;
方法or属性：function scale(options: ScaleOption): Matrix4Transit;
旧版本信息：crossplatform|类名：matrix4;
方法or属性：function scale(options: ScaleOption): Matrix4Transit;
新版本信息：|@ohos.matrix4.d.ts| -|跨平台能力有变化|类名：matrix4;
方法or属性：function rotate(options: RotateOption): Matrix4Transit;
旧版本信息：crossplatform|类名：matrix4;
方法or属性：function rotate(options: RotateOption): Matrix4Transit;
新版本信息：|@ohos.matrix4.d.ts| -|跨平台能力有变化|类名：matrix4;
方法or属性：function transformPoint(options: [number, number]): [number, number];
旧版本信息：crossplatform|类名：matrix4;
方法or属性：function transformPoint(options: [number, number]): [number, number];
新版本信息：|@ohos.matrix4.d.ts| -|跨平台能力有变化|类名：CanvasRenderer;
方法or属性：getTransform(): Matrix2D;
旧版本信息：|类名：CanvasRenderer;
方法or属性：getTransform(): Matrix2D;
新版本信息：crossplatform|canvas.d.ts| -|跨平台能力有变化|类名：CanvasRenderer;
方法or属性：setTransform(a: number, b: number, c: number, d: number, e: number, f: number): void;
旧版本信息：|类名：CanvasRenderer;
方法or属性：setTransform(a: number, b: number, c: number, d: number, e: number, f: number): void;
新版本信息：crossplatform|canvas.d.ts| -|跨平台能力有变化|类名：CanvasRenderer;
方法or属性：setTransform(transform?: Matrix2D): void;
旧版本信息：|类名：CanvasRenderer;
方法or属性：setTransform(transform?: Matrix2D): void;
新版本信息：crossplatform|canvas.d.ts| -|跨平台能力有变化|类名：AlignRuleOption;
方法or属性：bottom?: { anchor: string, align: VerticalAlign };
旧版本信息：crossplatform|类名：AlignRuleOption;
方法or属性：bottom?: { anchor: string, align: VerticalAlign };
新版本信息：|common.d.ts| -|跨平台能力有变化|类名：ClickEvent;
方法or属性：screenX: number;
旧版本信息：crossplatform|类名：ClickEvent;
方法or属性：screenX: number;
新版本信息：|common.d.ts| -|跨平台能力有变化|类名：MouseEvent;
方法or属性：screenX: number;
旧版本信息：crossplatform|类名：MouseEvent;
方法or属性：screenX: number;
新版本信息：|common.d.ts| -|跨平台能力有变化|类名：TouchObject;
方法or属性：screenX: number;
旧版本信息：crossplatform|类名：TouchObject;
方法or属性：screenX: number;
新版本信息：|common.d.ts| -|跨平台能力有变化|类名：ClickEvent;
方法or属性：screenY: number;
旧版本信息：crossplatform|类名：ClickEvent;
方法or属性：screenY: number;
新版本信息：|common.d.ts| -|跨平台能力有变化|类名：MouseEvent;
方法or属性：screenY: number;
旧版本信息：crossplatform|类名：MouseEvent;
方法or属性：screenY: number;
新版本信息：|common.d.ts| -|跨平台能力有变化|类名：TouchObject;
方法or属性：screenY: number;
旧版本信息：crossplatform|类名：TouchObject;
方法or属性：screenY: number;
新版本信息：|common.d.ts| -|跨平台能力有变化|类名：DragEvent;
方法or属性：getX(): number;
旧版本信息：crossplatform|类名：DragEvent;
方法or属性：getX(): number;
新版本信息：|common.d.ts| -|跨平台能力有变化|类名：DragEvent;
方法or属性：getY(): number;
旧版本信息：crossplatform|类名：DragEvent;
方法or属性：getY(): number;
新版本信息：|common.d.ts| -|跨平台能力有变化|类名：AppStorage;
方法or属性：static Link(propName: string): any;
旧版本信息：crossplatform|类名：AppStorage;
方法or属性：static Link(propName: string): any;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：AppStorage;
方法or属性：static SetAndLink\(propName: string, defaultValue: T): SubscribedAbstractProperty\;
旧版本信息：crossplatform|类名：AppStorage;
方法or属性：static SetAndLink\(propName: string, defaultValue: T): SubscribedAbstractProperty\;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：AppStorage;
方法or属性：static Prop(propName: string): any;
旧版本信息：crossplatform|类名：AppStorage;
方法or属性：static Prop(propName: string): any;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：AppStorage;
方法or属性：static SetAndProp\(propName: string, defaultValue: S): SubscribedAbstractProperty\;
旧版本信息：crossplatform|类名：AppStorage;
方法or属性：static SetAndProp\(propName: string, defaultValue: S): SubscribedAbstractProperty\;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：AppStorage;
方法or属性：static Has(propName: string): boolean;
旧版本信息：crossplatform|类名：AppStorage;
方法or属性：static Has(propName: string): boolean;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：AppStorage;
方法or属性：static Get\(propName: string): T \| undefined;
旧版本信息：crossplatform|类名：AppStorage;
方法or属性：static Get\(propName: string): T \| undefined;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：AppStorage;
方法or属性：static Set\(propName: string, newValue: T): boolean;
旧版本信息：crossplatform|类名：AppStorage;
方法or属性：static Set\(propName: string, newValue: T): boolean;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：AppStorage;
方法or属性：static SetOrCreate\(propName: string, newValue: T): void;
旧版本信息：crossplatform|类名：AppStorage;
方法or属性：static SetOrCreate\(propName: string, newValue: T): void;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：AppStorage;
方法or属性：static Delete(propName: string): boolean;
旧版本信息：crossplatform|类名：AppStorage;
方法or属性：static Delete(propName: string): boolean;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：AppStorage;
方法or属性：static Keys(): IterableIterator\;
旧版本信息：crossplatform|类名：AppStorage;
方法or属性：static Keys(): IterableIterator\;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：AppStorage;
方法or属性：static Clear(): boolean;
旧版本信息：crossplatform|类名：AppStorage;
方法or属性：static Clear(): boolean;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：AppStorage;
方法or属性：static IsMutable(propName: string): boolean;
旧版本信息：crossplatform|类名：AppStorage;
方法or属性：static IsMutable(propName: string): boolean;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：AppStorage;
方法or属性：static Size(): number;
旧版本信息：crossplatform|类名：AppStorage;
方法or属性：static Size(): number;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：Environment;
方法or属性：static EnvProp\(key: string, value: S): boolean;
旧版本信息：crossplatform|类名：Environment;
方法or属性：static EnvProp\(key: string, value: S): boolean;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：Environment;
方法or属性：static EnvProps(
props: {
key: string;
defaultValue: any;
}[],
): void;
旧版本信息：crossplatform|类名：Environment;
方法or属性：static EnvProps(
props: {
key: string;
defaultValue: any;
}[],
): void;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：Environment;
方法or属性：static Keys(): Array\;
旧版本信息：crossplatform|类名：Environment;
方法or属性：static Keys(): Array\;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：PersistentStorage;
方法or属性：static Keys(): Array\;
旧版本信息：crossplatform|类名：PersistentStorage;
方法or属性：static Keys(): Array\;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：PersistentStorage;
方法or属性：static PersistProp\(key: string, defaultValue: T): void;
旧版本信息：crossplatform|类名：PersistentStorage;
方法or属性：static PersistProp\(key: string, defaultValue: T): void;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：PersistentStorage;
方法or属性：static DeleteProp(key: string): void;
旧版本信息：crossplatform|类名：PersistentStorage;
方法or属性：static DeleteProp(key: string): void;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：PersistentStorage;
方法or属性：static PersistProps(
properties: {
key: string;
defaultValue: any;
}[],
): void;
旧版本信息：crossplatform|类名：PersistentStorage;
方法or属性：static PersistProps(
properties: {
key: string;
defaultValue: any;
}[],
): void;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：LocalStorage;
方法or属性：static GetShared(): LocalStorage;
旧版本信息：crossplatform|类名：LocalStorage;
方法or属性：static GetShared(): LocalStorage;
新版本信息：|common_ts_ets_api.d.ts| -|跨平台能力有变化|类名：ListItemInterface;
方法or属性：(value?: string): ListItemAttribute;
旧版本信息：crossplatform|类名：ListItemInterface;
方法or属性：(value?: string): ListItemAttribute;
新版本信息：|list_item.d.ts| -|跨平台能力有变化|类名：NavigationAttribute;
方法or属性：toolBar(value: object \| CustomBuilder): NavigationAttribute;
旧版本信息：crossplatform|类名：NavigationAttribute;
方法or属性：toolBar(value: object \| CustomBuilder): NavigationAttribute;
新版本信息：|navigation.d.ts| -|跨平台能力有变化|类名：Scroller;
方法or属性：scrollToIndex(value: number, smooth?:boolean, align?: ScrollAlign);
旧版本信息：|类名：Scroller;
方法or属性：scrollToIndex(value: number, smooth?:boolean, align?: ScrollAlign);
新版本信息：crossplatform|scroll.d.ts| diff --git a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-bundle.md b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-bundle.md index d2adc46d1d07299c107deadd2a90b14e7b9ba67c..5cd82fa61b1a6f5e68bb5ab2d8498e3b184a924a 100644 --- a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-bundle.md +++ b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-bundle.md @@ -36,7 +36,3 @@ |model有变化|类名：AbilityType;
方法or属性：PAGE = 1
旧版本信息：|类名：AbilityType;
方法or属性：PAGE = 1
新版本信息：FAModelOnly|@ohos.bundle.bundleManager.d.ts| |model有变化|类名：AbilityType;
方法or属性：SERVICE = 2
旧版本信息：|类名：AbilityType;
方法or属性：SERVICE = 2
新版本信息：FAModelOnly|@ohos.bundle.bundleManager.d.ts| |model有变化|类名：AbilityType;
方法or属性：DATA = 3
旧版本信息：|类名：AbilityType;
方法or属性：DATA = 3
新版本信息：FAModelOnly|@ohos.bundle.bundleManager.d.ts| -|跨平台能力有变化|类名：Metadata;
方法or属性：export interface Metadata
旧版本信息：|类名：Metadata;
方法or属性：export interface Metadata
新版本信息：crossplatform|Metadata.d.ts| -|跨平台能力有变化|类名：Metadata;
方法or属性：name: string;
旧版本信息：|类名：Metadata;
方法or属性：name: string;
新版本信息：crossplatform|Metadata.d.ts| -|跨平台能力有变化|类名：Metadata;
方法or属性：value: string;
旧版本信息：|类名：Metadata;
方法or属性：value: string;
新版本信息：crossplatform|Metadata.d.ts| -|跨平台能力有变化|类名：Metadata;
方法or属性：resource: string;
旧版本信息：|类名：Metadata;
方法or属性：resource: string;
新版本信息：crossplatform|Metadata.d.ts| diff --git a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-communication.md b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-communication.md index 3b0abda9841d860becc92f28794115130d553d79..fb0d1874ffba73fc92357da2d4a8032c61c47146 100644 --- a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-communication.md +++ b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-communication.md @@ -603,106 +603,3 @@ |type有变化|类名：NetworkResponse;
方法or属性：type: string;
旧版本信息：|类名：NetworkResponse;
方法or属性：type: string;
新版本信息：string|@system.network.d.ts| |type有变化|类名：NetworkResponse;
方法or属性：metered: boolean;
旧版本信息：|类名：NetworkResponse;
方法or属性：metered: boolean;
新版本信息：boolean|@system.network.d.ts| |函数有变化|类名：HotspotConfig;
方法or属性：channel: number;|类名：HotspotConfig;
方法or属性：channel?: number;|@ohos.wifiManager.d.ts| -|跨平台能力有变化|类名：connection;
方法or属性：function hasDefaultNet(): Promise\;
旧版本信息：|类名：connection;
方法or属性：function hasDefaultNet(): Promise\;
新版本信息：crossplatform|@ohos.net.connection.d.ts| -|跨平台能力有变化|类名：NetConnection;
方法or属性：export interface NetConnection
旧版本信息：|类名：NetConnection;
方法or属性：export interface NetConnection
新版本信息：crossplatform|@ohos.net.connection.d.ts| -|跨平台能力有变化|类名：http;
方法or属性：declare http
旧版本信息：|类名：http;
方法or属性：declare http
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：HttpRequestOptions;
方法or属性：export interface HttpRequestOptions
旧版本信息：|类名：HttpRequestOptions;
方法or属性：export interface HttpRequestOptions
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：HttpRequest;
方法or属性：export interface HttpRequest
旧版本信息：|类名：HttpRequest;
方法or属性：export interface HttpRequest
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：HttpRequest;
方法or属性：request(url: string, options: HttpRequestOptions, callback: AsyncCallback\): void;
旧版本信息：|类名：HttpRequest;
方法or属性：request(url: string, options: HttpRequestOptions, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：HttpRequest;
方法or属性：request(url: string, options?: HttpRequestOptions): Promise\;
旧版本信息：|类名：HttpRequest;
方法or属性：request(url: string, options?: HttpRequestOptions): Promise\;
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：RequestMethod;
方法or属性：OPTIONS = "OPTIONS"
旧版本信息：|类名：RequestMethod;
方法or属性：OPTIONS = "OPTIONS"
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：RequestMethod;
方法or属性：GET = "GET"
旧版本信息：|类名：RequestMethod;
方法or属性：GET = "GET"
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：RequestMethod;
方法or属性：HEAD = "HEAD"
旧版本信息：|类名：RequestMethod;
方法or属性：HEAD = "HEAD"
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：RequestMethod;
方法or属性：POST = "POST"
旧版本信息：|类名：RequestMethod;
方法or属性：POST = "POST"
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：RequestMethod;
方法or属性：PUT = "PUT"
旧版本信息：|类名：RequestMethod;
方法or属性：PUT = "PUT"
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：RequestMethod;
方法or属性：DELETE = "DELETE"
旧版本信息：|类名：RequestMethod;
方法or属性：DELETE = "DELETE"
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：RequestMethod;
方法or属性：TRACE = "TRACE"
旧版本信息：|类名：RequestMethod;
方法or属性：TRACE = "TRACE"
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：RequestMethod;
方法or属性：CONNECT = "CONNECT"
旧版本信息：|类名：RequestMethod;
方法or属性：CONNECT = "CONNECT"
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：OK = 200
旧版本信息：|类名：ResponseCode;
方法or属性：OK = 200
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：CREATED
旧版本信息：|类名：ResponseCode;
方法or属性：CREATED
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：ACCEPTED
旧版本信息：|类名：ResponseCode;
方法or属性：ACCEPTED
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：NOT_AUTHORITATIVE
旧版本信息：|类名：ResponseCode;
方法or属性：NOT_AUTHORITATIVE
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：NO_CONTENT
旧版本信息：|类名：ResponseCode;
方法or属性：NO_CONTENT
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：RESET
旧版本信息：|类名：ResponseCode;
方法or属性：RESET
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：PARTIAL
旧版本信息：|类名：ResponseCode;
方法or属性：PARTIAL
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：MULT_CHOICE = 300
旧版本信息：|类名：ResponseCode;
方法or属性：MULT_CHOICE = 300
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：MOVED_PERM
旧版本信息：|类名：ResponseCode;
方法or属性：MOVED_PERM
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：MOVED_TEMP
旧版本信息：|类名：ResponseCode;
方法or属性：MOVED_TEMP
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：SEE_OTHER
旧版本信息：|类名：ResponseCode;
方法or属性：SEE_OTHER
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：NOT_MODIFIED
旧版本信息：|类名：ResponseCode;
方法or属性：NOT_MODIFIED
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：USE_PROXY
旧版本信息：|类名：ResponseCode;
方法or属性：USE_PROXY
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：BAD_REQUEST = 400
旧版本信息：|类名：ResponseCode;
方法or属性：BAD_REQUEST = 400
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：UNAUTHORIZED
旧版本信息：|类名：ResponseCode;
方法or属性：UNAUTHORIZED
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：PAYMENT_REQUIRED
旧版本信息：|类名：ResponseCode;
方法or属性：PAYMENT_REQUIRED
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：FORBIDDEN
旧版本信息：|类名：ResponseCode;
方法or属性：FORBIDDEN
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：NOT_FOUND
旧版本信息：|类名：ResponseCode;
方法or属性：NOT_FOUND
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：BAD_METHOD
旧版本信息：|类名：ResponseCode;
方法or属性：BAD_METHOD
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：NOT_ACCEPTABLE
旧版本信息：|类名：ResponseCode;
方法or属性：NOT_ACCEPTABLE
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：PROXY_AUTH
旧版本信息：|类名：ResponseCode;
方法or属性：PROXY_AUTH
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：CLIENT_TIMEOUT
旧版本信息：|类名：ResponseCode;
方法or属性：CLIENT_TIMEOUT
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：CONFLICT
旧版本信息：|类名：ResponseCode;
方法or属性：CONFLICT
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：GONE
旧版本信息：|类名：ResponseCode;
方法or属性：GONE
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：LENGTH_REQUIRED
旧版本信息：|类名：ResponseCode;
方法or属性：LENGTH_REQUIRED
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：PRECON_FAILED
旧版本信息：|类名：ResponseCode;
方法or属性：PRECON_FAILED
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：ENTITY_TOO_LARGE
旧版本信息：|类名：ResponseCode;
方法or属性：ENTITY_TOO_LARGE
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：REQ_TOO_LONG
旧版本信息：|类名：ResponseCode;
方法or属性：REQ_TOO_LONG
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：UNSUPPORTED_TYPE
旧版本信息：|类名：ResponseCode;
方法or属性：UNSUPPORTED_TYPE
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：INTERNAL_ERROR = 500
旧版本信息：|类名：ResponseCode;
方法or属性：INTERNAL_ERROR = 500
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：NOT_IMPLEMENTED
旧版本信息：|类名：ResponseCode;
方法or属性：NOT_IMPLEMENTED
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：BAD_GATEWAY
旧版本信息：|类名：ResponseCode;
方法or属性：BAD_GATEWAY
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：UNAVAILABLE
旧版本信息：|类名：ResponseCode;
方法or属性：UNAVAILABLE
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：GATEWAY_TIMEOUT
旧版本信息：|类名：ResponseCode;
方法or属性：GATEWAY_TIMEOUT
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：ResponseCode;
方法or属性：VERSION
旧版本信息：|类名：ResponseCode;
方法or属性：VERSION
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：HttpProtocol;
方法or属性：HTTP1_1
旧版本信息：|类名：HttpProtocol;
方法or属性：HTTP1_1
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：HttpProtocol;
方法or属性：HTTP2
旧版本信息：|类名：HttpProtocol;
方法or属性：HTTP2
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：HttpResponse;
方法or属性：export interface HttpResponse
旧版本信息：|类名：HttpResponse;
方法or属性：export interface HttpResponse
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：HttpResponseCache;
方法or属性：flush(): Promise\;
旧版本信息：|类名：HttpResponseCache;
方法or属性：flush(): Promise\;
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：HttpResponseCache;
方法or属性：delete(): Promise\;
旧版本信息：|类名：HttpResponseCache;
方法or属性：delete(): Promise\;
新版本信息：crossplatform|@ohos.net.http.d.ts| -|跨平台能力有变化|类名：socket;
方法or属性：declare socket
旧版本信息：|类名：socket;
方法or属性：declare socket
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：UDPSendOptions;
方法or属性：export interface UDPSendOptions
旧版本信息：|类名：UDPSendOptions;
方法or属性：export interface UDPSendOptions
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TLSConnectOptions;
方法or属性：address: NetAddress;
旧版本信息：|类名：TLSConnectOptions;
方法or属性：address: NetAddress;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：ExtraOptionsBase;
方法or属性：export interface ExtraOptionsBase
旧版本信息：|类名：ExtraOptionsBase;
方法or属性：export interface ExtraOptionsBase
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：UDPExtraOptions;
方法or属性：export interface UDPExtraOptions
旧版本信息：|类名：UDPExtraOptions;
方法or属性：export interface UDPExtraOptions
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：SocketStateBase;
方法or属性：export interface SocketStateBase
旧版本信息：|类名：SocketStateBase;
方法or属性：export interface SocketStateBase
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：SocketRemoteInfo;
方法or属性：export interface SocketRemoteInfo
旧版本信息：|类名：SocketRemoteInfo;
方法or属性：export interface SocketRemoteInfo
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：UDPSocket;
方法or属性：export interface UDPSocket
旧版本信息：|类名：UDPSocket;
方法or属性：export interface UDPSocket
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：UDPSocket;
方法or属性：bind(address: NetAddress): Promise\;
旧版本信息：|类名：UDPSocket;
方法or属性：bind(address: NetAddress): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TCPSocket;
方法or属性：bind(address: NetAddress): Promise\;
旧版本信息：|类名：TCPSocket;
方法or属性：bind(address: NetAddress): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TLSSocket;
方法or属性：bind(address: NetAddress): Promise\;
旧版本信息：|类名：TLSSocket;
方法or属性：bind(address: NetAddress): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：UDPSocket;
方法or属性：send(options: UDPSendOptions): Promise\;
旧版本信息：|类名：UDPSocket;
方法or属性：send(options: UDPSendOptions): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：UDPSocket;
方法or属性：close(): Promise\;
旧版本信息：|类名：UDPSocket;
方法or属性：close(): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TCPSocket;
方法or属性：close(): Promise\;
旧版本信息：|类名：TCPSocket;
方法or属性：close(): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TLSSocket;
方法or属性：close(): Promise\;
旧版本信息：|类名：TLSSocket;
方法or属性：close(): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：UDPSocket;
方法or属性：getState(): Promise\;
旧版本信息：|类名：UDPSocket;
方法or属性：getState(): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TCPSocket;
方法or属性：getState(): Promise\;
旧版本信息：|类名：TCPSocket;
方法or属性：getState(): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TLSSocket;
方法or属性：getState(): Promise\;
旧版本信息：|类名：TLSSocket;
方法or属性：getState(): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：UDPSocket;
方法or属性：setExtraOptions(options: UDPExtraOptions): Promise\;
旧版本信息：|类名：UDPSocket;
方法or属性：setExtraOptions(options: UDPExtraOptions): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TCPConnectOptions;
方法or属性：export interface TCPConnectOptions
旧版本信息：|类名：TCPConnectOptions;
方法or属性：export interface TCPConnectOptions
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TCPSendOptions;
方法or属性：export interface TCPSendOptions
旧版本信息：|类名：TCPSendOptions;
方法or属性：export interface TCPSendOptions
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TCPExtraOptions;
方法or属性：export interface TCPExtraOptions
旧版本信息：|类名：TCPExtraOptions;
方法or属性：export interface TCPExtraOptions
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TCPSocket;
方法or属性：export interface TCPSocket
旧版本信息：|类名：TCPSocket;
方法or属性：export interface TCPSocket
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TCPSocket;
方法or属性：connect(options: TCPConnectOptions): Promise\;
旧版本信息：|类名：TCPSocket;
方法or属性：connect(options: TCPConnectOptions): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TCPSocket;
方法or属性：send(options: TCPSendOptions): Promise\;
旧版本信息：|类名：TCPSocket;
方法or属性：send(options: TCPSendOptions): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TCPSocket;
方法or属性：getRemoteAddress(): Promise\;
旧版本信息：|类名：TCPSocket;
方法or属性：getRemoteAddress(): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TLSSocket;
方法or属性：getRemoteAddress(): Promise\;
旧版本信息：|类名：TLSSocket;
方法or属性：getRemoteAddress(): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TCPSocket;
方法or属性：setExtraOptions(options: TCPExtraOptions): Promise\;
旧版本信息：|类名：TCPSocket;
方法or属性：setExtraOptions(options: TCPExtraOptions): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TLSSocket;
方法or属性：setExtraOptions(options: TCPExtraOptions): Promise\;
旧版本信息：|类名：TLSSocket;
方法or属性：setExtraOptions(options: TCPExtraOptions): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TLSSocket;
方法or属性：getCertificate(): Promise\;
旧版本信息：|类名：TLSSocket;
方法or属性：getCertificate(): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TLSSocket;
方法or属性：getRemoteCertificate(): Promise\;
旧版本信息：|类名：TLSSocket;
方法or属性：getRemoteCertificate(): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TLSSocket;
方法or属性：getProtocol(): Promise\;
旧版本信息：|类名：TLSSocket;
方法or属性：getProtocol(): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TLSSocket;
方法or属性：getCipherSuite(): Promise\>;
旧版本信息：|类名：TLSSocket;
方法or属性：getCipherSuite(): Promise\>;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TLSSocket;
方法or属性：getSignatureAlgorithms(): Promise\>;
旧版本信息：|类名：TLSSocket;
方法or属性：getSignatureAlgorithms(): Promise\>;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TLSSocket;
方法or属性：connect(options: TLSConnectOptions): Promise\;
旧版本信息：|类名：TLSSocket;
方法or属性：connect(options: TLSConnectOptions): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TLSSocket;
方法or属性：send(data: string): Promise\;
旧版本信息：|类名：TLSSocket;
方法or属性：send(data: string): Promise\;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：TLSConnectOptions;
方法or属性：secureOptions: TLSSecureOptions;
旧版本信息：|类名：TLSConnectOptions;
方法or属性：secureOptions: TLSSecureOptions;
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：Protocol;
方法or属性：TLSv12 = "TLSv1.2"
旧版本信息：|类名：Protocol;
方法or属性：TLSv12 = "TLSv1.2"
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：Protocol;
方法or属性：TLSv13 = "TLSv1.3"
旧版本信息：|类名：Protocol;
方法or属性：TLSv13 = "TLSv1.3"
新版本信息：crossplatform|@ohos.net.socket.d.ts| -|跨平台能力有变化|类名：webSocket;
方法or属性：declare webSocket
旧版本信息：|类名：webSocket;
方法or属性：declare webSocket
新版本信息：crossplatform|@ohos.net.webSocket.d.ts| -|跨平台能力有变化|类名：WebSocketRequestOptions;
方法or属性：export interface WebSocketRequestOptions
旧版本信息：|类名：WebSocketRequestOptions;
方法or属性：export interface WebSocketRequestOptions
新版本信息：crossplatform|@ohos.net.webSocket.d.ts| -|跨平台能力有变化|类名：WebSocketCloseOptions;
方法or属性：export interface WebSocketCloseOptions
旧版本信息：|类名：WebSocketCloseOptions;
方法or属性：export interface WebSocketCloseOptions
新版本信息：crossplatform|@ohos.net.webSocket.d.ts| -|跨平台能力有变化|类名：WebSocket;
方法or属性：export interface WebSocket
旧版本信息：|类名：WebSocket;
方法or属性：export interface WebSocket
新版本信息：crossplatform|@ohos.net.webSocket.d.ts| -|跨平台能力有变化|类名：WebSocket;
方法or属性：connect(url: string, options: WebSocketRequestOptions, callback: AsyncCallback\): void;
旧版本信息：|类名：WebSocket;
方法or属性：connect(url: string, options: WebSocketRequestOptions, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.net.webSocket.d.ts| -|跨平台能力有变化|类名：WebSocket;
方法or属性：connect(url: string, options?: WebSocketRequestOptions): Promise\;
旧版本信息：|类名：WebSocket;
方法or属性：connect(url: string, options?: WebSocketRequestOptions): Promise\;
新版本信息：crossplatform|@ohos.net.webSocket.d.ts| -|跨平台能力有变化|类名：WebSocket;
方法or属性：send(data: string \| ArrayBuffer): Promise\;
旧版本信息：|类名：WebSocket;
方法or属性：send(data: string \| ArrayBuffer): Promise\;
新版本信息：crossplatform|@ohos.net.webSocket.d.ts| -|跨平台能力有变化|类名：WebSocket;
方法or属性：close(options: WebSocketCloseOptions, callback: AsyncCallback\): void;
旧版本信息：|类名：WebSocket;
方法or属性：close(options: WebSocketCloseOptions, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.net.webSocket.d.ts| -|跨平台能力有变化|类名：WebSocket;
方法or属性：close(options?: WebSocketCloseOptions): Promise\;
旧版本信息：|类名：WebSocket;
方法or属性：close(options?: WebSocketCloseOptions): Promise\;
新版本信息：crossplatform|@ohos.net.webSocket.d.ts| diff --git a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-compiler-and-runtime.md b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-compiler-and-runtime.md index cc76efa8087990b94123d6f77b44e6e36df100ff..8c05191e4e22ecbeb75b700dc6445074a618dc90 100644 --- a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-compiler-and-runtime.md +++ b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-compiler-and-runtime.md @@ -49,57 +49,3 @@ |函数有变化|类名：Base64Helper;
方法or属性：decodeSync(src: Uint8Array \| string): Uint8Array;|类名：Base64Helper;
方法or属性：decodeSync(src: Uint8Array \| string, options?: Type): Uint8Array;|@ohos.util.d.ts| |函数有变化|类名：Base64Helper;
方法or属性：encodeToString(src: Uint8Array): Promise\;|类名：Base64Helper;
方法or属性：encodeToString(src: Uint8Array, options?: Type): Promise\;|@ohos.util.d.ts| |函数有变化|类名：Base64Helper;
方法or属性：decode(src: Uint8Array \| string): Promise\;|类名：Base64Helper;
方法or属性：decode(src: Uint8Array \| string, options?: Type): Promise\;|@ohos.util.d.ts| -|跨平台能力有变化|类名：buffer;
方法or属性：type BufferEncoding =
\| 'ascii'
\| 'utf8'
\| 'utf-8'
\| 'utf16le'
\| 'ucs2'
\| 'ucs-2'
\| 'base64'
\| 'base64url'
\| 'latin1'
\| 'binary'
\| 'hex';
旧版本信息：|类名：buffer;
方法or属性：type BufferEncoding =
\| 'ascii'
\| 'utf8'
\| 'utf-8'
\| 'utf16le'
\| 'ucs2'
\| 'ucs-2'
\| 'base64'
\| 'base64url'
\| 'latin1'
\| 'binary'
\| 'hex';
新版本信息：crossplatform|@ohos.buffer.d.ts| -|跨平台能力有变化|类名：TypedArray;
方法or属性：interface TypedArray
旧版本信息：|类名：TypedArray;
方法or属性：interface TypedArray
新版本信息：crossplatform|@ohos.buffer.d.ts| -|跨平台能力有变化|类名：Buffer;
方法or属性：class Buffer
旧版本信息：|类名：Buffer;
方法or属性：class Buffer
新版本信息：crossplatform|@ohos.buffer.d.ts| -|跨平台能力有变化|类名：Blob;
方法or属性：class Blob
旧版本信息：|类名：Blob;
方法or属性：class Blob
新版本信息：crossplatform|@ohos.buffer.d.ts| -|跨平台能力有变化|类名：process;
方法or属性：type EventListener = (evt: Object) => void;
旧版本信息：|类名：process;
方法or属性：type EventListener = (evt: Object) => void;
新版本信息：crossplatform|@ohos.process.d.ts| -|跨平台能力有变化|类名：process;
方法or属性：function runCmd(

command: string,

options?: ConditionType

): ChildProcess;
旧版本信息：crossplatform|类名：process;
方法or属性：function runCmd(

command: string,

options?: ConditionType

): ChildProcess;
新版本信息：|@ohos.process.d.ts| -|跨平台能力有变化|类名：process;
方法or属性：function on(type: string, listener: EventListener): void;
旧版本信息：crossplatform|类名：process;
方法or属性：function on(type: string, listener: EventListener): void;
新版本信息：|@ohos.process.d.ts| -|跨平台能力有变化|类名：process;
方法or属性：function off(type: string): boolean;
旧版本信息：crossplatform|类名：process;
方法or属性：function off(type: string): boolean;
新版本信息：|@ohos.process.d.ts| -|跨平台能力有变化|类名：process;
方法or属性：function exit(code: number): void;
旧版本信息：crossplatform|类名：process;
方法or属性：function exit(code: number): void;
新版本信息：|@ohos.process.d.ts| -|跨平台能力有变化|类名：process;
方法or属性：function cwd(): string;
旧版本信息：crossplatform|类名：process;
方法or属性：function cwd(): string;
新版本信息：|@ohos.process.d.ts| -|跨平台能力有变化|类名：process;
方法or属性：function chdir(dir: string): void;
旧版本信息：crossplatform|类名：process;
方法or属性：function chdir(dir: string): void;
新版本信息：|@ohos.process.d.ts| -|跨平台能力有变化|类名：ChildProcess;
方法or属性：export interface ChildProcess
旧版本信息：crossplatform|类名：ChildProcess;
方法or属性：export interface ChildProcess
新版本信息：|@ohos.process.d.ts| -|跨平台能力有变化|类名：ChildProcess;
方法or属性：readonly pid: number;
旧版本信息：crossplatform|类名：ChildProcess;
方法or属性：readonly pid: number;
新版本信息：|@ohos.process.d.ts| -|跨平台能力有变化|类名：ChildProcess;
方法or属性：readonly ppid: number;
旧版本信息：crossplatform|类名：ChildProcess;
方法or属性：readonly ppid: number;
新版本信息：|@ohos.process.d.ts| -|跨平台能力有变化|类名：ChildProcess;
方法or属性：readonly exitCode: number;
旧版本信息：crossplatform|类名：ChildProcess;
方法or属性：readonly exitCode: number;
新版本信息：|@ohos.process.d.ts| -|跨平台能力有变化|类名：ChildProcess;
方法or属性：readonly killed: boolean;
旧版本信息：crossplatform|类名：ChildProcess;
方法or属性：readonly killed: boolean;
新版本信息：|@ohos.process.d.ts| -|跨平台能力有变化|类名：ChildProcess;
方法or属性：wait(): Promise\;
旧版本信息：crossplatform|类名：ChildProcess;
方法or属性：wait(): Promise\;
新版本信息：|@ohos.process.d.ts| -|跨平台能力有变化|类名：ChildProcess;
方法or属性：getOutput(): Promise\;
旧版本信息：crossplatform|类名：ChildProcess;
方法or属性：getOutput(): Promise\;
新版本信息：|@ohos.process.d.ts| -|跨平台能力有变化|类名：ChildProcess;
方法or属性：getErrorOutput(): Promise\;
旧版本信息：crossplatform|类名：ChildProcess;
方法or属性：getErrorOutput(): Promise\;
新版本信息：|@ohos.process.d.ts| -|跨平台能力有变化|类名：ChildProcess;
方法or属性：close(): void;
旧版本信息：crossplatform|类名：ChildProcess;
方法or属性：close(): void;
新版本信息：|@ohos.process.d.ts| -|跨平台能力有变化|类名：ChildProcess;
方法or属性：kill(signal: number \| string): void;
旧版本信息：crossplatform|类名：ChildProcess;
方法or属性：kill(signal: number \| string): void;
新版本信息：|@ohos.process.d.ts| -|跨平台能力有变化|类名：taskpool;
方法or属性：declare taskpool
旧版本信息：|类名：taskpool;
方法or属性：declare taskpool
新版本信息：crossplatform|@ohos.taskpool.d.ts| -|跨平台能力有变化|类名：taskpool;
方法or属性：function execute(func: Function, ...args: unknown[]): Promise\;
旧版本信息：|类名：taskpool;
方法or属性：function execute(func: Function, ...args: unknown[]): Promise\;
新版本信息：crossplatform|@ohos.taskpool.d.ts| -|跨平台能力有变化|类名：taskpool;
方法or属性：function execute(task: Task, priority?: Priority): Promise\;
旧版本信息：|类名：taskpool;
方法or属性：function execute(task: Task, priority?: Priority): Promise\;
新版本信息：crossplatform|@ohos.taskpool.d.ts| -|跨平台能力有变化|类名：taskpool;
方法or属性：function cancel(task: Task): void;
旧版本信息：|类名：taskpool;
方法or属性：function cancel(task: Task): void;
新版本信息：crossplatform|@ohos.taskpool.d.ts| -|跨平台能力有变化|类名：Priority;
方法or属性：enum Priority
旧版本信息：|类名：Priority;
方法or属性：enum Priority
新版本信息：crossplatform|@ohos.taskpool.d.ts| -|跨平台能力有变化|类名：Priority;
方法or属性：HIGH = 0
旧版本信息：|类名：Priority;
方法or属性：HIGH = 0
新版本信息：crossplatform|@ohos.taskpool.d.ts| -|跨平台能力有变化|类名：Priority;
方法or属性：MEDIUM = 1
旧版本信息：|类名：Priority;
方法or属性：MEDIUM = 1
新版本信息：crossplatform|@ohos.taskpool.d.ts| -|跨平台能力有变化|类名：Priority;
方法or属性：LOW = 2
旧版本信息：|类名：Priority;
方法or属性：LOW = 2
新版本信息：crossplatform|@ohos.taskpool.d.ts| -|跨平台能力有变化|类名：Task;
方法or属性：class Task
旧版本信息：|类名：Task;
方法or属性：class Task
新版本信息：crossplatform|@ohos.taskpool.d.ts| -|跨平台能力有变化|类名：Task;
方法or属性：constructor(func: Function, ...args: unknown[]);
旧版本信息：|类名：Task;
方法or属性：constructor(func: Function, ...args: unknown[]);
新版本信息：crossplatform|@ohos.taskpool.d.ts| -|跨平台能力有变化|类名：Task;
方法or属性：function: Function;
旧版本信息：|类名：Task;
方法or属性：function: Function;
新版本信息：crossplatform|@ohos.taskpool.d.ts| -|跨平台能力有变化|类名：Task;
方法or属性：arguments?: unknown[];
旧版本信息：|类名：Task;
方法or属性：arguments?: unknown[];
新版本信息：crossplatform|@ohos.taskpool.d.ts| -|跨平台能力有变化|类名：ArrayList;
方法or属性：declare class ArrayList
旧版本信息：|类名：ArrayList;
方法or属性：declare class ArrayList
新版本信息：crossplatform|@ohos.util.ArrayList.d.ts| -|跨平台能力有变化|类名：Scope;
方法or属性：class Scope
旧版本信息：crossplatform|类名：Scope;
方法or属性：class Scope
新版本信息：|@ohos.util.d.ts| -|跨平台能力有变化|类名：ScopeHelper;
方法or属性：getLower(): ScopeType;
旧版本信息：|类名：ScopeHelper;
方法or属性：getLower(): ScopeType;
新版本信息：crossplatform|@ohos.util.d.ts| -|跨平台能力有变化|类名：Deque;
方法or属性：declare class Deque
旧版本信息：|类名：Deque;
方法or属性：declare class Deque
新版本信息：crossplatform|@ohos.util.Deque.d.ts| -|跨平台能力有变化|类名：HashMap;
方法or属性：declare class HashMap
旧版本信息：|类名：HashMap;
方法or属性：declare class HashMap
新版本信息：crossplatform|@ohos.util.HashMap.d.ts| -|跨平台能力有变化|类名：HashSet;
方法or属性：declare class HashSet
旧版本信息：|类名：HashSet;
方法or属性：declare class HashSet
新版本信息：crossplatform|@ohos.util.HashSet.d.ts| -|跨平台能力有变化|类名：LightWeightMap;
方法or属性：declare class LightWeightMap
旧版本信息：|类名：LightWeightMap;
方法or属性：declare class LightWeightMap
新版本信息：crossplatform|@ohos.util.LightWeightMap.d.ts| -|跨平台能力有变化|类名：LightWeightSet;
方法or属性：declare class LightWeightSet
旧版本信息：|类名：LightWeightSet;
方法or属性：declare class LightWeightSet
新版本信息：crossplatform|@ohos.util.LightWeightSet.d.ts| -|跨平台能力有变化|类名：LinkedList;
方法or属性：declare class LinkedList
旧版本信息：|类名：LinkedList;
方法or属性：declare class LinkedList
新版本信息：crossplatform|@ohos.util.LinkedList.d.ts| -|跨平台能力有变化|类名：List;
方法or属性：declare class List
旧版本信息：|类名：List;
方法or属性：declare class List
新版本信息：crossplatform|@ohos.util.List.d.ts| -|跨平台能力有变化|类名：PlainArray;
方法or属性：declare class PlainArray
旧版本信息：|类名：PlainArray;
方法or属性：declare class PlainArray
新版本信息：crossplatform|@ohos.util.PlainArray.d.ts| -|跨平台能力有变化|类名：Queue;
方法or属性：declare class Queue
旧版本信息：|类名：Queue;
方法or属性：declare class Queue
新版本信息：crossplatform|@ohos.util.Queue.d.ts| -|跨平台能力有变化|类名：Stack;
方法or属性：declare class Stack
旧版本信息：|类名：Stack;
方法or属性：declare class Stack
新版本信息：crossplatform|@ohos.util.Stack.d.ts| -|跨平台能力有变化|类名：TreeMap;
方法or属性：declare class TreeMap
旧版本信息：|类名：TreeMap;
方法or属性：declare class TreeMap
新版本信息：crossplatform|@ohos.util.TreeMap.d.ts| -|跨平台能力有变化|类名：TreeSet;
方法or属性：declare class TreeSet
旧版本信息：|类名：TreeSet;
方法or属性：declare class TreeSet
新版本信息：crossplatform|@ohos.util.TreeSet.d.ts| -|跨平台能力有变化|类名：WorkerEventTarget;
方法or属性：addEventListener(type: string, listener: WorkerEventListener): void;
旧版本信息：crossplatform|类名：WorkerEventTarget;
方法or属性：addEventListener(type: string, listener: WorkerEventListener): void;
新版本信息：|@ohos.worker.d.ts| -|跨平台能力有变化|类名：XmlSerializer;
方法or属性：constructor(buffer: ArrayBuffer \| DataView, encoding?: string);
旧版本信息：|类名：XmlSerializer;
方法or属性：constructor(buffer: ArrayBuffer \| DataView, encoding?: string);
新版本信息：crossplatform|@ohos.xml.d.ts| -|跨平台能力有变化|类名：XmlPullParser;
方法or属性：constructor(buffer: ArrayBuffer \| DataView, encoding?: string);
旧版本信息：|类名：XmlPullParser;
方法or属性：constructor(buffer: ArrayBuffer \| DataView, encoding?: string);
新版本信息：crossplatform|@ohos.xml.d.ts| -|跨平台能力有变化|类名：EventType;
方法or属性：enum EventType
旧版本信息：|类名：EventType;
方法or属性：enum EventType
新版本信息：crossplatform|@ohos.xml.d.ts| -|跨平台能力有变化|类名：ParseInfo;
方法or属性：interface ParseInfo
旧版本信息：|类名：ParseInfo;
方法or属性：interface ParseInfo
新版本信息：crossplatform|@ohos.xml.d.ts| -|跨平台能力有变化|类名：ParseOptions;
方法or属性：interface ParseOptions
旧版本信息：|类名：ParseOptions;
方法or属性：interface ParseOptions
新版本信息：crossplatform|@ohos.xml.d.ts| diff --git a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-dfx.md b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-dfx.md index 653d7c0d95e04a37def923515ba36c44ae0bed3d..f65a4e78a52a3d7ec0a1a4f14d29c37761b8225f 100644 --- a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-dfx.md +++ b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-dfx.md @@ -52,7 +52,3 @@ |type有变化|类名：HiTraceId;
方法or属性：spanId?: number;
旧版本信息：|类名：HiTraceId;
方法or属性：spanId?: number;
新版本信息：?number|@ohos.hiTraceChain.d.ts| |type有变化|类名：HiTraceId;
方法or属性：parentSpanId?: number;
旧版本信息：|类名：HiTraceId;
方法or属性：parentSpanId?: number;
新版本信息：?number|@ohos.hiTraceChain.d.ts| |type有变化|类名：HiTraceId;
方法or属性：flags?: number;
旧版本信息：|类名：HiTraceId;
方法or属性：flags?: number;
新版本信息：?number|@ohos.hiTraceChain.d.ts| -|跨平台能力有变化|类名：hilog;
方法or属性：declare hilog
旧版本信息：|类名：hilog;
方法or属性：declare hilog
新版本信息：crossplatform|@ohos.hilog.d.ts| -|跨平台能力有变化|类名：hiTraceMeter;
方法or属性：declare hiTraceMeter
旧版本信息：|类名：hiTraceMeter;
方法or属性：declare hiTraceMeter
新版本信息：crossplatform|@ohos.hiTraceMeter.d.ts| -|跨平台能力有变化|类名：hiTraceMeter;
方法or属性：function startTrace(name: string, taskId: number): void;
旧版本信息：|类名：hiTraceMeter;
方法or属性：function startTrace(name: string, taskId: number): void;
新版本信息：crossplatform|@ohos.hiTraceMeter.d.ts| -|跨平台能力有变化|类名：hiTraceMeter;
方法or属性：function finishTrace(name: string, taskId: number): void;
旧版本信息：|类名：hiTraceMeter;
方法or属性：function finishTrace(name: string, taskId: number): void;
新版本信息：crossplatform|@ohos.hiTraceMeter.d.ts| diff --git a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-distributed-data.md b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-distributed-data.md index 06629d571b9fc7560df3cb4cc3cf0a30ba3e4d9f..e0eaf15590bf2eefcc62479450abfc9c9115fe52 100644 --- a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-distributed-data.md +++ b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-distributed-data.md @@ -121,9 +121,3 @@ |函数有变化|类名：DataShareExtensionAbility;
方法or属性：context?: ExtensionContext;|类名：DataShareExtensionAbility;
方法or属性：context: ExtensionContext;|@ohos.application.DataShareExtensionAbility.d.ts| |函数有变化|类名：PublishedItem;
方法or属性：data: string \| Ashmem;|类名：PublishedItem;
方法or属性：data: string \| ArrayBuffer;|@ohos.data.dataShare.d.ts| |函数有变化|类名：relationalStore;
方法or属性：type ValueType = null \| number \| string \| boolean \| Uint8Array;|类名：relationalStore;
方法or属性：type ValueType = null \| number \| string \| boolean \| Uint8Array \| Asset \| Assets;|@ohos.data.relationalStore.d.ts| -|跨平台能力有变化|类名：StoreConfig;
方法or属性：securityLevel: SecurityLevel;
旧版本信息：|类名：StoreConfig;
方法or属性：securityLevel: SecurityLevel;
新版本信息：crossplatform|@ohos.data.relationalStore.d.ts| -|跨平台能力有变化|类名：SecurityLevel;
方法or属性：enum SecurityLevel
旧版本信息：|类名：SecurityLevel;
方法or属性：enum SecurityLevel
新版本信息：crossplatform|@ohos.data.relationalStore.d.ts| -|跨平台能力有变化|类名：SecurityLevel;
方法or属性：S1 = 1
旧版本信息：|类名：SecurityLevel;
方法or属性：S1 = 1
新版本信息：crossplatform|@ohos.data.relationalStore.d.ts| -|跨平台能力有变化|类名：SecurityLevel;
方法or属性：S2 = 2
旧版本信息：|类名：SecurityLevel;
方法or属性：S2 = 2
新版本信息：crossplatform|@ohos.data.relationalStore.d.ts| -|跨平台能力有变化|类名：SecurityLevel;
方法or属性：S3 = 3
旧版本信息：|类名：SecurityLevel;
方法or属性：S3 = 3
新版本信息：crossplatform|@ohos.data.relationalStore.d.ts| -|跨平台能力有变化|类名：SecurityLevel;
方法or属性：S4 = 4
旧版本信息：|类名：SecurityLevel;
方法or属性：S4 = 4
新版本信息：crossplatform|@ohos.data.relationalStore.d.ts| diff --git a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-file-management.md b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-file-management.md index edfe18a1ac06bd590ad71475dc0eb349a3727596..6f3ccd09592716948f2204d50908d95304b18b1a 100644 --- a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-file-management.md +++ b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-file-management.md @@ -446,24 +446,3 @@ |type有变化|类名：PhotoSaveOptions;
方法or属性：newFileNames?: Array\;
旧版本信息：Array\|类名：PhotoSaveOptions;
方法or属性：newFileNames?: Array\;
新版本信息：?Array\|@ohos.file.picker.d.ts| |type有变化|类名：DocumentSaveOptions;
方法or属性：newFileNames?: Array\;
旧版本信息：Array\|类名：DocumentSaveOptions;
方法or属性：newFileNames?: Array\;
新版本信息：?Array\|@ohos.file.picker.d.ts| |type有变化|类名：AudioSaveOptions;
方法or属性：newFileNames?: Array\;
旧版本信息：Array\|类名：AudioSaveOptions;
方法or属性：newFileNames?: Array\;
新版本信息：?Array\|@ohos.file.picker.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：declare function access(path: string): Promise\;
旧版本信息：|类名：sourcefile;
方法or属性：declare function access(path: string): Promise\;
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：declare function access(path: string, callback: AsyncCallback\): void;
旧版本信息：|类名：sourcefile;
方法or属性：declare function access(path: string, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：declare function accessSync(path: string): boolean;
旧版本信息：|类名：sourcefile;
方法or属性：declare function accessSync(path: string): boolean;
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：declare function copyFile(src: string \| number, dest: string \| number, mode?: number): Promise\;
旧版本信息：|类名：sourcefile;
方法or属性：declare function copyFile(src: string \| number, dest: string \| number, mode?: number): Promise\;
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：declare function copyFile(src: string \| number, dest: string \| number, callback: AsyncCallback\): void;
旧版本信息：|类名：sourcefile;
方法or属性：declare function copyFile(src: string \| number, dest: string \| number, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：declare function copyFile(
src: string \| number,
dest: string \| number,
mode: number,
callback: AsyncCallback\
): void;
旧版本信息：|类名：sourcefile;
方法or属性：declare function copyFile(
src: string \| number,
dest: string \| number,
mode: number,
callback: AsyncCallback\
): void;
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：declare function copyFileSync(src: string \| number, dest: string \| number, mode?: number): void;
旧版本信息：|类名：sourcefile;
方法or属性：declare function copyFileSync(src: string \| number, dest: string \| number, mode?: number): void;
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：declare function listFile(
path: string,
options?: {
recursion?: boolean;
listNum?: number;
filter?: Filter;
}
): Promise\;
旧版本信息：|类名：sourcefile;
方法or属性：declare function listFile(
path: string,
options?: {
recursion?: boolean;
listNum?: number;
filter?: Filter;
}
): Promise\;
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：declare function listFile(path: string, callback: AsyncCallback\): void;
旧版本信息：|类名：sourcefile;
方法or属性：declare function listFile(path: string, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：declare function listFile(
path: string,
options: {
recursion?: boolean;
listNum?: number;
filter?: Filter;
},
callback: AsyncCallback\
): void;
旧版本信息：|类名：sourcefile;
方法or属性：declare function listFile(
path: string,
options: {
recursion?: boolean;
listNum?: number;
filter?: Filter;
},
callback: AsyncCallback\
): void;
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：declare function listFileSync(
path: string,
options?: {
recursion?: boolean;
listNum?: number;
filter?: Filter;
}
): string[];
旧版本信息：|类名：sourcefile;
方法or属性：declare function listFileSync(
path: string,
options?: {
recursion?: boolean;
listNum?: number;
filter?: Filter;
}
): string[];
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：declare function moveFile(src: string, dest: string, mode?: number): Promise\;
旧版本信息：|类名：sourcefile;
方法or属性：declare function moveFile(src: string, dest: string, mode?: number): Promise\;
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：declare function moveFile(src: string, dest: string, callback: AsyncCallback\): void;
旧版本信息：|类名：sourcefile;
方法or属性：declare function moveFile(src: string, dest: string, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：declare function moveFile(src: string, dest: string, mode: number, callback: AsyncCallback\): void;
旧版本信息：|类名：sourcefile;
方法or属性：declare function moveFile(src: string, dest: string, mode: number, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：declare function moveFileSync(src: string, dest: string, mode?: number): void;
旧版本信息：|类名：sourcefile;
方法or属性：declare function moveFileSync(src: string, dest: string, mode?: number): void;
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：declare function readText(
filePath: string,
options?: {
offset?: number;
length?: number;
encoding?: string;
}
): Promise\;
旧版本信息：|类名：sourcefile;
方法or属性：declare function readText(
filePath: string,
options?: {
offset?: number;
length?: number;
encoding?: string;
}
): Promise\;
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：declare function readText(filePath: string, callback: AsyncCallback\): void;
旧版本信息：|类名：sourcefile;
方法or属性：declare function readText(filePath: string, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：declare function readText(
filePath: string,
options: {
offset?: number;
length?: number;
encoding?: string;
},
callback: AsyncCallback\
): void;
旧版本信息：|类名：sourcefile;
方法or属性：declare function readText(
filePath: string,
options: {
offset?: number;
length?: number;
encoding?: string;
},
callback: AsyncCallback\
): void;
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：declare function readTextSync(
filePath: string,
options?: {
offset?: number;
length?: number;
encoding?: string;
}
): string;
旧版本信息：|类名：sourcefile;
方法or属性：declare function readTextSync(
filePath: string,
options?: {
offset?: number;
length?: number;
encoding?: string;
}
): string;
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：sourcefile;
方法or属性：export type Filter = {
/**
* @type { ?Array\ }
* @syscap SystemCapability.FileManagement.File.FileIO
* @since 10
*/
suffix?: Array\;
/**
* @type { ?Array\ }
* @syscap SystemCapability.FileManagement.File.FileIO
* @since 10
*/
displayName?: Array\;
/**
* @type { ?Array\ }
* @syscap SystemCapability.FileManagement.File.FileIO
* @since 10
*/
mimeType?: Array\;
/**
* @type { ?number }
* @syscap SystemCapability.FileManagement.File.FileIO
* @since 10
*/
fileSizeOver?: number;
/**
* @type { ?number }
* @syscap SystemCapability.FileManagement.File.FileIO
* @since 10
*/
lastModifiedAfter?: number;
/**
* @type { ?boolean }
* @syscap SystemCapability.FileManagement.File.FileIO
* @since 10
*/
excludeMedia?: boolean;
};
旧版本信息：|类名：sourcefile;
方法or属性：export type Filter = {
/**
* @type { ?Array\ }
* @syscap SystemCapability.FileManagement.File.FileIO
* @since 10
*/
suffix?: Array\;
/**
* @type { ?Array\ }
* @syscap SystemCapability.FileManagement.File.FileIO
* @since 10
*/
displayName?: Array\;
/**
* @type { ?Array\ }
* @syscap SystemCapability.FileManagement.File.FileIO
* @since 10
*/
mimeType?: Array\;
/**
* @type { ?number }
* @syscap SystemCapability.FileManagement.File.FileIO
* @since 10
*/
fileSizeOver?: number;
/**
* @type { ?number }
* @syscap SystemCapability.FileManagement.File.FileIO
* @since 10
*/
lastModifiedAfter?: number;
/**
* @type { ?boolean }
* @syscap SystemCapability.FileManagement.File.FileIO
* @since 10
*/
excludeMedia?: boolean;
};
新版本信息：crossplatform|@ohos.file.fs.d.ts| -|跨平台能力有变化|类名：fileIo;
方法or属性：declare fileIo
旧版本信息：|类名：fileIo;
方法or属性：declare fileIo
新版本信息：crossplatform|@ohos.file.fs.d.ts| diff --git a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-global.md b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-global.md index f3aafc0e06d2b51bf49118e27e6c9755f53dc7a9..5f6592c6e4422dc18a6982501ecd9d45487a2b28 100644 --- a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-global.md +++ b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-global.md @@ -32,9 +32,3 @@ |新增|NA|类名：ResourceManager;
方法or属性：getColorByNameSync(resName: string) : number;|@ohos.resourceManager.d.ts| |新增|NA|类名：ResourceManager;
方法or属性：addResource(path: string) : void;|@ohos.resourceManager.d.ts| |新增|NA|类名：ResourceManager;
方法or属性：removeResource(path: string) : void;|@ohos.resourceManager.d.ts| -|跨平台能力有变化|类名：DateTimeOptions;
方法or属性：year?: string;
旧版本信息：|类名：DateTimeOptions;
方法or属性：year?: string;
新版本信息：crossplatform|@ohos.intl.d.ts| -|跨平台能力有变化|类名：DeviceType;
方法or属性：DEVICE_TYPE_TABLET = 0x01
旧版本信息：crossplatform|类名：DeviceType;
方法or属性：DEVICE_TYPE_TABLET = 0x01
新版本信息：|@ohos.resourceManager.d.ts| -|跨平台能力有变化|类名：DeviceType;
方法or属性：DEVICE_TYPE_CAR = 0x02
旧版本信息：crossplatform|类名：DeviceType;
方法or属性：DEVICE_TYPE_CAR = 0x02
新版本信息：|@ohos.resourceManager.d.ts| -|跨平台能力有变化|类名：DeviceType;
方法or属性：DEVICE_TYPE_PC = 0x03
旧版本信息：crossplatform|类名：DeviceType;
方法or属性：DEVICE_TYPE_PC = 0x03
新版本信息：|@ohos.resourceManager.d.ts| -|跨平台能力有变化|类名：DeviceType;
方法or属性：DEVICE_TYPE_TV = 0x04
旧版本信息：crossplatform|类名：DeviceType;
方法or属性：DEVICE_TYPE_TV = 0x04
新版本信息：|@ohos.resourceManager.d.ts| -|跨平台能力有变化|类名：DeviceType;
方法or属性：DEVICE_TYPE_WEARABLE = 0x06
旧版本信息：crossplatform|类名：DeviceType;
方法or属性：DEVICE_TYPE_WEARABLE = 0x06
新版本信息：|@ohos.resourceManager.d.ts| diff --git a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-multimedia.md b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-multimedia.md index 13ddc5fbda1afe0e3ccfcc1edbcc5b3df6d0dfee..105069268e5e07e3e7e0c6579791e4cc13fcb972 100644 --- a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-multimedia.md +++ b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-multimedia.md @@ -13,6 +13,8 @@ |删除|类名：OutputDeviceInfo;
方法or属性：deviceName: Array\;|NA|@ohos.multimedia.avsession.d.ts| |删除|类名：ImageSource;
方法or属性：getDelayTime(): Promise\>;|NA|@ohos.multimedia.image.d.ts| |删除|类名：ImageSource;
方法or属性：getDelayTime(callback: AsyncCallback\>): void;|NA|@ohos.multimedia.image.d.ts| +|新增|NA|类名：effectKit;
方法or属性：function createColorPicker(source:image.PixelMap,region:Array\):Promise\;|@ohos.effectKit.d.ts| +|新增|NA|类名：effectKit;
方法or属性：function createColorPicker(source:image.PixelMap,region:Array\,callback:AsyncCallback\):void;|@ohos.effectKit.d.ts| |新增|NA|类名：AVMediaDescription;
方法or属性：artist?: string;|@ohos.multimedia.avsession.d.ts| |新增|NA|类名：AVMediaDescription;
方法or属性：duration?: number;|@ohos.multimedia.avsession.d.ts| |新增|NA|类名：AVCastController;
方法or属性：getAVPlaybackState(callback: AsyncCallback\): void;|@ohos.multimedia.avsession.d.ts| @@ -210,6 +212,8 @@ |新增|NA|类名：ImageSource;
方法or属性：getDelayTimeList(): Promise\>;|@ohos.multimedia.image.d.ts| |新增|NA|类名：ImageSource;
方法or属性：getDelayTimeList(callback: AsyncCallback\>): void;|@ohos.multimedia.image.d.ts| |新增|NA|类名：AVPlayer;
方法or属性：audioEffectMode ?: audio.AudioEffectMode;|@ohos.multimedia.media.d.ts| +|新增(错误码)|类名：effectKit;
方法or属性：function createColorPicker(source:image.PixelMap): Promise\;
旧版本信息：|类名：effectKit;
方法or属性：function createColorPicker(source:image.PixelMap): Promise\;
新版本信息：401|@ohos.effectKit.d.ts| +|新增(错误码)|类名：effectKit;
方法or属性：function createColorPicker(source:image.PixelMap,callback:AsyncCallback\):void;
旧版本信息：|类名：effectKit;
方法or属性：function createColorPicker(source:image.PixelMap,callback:AsyncCallback\):void;
新版本信息：401|@ohos.effectKit.d.ts| |新增(错误码)|类名：avSession;
方法or属性：function createAVSession(context: Context, tag: string, type: AVSessionType): Promise\;
旧版本信息：|类名：avSession;
方法or属性：function createAVSession(context: Context, tag: string, type: AVSessionType): Promise\;
新版本信息：401,6600101|@ohos.multimedia.avsession.d.ts| |新增(错误码)|类名：avSession;
方法or属性：function getAllSessionDescriptors(): Promise\>>;
旧版本信息：|类名：avSession;
方法or属性：function getAllSessionDescriptors(): Promise\>>;
新版本信息：201,6600101|@ohos.multimedia.avsession.d.ts| |新增(错误码)|类名：avSession;
方法or属性：function createController(sessionId: string): Promise\;
旧版本信息：|类名：avSession;
方法or属性：function createController(sessionId: string): Promise\;
新版本信息：201,401,6600101,6600102|@ohos.multimedia.avsession.d.ts| diff --git a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-sdk.md b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-sdk.md deleted file mode 100644 index b5192aa02c0cfc35d7b81cef0b5925d722575c7d..0000000000000000000000000000000000000000 --- a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-sdk.md +++ /dev/null @@ -1,11 +0,0 @@ -| 操作 | 旧版本 | 新版本 | d.ts文件 | -| ---- | ------ | ------ | -------- | -|跨平台能力有变化|类名：Callback;
方法or属性：export interface Callback
旧版本信息：|类名：Callback;
方法or属性：export interface Callback
新版本信息：crossplatform|@ohos.base.d.ts| -|跨平台能力有变化|类名：Callback;
方法or属性：(data: T): void;
旧版本信息：|类名：Callback;
方法or属性：(data: T): void;
新版本信息：crossplatform|@ohos.base.d.ts| -|跨平台能力有变化|类名：ErrorCallback;
方法or属性：export interface ErrorCallback
旧版本信息：|类名：ErrorCallback;
方法or属性：export interface ErrorCallback
新版本信息：crossplatform|@ohos.base.d.ts| -|跨平台能力有变化|类名：ErrorCallback;
方法or属性：(err: T): void;
旧版本信息：|类名：ErrorCallback;
方法or属性：(err: T): void;
新版本信息：crossplatform|@ohos.base.d.ts| -|跨平台能力有变化|类名：AsyncCallback;
方法or属性：export interface AsyncCallback
旧版本信息：|类名：AsyncCallback;
方法or属性：export interface AsyncCallback
新版本信息：crossplatform|@ohos.base.d.ts| -|跨平台能力有变化|类名：AsyncCallback;
方法or属性：(err: BusinessError\, data: T): void;
旧版本信息：|类名：AsyncCallback;
方法or属性：(err: BusinessError\, data: T): void;
新版本信息：crossplatform|@ohos.base.d.ts| -|跨平台能力有变化|类名：BusinessError;
方法or属性：export interface BusinessError
旧版本信息：|类名：BusinessError;
方法or属性：export interface BusinessError
新版本信息：crossplatform|@ohos.base.d.ts| -|跨平台能力有变化|类名：BusinessError;
方法or属性：code: number;
旧版本信息：|类名：BusinessError;
方法or属性：code: number;
新版本信息：crossplatform|@ohos.base.d.ts| -|跨平台能力有变化|类名：BusinessError;
方法or属性：data?: T;
旧版本信息：|类名：BusinessError;
方法or属性：data?: T;
新版本信息：crossplatform|@ohos.base.d.ts| diff --git a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-unitest.md b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-unitest.md index 544feba6613f75fc91685419cf8e7911d01ec1cf..9e57ea9c3a47c60b16815bbcad4dee9d78584ef1 100644 --- a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-unitest.md +++ b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-unitest.md @@ -10,53 +10,3 @@ |type有变化|类名：WindowFilter;
方法or属性：title?: string;
旧版本信息：string?|类名：WindowFilter;
方法or属性：title?: string;
新版本信息：?string|@ohos.UiTest.d.ts| |type有变化|类名：WindowFilter;
方法or属性：focused?: boolean;
旧版本信息：boolean?|类名：WindowFilter;
方法or属性：focused?: boolean;
新版本信息：?boolean|@ohos.UiTest.d.ts| |type有变化|类名：WindowFilter;
方法or属性：actived?: boolean;
旧版本信息：boolean?|类名：WindowFilter;
方法or属性：actived?: boolean;
新版本信息：?boolean|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：MatchPattern;
方法or属性：declare enum MatchPattern
旧版本信息：|类名：MatchPattern;
方法or属性：declare enum MatchPattern
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：MatchPattern;
方法or属性：EQUALS = 0
旧版本信息：|类名：MatchPattern;
方法or属性：EQUALS = 0
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：MatchPattern;
方法or属性：CONTAINS = 1
旧版本信息：|类名：MatchPattern;
方法or属性：CONTAINS = 1
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：MatchPattern;
方法or属性：STARTS_WITH = 2
旧版本信息：|类名：MatchPattern;
方法or属性：STARTS_WITH = 2
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：MatchPattern;
方法or属性：ENDS_WITH = 3
旧版本信息：|类名：MatchPattern;
方法or属性：ENDS_WITH = 3
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Point;
方法or属性：declare interface Point
旧版本信息：|类名：Point;
方法or属性：declare interface Point
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Point;
方法or属性：readonly x: number;
旧版本信息：|类名：Point;
方法or属性：readonly x: number;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Point;
方法or属性：readonly y: number;
旧版本信息：|类名：Point;
方法or属性：readonly y: number;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：On;
方法or属性：text(txt: string, pattern?: MatchPattern): On;
旧版本信息：|类名：On;
方法or属性：text(txt: string, pattern?: MatchPattern): On;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：On;
方法or属性：id(id: string): On;
旧版本信息：|类名：On;
方法or属性：id(id: string): On;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：On;
方法or属性：type(tp: string): On;
旧版本信息：|类名：On;
方法or属性：type(tp: string): On;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：On;
方法or属性：clickable(b?: boolean): On;
旧版本信息：|类名：On;
方法or属性：clickable(b?: boolean): On;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：On;
方法or属性：longClickable(b?: boolean): On;
旧版本信息：|类名：On;
方法or属性：longClickable(b?: boolean): On;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：On;
方法or属性：scrollable(b?: boolean): On;
旧版本信息：|类名：On;
方法or属性：scrollable(b?: boolean): On;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：On;
方法or属性：enabled(b?: boolean): On;
旧版本信息：|类名：On;
方法or属性：enabled(b?: boolean): On;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：On;
方法or属性：focused(b?: boolean): On;
旧版本信息：|类名：On;
方法or属性：focused(b?: boolean): On;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：On;
方法or属性：selected(b?: boolean): On;
旧版本信息：|类名：On;
方法or属性：selected(b?: boolean): On;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：On;
方法or属性：checked(b?: boolean): On;
旧版本信息：|类名：On;
方法or属性：checked(b?: boolean): On;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：On;
方法or属性：checkable(b?: boolean): On;
旧版本信息：|类名：On;
方法or属性：checkable(b?: boolean): On;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：click(): Promise\;
旧版本信息：|类名：Component;
方法or属性：click(): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：doubleClick(): Promise\;
旧版本信息：|类名：Component;
方法or属性：doubleClick(): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：longClick(): Promise\;
旧版本信息：|类名：Component;
方法or属性：longClick(): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：getId(): Promise\;
旧版本信息：|类名：Component;
方法or属性：getId(): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：getText(): Promise\;
旧版本信息：|类名：Component;
方法or属性：getText(): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：getType(): Promise\;
旧版本信息：|类名：Component;
方法or属性：getType(): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：isClickable(): Promise\;
旧版本信息：|类名：Component;
方法or属性：isClickable(): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：isLongClickable(): Promise\;
旧版本信息：|类名：Component;
方法or属性：isLongClickable(): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：isScrollable(): Promise\;
旧版本信息：|类名：Component;
方法or属性：isScrollable(): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：isEnabled(): Promise\;
旧版本信息：|类名：Component;
方法or属性：isEnabled(): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：isFocused(): Promise\;
旧版本信息：|类名：Component;
方法or属性：isFocused(): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：isSelected(): Promise\;
旧版本信息：|类名：Component;
方法or属性：isSelected(): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：isChecked(): Promise\;
旧版本信息：|类名：Component;
方法or属性：isChecked(): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：isCheckable(): Promise\;
旧版本信息：|类名：Component;
方法or属性：isCheckable(): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：inputText(text: string): Promise\;
旧版本信息：|类名：Component;
方法or属性：inputText(text: string): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：clearText(): Promise\;
旧版本信息：|类名：Component;
方法or属性：clearText(): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：scrollToTop(speed?: number): Promise\;
旧版本信息：|类名：Component;
方法or属性：scrollToTop(speed?: number): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：scrollToBottom(speed?: number): Promise\;
旧版本信息：|类名：Component;
方法or属性：scrollToBottom(speed?: number): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：scrollSearch(on: On): Promise\;
旧版本信息：|类名：Component;
方法or属性：scrollSearch(on: On): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Component;
方法or属性：getBoundsCenter(): Promise\;
旧版本信息：|类名：Component;
方法or属性：getBoundsCenter(): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Driver;
方法or属性：static create(): Driver;
旧版本信息：|类名：Driver;
方法or属性：static create(): Driver;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Driver;
方法or属性：delayMs(duration: number): Promise\;
旧版本信息：|类名：Driver;
方法or属性：delayMs(duration: number): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Driver;
方法or属性：findComponent(on: On): Promise\;
旧版本信息：|类名：Driver;
方法or属性：findComponent(on: On): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Driver;
方法or属性：findComponents(on: On): Promise\>;
旧版本信息：|类名：Driver;
方法or属性：findComponents(on: On): Promise\>;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Driver;
方法or属性：assertComponentExist(on: On): Promise\;
旧版本信息：|类名：Driver;
方法or属性：assertComponentExist(on: On): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Driver;
方法or属性：pressBack(): Promise\;
旧版本信息：|类名：Driver;
方法or属性：pressBack(): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Driver;
方法or属性：click(x: number, y: number): Promise\;
旧版本信息：|类名：Driver;
方法or属性：click(x: number, y: number): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Driver;
方法or属性：doubleClick(x: number, y: number): Promise\;
旧版本信息：|类名：Driver;
方法or属性：doubleClick(x: number, y: number): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Driver;
方法or属性：longClick(x: number, y: number): Promise\;
旧版本信息：|类名：Driver;
方法or属性：longClick(x: number, y: number): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Driver;
方法or属性：swipe(startx: number, starty: number, endx: number, endy: number, speed?: number): Promise\;
旧版本信息：|类名：Driver;
方法or属性：swipe(startx: number, starty: number, endx: number, endy: number, speed?: number): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| -|跨平台能力有变化|类名：Driver;
方法or属性：fling(from: Point, to: Point, stepLen: number, speed: number): Promise\;
旧版本信息：|类名：Driver;
方法or属性：fling(from: Point, to: Point, stepLen: number, speed: number): Promise\;
新版本信息：crossplatform|@ohos.UiTest.d.ts| diff --git a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-window.md b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-window.md index 70e472b0dace492b5fb2cb731c066cccffab16c4..a7e59afd3b9521e466af1e8c1a1b6e3fe2801b00 100644 --- a/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-window.md +++ b/zh-cn/release-notes/api-diff/v4.0-beta2/js-apidiff-window.md @@ -61,89 +61,4 @@ |访问级别有变化|类名：ScreenModeInfo;
方法or属性：interface ScreenModeInfo
旧版本信息：|类名：ScreenModeInfo;
方法or属性：interface ScreenModeInfo
新版本信息：systemapi|@ohos.screen.d.ts| |权限有变化|类名：screen;
方法or属性：function createVirtualScreen(options: VirtualScreenOption): Promise\;
旧版本信息：|类名：screen;
方法or属性：function createVirtualScreen(options: VirtualScreenOption): Promise\;
新版本信息：ohos.permission.CAPTURE_SCREEN|@ohos.screen.d.ts| |权限有变化|类名：screen;
方法or属性：function setVirtualScreenSurface(screenId: number, surfaceId: string): Promise\;
旧版本信息：|类名：screen;
方法or属性：function setVirtualScreenSurface(screenId: number, surfaceId: string): Promise\;
新版本信息：ohos.permission.CAPTURE_SCREEN|@ohos.screen.d.ts| -|跨平台能力有变化|类名：display;
方法or属性：declare display
旧版本信息：|类名：display;
方法or属性：declare display
新版本信息：crossplatform|@ohos.display.d.ts| -|跨平台能力有变化|类名：display;
方法or属性：function getDefaultDisplaySync(): Display;
旧版本信息：|类名：display;
方法or属性：function getDefaultDisplaySync(): Display;
新版本信息：crossplatform|@ohos.display.d.ts| -|跨平台能力有变化|类名：Orientation;
方法or属性：enum Orientation
旧版本信息：|类名：Orientation;
方法or属性：enum Orientation
新版本信息：crossplatform|@ohos.display.d.ts| -|跨平台能力有变化|类名：Orientation;
方法or属性：PORTRAIT = 0
旧版本信息：|类名：Orientation;
方法or属性：PORTRAIT = 0
新版本信息：crossplatform|@ohos.display.d.ts| -|跨平台能力有变化|类名：Orientation;
方法or属性：LANDSCAPE = 1
旧版本信息：|类名：Orientation;
方法or属性：LANDSCAPE = 1
新版本信息：crossplatform|@ohos.display.d.ts| -|跨平台能力有变化|类名：Orientation;
方法or属性：PORTRAIT_INVERTED = 2
旧版本信息：|类名：Orientation;
方法or属性：PORTRAIT_INVERTED = 2
新版本信息：crossplatform|@ohos.display.d.ts| -|跨平台能力有变化|类名：Orientation;
方法or属性：LANDSCAPE_INVERTED = 3
旧版本信息：|类名：Orientation;
方法or属性：LANDSCAPE_INVERTED = 3
新版本信息：crossplatform|@ohos.display.d.ts| -|跨平台能力有变化|类名：Rect;
方法or属性：interface Rect
旧版本信息：|类名：Rect;
方法or属性：interface Rect
新版本信息：crossplatform|@ohos.display.d.ts| -|跨平台能力有变化|类名：Rect;
方法or属性：left: number;
旧版本信息：|类名：Rect;
方法or属性：left: number;
新版本信息：crossplatform|@ohos.display.d.ts| -|跨平台能力有变化|类名：Rect;
方法or属性：top: number;
旧版本信息：|类名：Rect;
方法or属性：top: number;
新版本信息：crossplatform|@ohos.display.d.ts| -|跨平台能力有变化|类名：Rect;
方法or属性：width: number;
旧版本信息：|类名：Rect;
方法or属性：width: number;
新版本信息：crossplatform|@ohos.display.d.ts| -|跨平台能力有变化|类名：Display;
方法or属性：width: number;
旧版本信息：|类名：Display;
方法or属性：width: number;
新版本信息：crossplatform|@ohos.display.d.ts| -|跨平台能力有变化|类名：Rect;
方法or属性：height: number;
旧版本信息：|类名：Rect;
方法or属性：height: number;
新版本信息：crossplatform|@ohos.display.d.ts| -|跨平台能力有变化|类名：Display;
方法or属性：height: number;
旧版本信息：|类名：Display;
方法or属性：height: number;
新版本信息：crossplatform|@ohos.display.d.ts| -|跨平台能力有变化|类名：Display;
方法or属性：interface Display
旧版本信息：|类名：Display;
方法or属性：interface Display
新版本信息：crossplatform|@ohos.display.d.ts| -|跨平台能力有变化|类名：Display;
方法or属性：id: number;
旧版本信息：|类名：Display;
方法or属性：id: number;
新版本信息：crossplatform|@ohos.display.d.ts| -|跨平台能力有变化|类名：Display;
方法or属性：orientation: Orientation;
旧版本信息：|类名：Display;
方法or属性：orientation: Orientation;
新版本信息：crossplatform|@ohos.display.d.ts| -|跨平台能力有变化|类名：window;
方法or属性：declare window
旧版本信息：|类名：window;
方法or属性：declare window
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：window;
方法or属性：function createWindow(config: Configuration, callback: AsyncCallback\): void;
旧版本信息：|类名：window;
方法or属性：function createWindow(config: Configuration, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：window;
方法or属性：function createWindow(config: Configuration): Promise\;
旧版本信息：|类名：window;
方法or属性：function createWindow(config: Configuration): Promise\;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：window;
方法or属性：function findWindow(name: string): Window;
旧版本信息：|类名：window;
方法or属性：function findWindow(name: string): Window;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：window;
方法or属性：function getLastWindow(ctx: BaseContext, callback: AsyncCallback\): void;
旧版本信息：|类名：window;
方法or属性：function getLastWindow(ctx: BaseContext, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：window;
方法or属性：function getLastWindow(ctx: BaseContext): Promise\;
旧版本信息：|类名：window;
方法or属性：function getLastWindow(ctx: BaseContext): Promise\;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowType;
方法or属性：enum WindowType
旧版本信息：|类名：WindowType;
方法or属性：enum WindowType
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowType;
方法or属性：TYPE_APP
旧版本信息：|类名：WindowType;
方法or属性：TYPE_APP
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Rect;
方法or属性：interface Rect
旧版本信息：|类名：Rect;
方法or属性：interface Rect
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Rect;
方法or属性：left: number;
旧版本信息：|类名：Rect;
方法or属性：left: number;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Rect;
方法or属性：top: number;
旧版本信息：|类名：Rect;
方法or属性：top: number;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Rect;
方法or属性：width: number;
旧版本信息：|类名：Rect;
方法or属性：width: number;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Size;
方法or属性：width: number;
旧版本信息：|类名：Size;
方法or属性：width: number;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Rect;
方法or属性：height: number;
旧版本信息：|类名：Rect;
方法or属性：height: number;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Size;
方法or属性：height: number;
旧版本信息：|类名：Size;
方法or属性：height: number;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Size;
方法or属性：interface Size
旧版本信息：|类名：Size;
方法or属性：interface Size
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowProperties;
方法or属性：interface WindowProperties
旧版本信息：|类名：WindowProperties;
方法or属性：interface WindowProperties
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowProperties;
方法or属性：windowRect: Rect;
旧版本信息：|类名：WindowProperties;
方法or属性：windowRect: Rect;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowProperties;
方法or属性：type: WindowType;
旧版本信息：|类名：WindowProperties;
方法or属性：type: WindowType;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowProperties;
方法or属性：brightness: number;
旧版本信息：|类名：WindowProperties;
方法or属性：brightness: number;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowProperties;
方法or属性：isKeepScreenOn: boolean;
旧版本信息：|类名：WindowProperties;
方法or属性：isKeepScreenOn: boolean;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Configuration;
方法or属性：interface Configuration
旧版本信息：|类名：Configuration;
方法or属性：interface Configuration
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Configuration;
方法or属性：name: string;
旧版本信息：|类名：Configuration;
方法or属性：name: string;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Configuration;
方法or属性：windowType: WindowType;
旧版本信息：|类名：Configuration;
方法or属性：windowType: WindowType;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Configuration;
方法or属性：ctx?: BaseContext;
旧版本信息：|类名：Configuration;
方法or属性：ctx?: BaseContext;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Configuration;
方法or属性：displayId?: number;
旧版本信息：|类名：Configuration;
方法or属性：displayId?: number;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Configuration;
方法or属性：parentId?: number;
旧版本信息：|类名：Configuration;
方法or属性：parentId?: number;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Orientation;
方法or属性：enum Orientation
旧版本信息：|类名：Orientation;
方法or属性：enum Orientation
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Orientation;
方法or属性：UNSPECIFIED = 0
旧版本信息：|类名：Orientation;
方法or属性：UNSPECIFIED = 0
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Orientation;
方法or属性：PORTRAIT = 1
旧版本信息：|类名：Orientation;
方法or属性：PORTRAIT = 1
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Orientation;
方法or属性：LANDSCAPE = 2
旧版本信息：|类名：Orientation;
方法or属性：LANDSCAPE = 2
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Orientation;
方法or属性：PORTRAIT_INVERTED = 3
旧版本信息：|类名：Orientation;
方法or属性：PORTRAIT_INVERTED = 3
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Orientation;
方法or属性：LANDSCAPE_INVERTED = 4
旧版本信息：|类名：Orientation;
方法or属性：LANDSCAPE_INVERTED = 4
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：showWindow(callback: AsyncCallback\): void;
旧版本信息：|类名：Window;
方法or属性：showWindow(callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：showWindow(): Promise\;
旧版本信息：|类名：Window;
方法or属性：showWindow(): Promise\;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：destroyWindow(callback: AsyncCallback\): void;
旧版本信息：|类名：Window;
方法or属性：destroyWindow(callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：destroyWindow(): Promise\;
旧版本信息：|类名：Window;
方法or属性：destroyWindow(): Promise\;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：moveWindowTo(x: number, y: number): Promise\;
旧版本信息：|类名：Window;
方法or属性：moveWindowTo(x: number, y: number): Promise\;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：moveWindowTo(x: number, y: number, callback: AsyncCallback\): void;
旧版本信息：|类名：Window;
方法or属性：moveWindowTo(x: number, y: number, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：resize(width: number, height: number): Promise\;
旧版本信息：|类名：Window;
方法or属性：resize(width: number, height: number): Promise\;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：resize(width: number, height: number, callback: AsyncCallback\): void;
旧版本信息：|类名：Window;
方法or属性：resize(width: number, height: number, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：getWindowProperties(): WindowProperties;
旧版本信息：|类名：Window;
方法or属性：getWindowProperties(): WindowProperties;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：setWindowSystemBarEnable(names: Array\<'status' \| 'navigation'>, callback: AsyncCallback\): void;
旧版本信息：|类名：Window;
方法or属性：setWindowSystemBarEnable(names: Array\<'status' \| 'navigation'>, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：setWindowSystemBarEnable(names: Array\<'status' \| 'navigation'>): Promise\;
旧版本信息：|类名：Window;
方法or属性：setWindowSystemBarEnable(names: Array\<'status' \| 'navigation'>): Promise\;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：setPreferredOrientation(orientation: Orientation): Promise\;
旧版本信息：|类名：Window;
方法or属性：setPreferredOrientation(orientation: Orientation): Promise\;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：setPreferredOrientation(orientation: Orientation, callback: AsyncCallback\): void;
旧版本信息：|类名：Window;
方法or属性：setPreferredOrientation(orientation: Orientation, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：loadContent(path: string, storage: LocalStorage, callback: AsyncCallback\): void;
旧版本信息：|类名：Window;
方法or属性：loadContent(path: string, storage: LocalStorage, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowStage;
方法or属性：loadContent(path: string, storage: LocalStorage, callback: AsyncCallback\): void;
旧版本信息：|类名：WindowStage;
方法or属性：loadContent(path: string, storage: LocalStorage, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：loadContent(path: string, storage: LocalStorage): Promise\;
旧版本信息：|类名：Window;
方法or属性：loadContent(path: string, storage: LocalStorage): Promise\;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：setUIContent(path: string, callback: AsyncCallback\): void;
旧版本信息：|类名：Window;
方法or属性：setUIContent(path: string, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：setUIContent(path: string): Promise\;
旧版本信息：|类名：Window;
方法or属性：setUIContent(path: string): Promise\;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：isWindowShowing(): boolean;
旧版本信息：|类名：Window;
方法or属性：isWindowShowing(): boolean;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：setWindowBackgroundColor(color: string): void;
旧版本信息：|类名：Window;
方法or属性：setWindowBackgroundColor(color: string): void;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：setWindowBrightness(brightness: number): Promise\;
旧版本信息：|类名：Window;
方法or属性：setWindowBrightness(brightness: number): Promise\;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：setWindowBrightness(brightness: number, callback: AsyncCallback\): void;
旧版本信息：|类名：Window;
方法or属性：setWindowBrightness(brightness: number, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：setWindowKeepScreenOn(isKeepScreenOn: boolean): Promise\;
旧版本信息：|类名：Window;
方法or属性：setWindowKeepScreenOn(isKeepScreenOn: boolean): Promise\;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：Window;
方法or属性：setWindowKeepScreenOn(isKeepScreenOn: boolean, callback: AsyncCallback\): void;
旧版本信息：|类名：Window;
方法or属性：setWindowKeepScreenOn(isKeepScreenOn: boolean, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowStage;
方法or属性：interface WindowStage
旧版本信息：|类名：WindowStage;
方法or属性：interface WindowStage
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowStage;
方法or属性：getMainWindow(): Promise\;
旧版本信息：|类名：WindowStage;
方法or属性：getMainWindow(): Promise\;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowStage;
方法or属性：getMainWindow(callback: AsyncCallback\): void;
旧版本信息：|类名：WindowStage;
方法or属性：getMainWindow(callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowStage;
方法or属性：getMainWindowSync(): Window;
旧版本信息：|类名：WindowStage;
方法or属性：getMainWindowSync(): Window;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowStage;
方法or属性：createSubWindow(name: string): Promise\;
旧版本信息：|类名：WindowStage;
方法or属性：createSubWindow(name: string): Promise\;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowStage;
方法or属性：createSubWindow(name: string, callback: AsyncCallback\): void;
旧版本信息：|类名：WindowStage;
方法or属性：createSubWindow(name: string, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowStage;
方法or属性：getSubWindow(): Promise\>;
旧版本信息：|类名：WindowStage;
方法or属性：getSubWindow(): Promise\>;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowStage;
方法or属性：getSubWindow(callback: AsyncCallback\>): void;
旧版本信息：|类名：WindowStage;
方法or属性：getSubWindow(callback: AsyncCallback\>): void;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowStage;
方法or属性：loadContent(path: string, storage?: LocalStorage): Promise\;
旧版本信息：|类名：WindowStage;
方法or属性：loadContent(path: string, storage?: LocalStorage): Promise\;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowStage;
方法or属性：loadContent(path: string, callback: AsyncCallback\): void;
旧版本信息：|类名：WindowStage;
方法or属性：loadContent(path: string, callback: AsyncCallback\): void;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowStage;
方法or属性：on(eventType: 'windowStageEvent', callback: Callback\): void;
旧版本信息：|类名：WindowStage;
方法or属性：on(eventType: 'windowStageEvent', callback: Callback\): void;
新版本信息：crossplatform|@ohos.window.d.ts| -|跨平台能力有变化|类名：WindowStage;
方法or属性：off(eventType: 'windowStageEvent', callback?: Callback\): void;
旧版本信息：|类名：WindowStage;
方法or属性：off(eventType: 'windowStageEvent', callback?: Callback\): void;
新版本信息：crossplatform|@ohos.window.d.ts| +|函数有变化|类名：Window;
方法or属性：off(type: 'windowEvent',callback:Callback\):void;|类名：Window;
方法or属性：off(type:'windowEvent',callback?: Callback\): void; +function sendShortMessage(options: SendMessageOptions): Promise; +``` + + + +**适配指导** + +使用变更后的接口，示例代码如下： + +```js +let sendCallback = function (err, data) { + console.log(`sendCallback: err->${JSON.stringify(err)}, data->${JSON.stringify(data)}`); +} +let deliveryCallback = function (err, data) { + console.log(`deliveryCallback: err->${JSON.stringify(err)}, data->${JSON.stringify(data)}`); +} +let slotId = 0; +let content = '短信内容'; +let destinationHost = '+861xxxxxxxxxx'; +let serviceCenter = '+861xxxxxxxxxx'; +let destinationPort = 1000; +let options = {slotId, content, destinationHost, serviceCenter, destinationPort, sendCallback, deliveryCallback}; +sms.sendShortMessage(options, (err) => { + console.log(`callback: err->${JSON.stringify(err)}`); +}); +``` + +```js +let sendCallback = function (err, data) { + console.log(`sendCallback: err->${JSON.stringify(err)}, data->${JSON.stringify(data)}`); +} +let deliveryCallback = function (err, data) { + console.log(`deliveryCallback: err->${JSON.stringify(err)}, data->${JSON.stringify(data)}`); +} +let slotId = 0; +let content = '短信内容'; +let destinationHost = '+861xxxxxxxxxx'; +let serviceCenter = '+861xxxxxxxxxx'; +let destinationPort = 1000; +let options = {slotId, content, destinationHost, serviceCenter, destinationPort, sendCallback, deliveryCallback}; +let promise = sms.sendShortMessage(options); +promise.then(() => { + console.log(`sendShortMessage success`); +}).catch(err => { + console.error(`sendShortMessage failed, promise: err->${JSON.stringify(err)}`); +}); + +``` diff --git a/zh-cn/release-notes/changelogs/OpenHarmony_4.0.9.2/changelogs-arkui.md b/zh-cn/release-notes/changelogs/OpenHarmony_4.0.9.2/changelogs-arkui.md index acae7487a62c3d5b59229e2887a268959cd3439a..d4caa661a7a5473c8cd3fa0ffef79d57aa04f9d0 100644 --- a/zh-cn/release-notes/changelogs/OpenHarmony_4.0.9.2/changelogs-arkui.md +++ b/zh-cn/release-notes/changelogs/OpenHarmony_4.0.9.2/changelogs-arkui.md @@ -77,4 +77,51 @@ struct ListExample { .padding({ top: 5 }) } } -``` \ No newline at end of file +``` + +## cl.arkui.2 ArkUI系统组件使用场景限制 + +对ArkUI系统组件的使用场景进行限制，仅允许在struct的build方法内， pageTransition方法内或@Builder修饰的函数内使用。 + +**示例：** + +``` +@Entry +@Component +struct Index { + build() { + Row() { + } + + } +} +// ERROR:UI component 'Text' cannot be used in this place. +Text('Hello World') +``` + +**变更影响** + + 如果ArkUI系统组件不在struct的build方法内，pageTransition方法内，@Builder修饰的函数内使用，编译报错。 + +**关键的接口/组件变更** + +不涉及。 + +**适配指导** + + ArkUI系统组件必须在struct的build方法内，pageTransition方法内，@Builder修饰的函数内使用。 + +## cl.arkui.3 RowSplit/ColumnSplit组件布局与行为变更 + +1、RowSplit/ColumnSplit交叉轴方向未设置大小时，由当前的适应父节点大小改为适应子节点大小。 +2、RowSplit/ColumnSplit分割线拖动后子节点行为变更，变更前拖动分割线时，子节点不压缩和拉伸，只进行平移； +变更后拖动分割线时，子节点拉伸和压缩。 +3、使用clip属性对子组件内容超出组件区域进行裁剪时，RowSplit裁剪区域由子组件区域的右侧改为子组件区域的左右两侧， +ColumnSplit裁剪区域由子组件区域的下侧改为子组件区域的上下两侧。 + +**变更影响** +以上3点变更只影响API version 10及以后版本，API version 9及以前RowSplit/ColumnSplit组件布局与行为仍遵循变更前规则。 + +**关键接口/组件变更** + +不涉及 diff --git a/zh-cn/release-notes/changelogs/OpenHarmony_4.0.9.2/changlogs-arkui.md b/zh-cn/release-notes/changelogs/OpenHarmony_4.0.9.2/changlogs-arkui.md deleted file mode 100644 index d43660575a74bb3b918be8379edc8d74fac5ff88..0000000000000000000000000000000000000000 --- a/zh-cn/release-notes/changelogs/OpenHarmony_4.0.9.2/changlogs-arkui.md +++ /dev/null @@ -1,33 +0,0 @@ -# arkui子系统ChangeLog - -## ArkUI系统组件使用限制 - - ArkUI系统组件必须在struct的build方法，pageTransition方法，@Builder修饰的函数内使用。 - -**示例：** - -``` -@Entry -@Component -struct Index { - build() { - Row() { - } - - } -} -// ERROR:UI component 'Text' cannot be used in this place. -Text('Hello World') -``` - -**变更影响** - - 如果ArkUI系统组件不在struct的build方法，pageTransition方法，@Builder修饰的函数内使用，编译报错。 - -**关键的接口/组件变更** - -不涉及。 - -**适配指导** - - ArkUI系统组件必须在struct的build方法，pageTransition方法，@Builder修饰的函数内使用。 diff --git a/zh-cn/release-notes/changelogs/OpenHarmony_4.0.9.3/changelogs-wifiManager.md b/zh-cn/release-notes/changelogs/OpenHarmony_4.0.9.3/changelogs-wifiManager.md new file mode 100644 index 0000000000000000000000000000000000000000..2ca92cb60b808544f3a7ae94b0ccd1460c219e03 --- /dev/null +++ b/zh-cn/release-notes/changelogs/OpenHarmony_4.0.9.3/changelogs-wifiManager.md @@ -0,0 +1,48 @@ +# wifi子系统ChangeLog + +## 1 权限变更。 + +1. 接口新增返回随机mac，取消位置权限。 +1. 返回真实mac需要GET_PEER_MAC权限。 + +| 接口声明 | 权限变更说明 | +| -------- | ---------------------------- | +|**function** getCandidateConfigs(): Array; | 1.取消位置权限 | +|**function** getDeviceConfigs(): Array; | 1.取消位置权限 | +|**function** getStations(): Array; | 1.取消位置权限;2.返回随机MAC(GET_PEER_MAC权限返回真实MAC) | +| **function** getScanInfoList(): Array; | 1.取消位置权限;2.返回随机MAC(GET_PEER_MAC权限返回真实MAC) | +| **function** getCurrentP2pGroup(): Promise; | 1.取消位置权限 | +| **function** getCurrentP2pGroup(callback: AsyncCallback): **void**; | 1.取消位置权限 | +| **function** getP2pPeerDevices(): Promise; | 1.取消位置权限;2.返回随机MAC(GET_PEER_MAC权限返回真实MAC) | +| **function** getP2pPeerDevices(callback: AsyncCallback): **void**; | 1.取消位置权限;2.返回随机MAC(GET_PEER_MAC权限返回真实MAC) | +| **function** p2pConnect(config: WifiP2PConfig): **void**; | 1.取消位置权限 | +| **function** startDiscoverDevices(): **void**; | 1.取消位置权限 | +| **function** getP2pGroups(): Promise>; | 1.取消位置权限 | +| **function** getP2pGroups(callback: AsyncCallback>): **void**; | 1.取消位置权限 | +| **function** on(**type**: "p2pDeviceChange", callback: Callback): **void**; | 1.取消位置权限;2.返回随机MAC(GET_PEER_MAC权限返回真实MAC) | +| **function** off(**type**: "p2pDeviceChange", callback?: Callback): **void**; | 1.取消位置权限;2.返回随机MAC(GET_PEER_MAC权限返回真实MAC) | +| **function** on(**type**: "p2pPeerDeviceChange", callback: Callback): **void**; | 1.取消位置权限;2.返回随机MAC(GET_PEER_MAC权限返回真实MAC) | +| **function** off(**type**: "p2pPeerDeviceChange", callback?: Callback): **void**; | 1.取消位置权限;2.返回随机MAC(GET_PEER_MAC权限返回真实MAC) | + + +### 2 新增接口声明 +| 接口声明 | 接口描述 | +|------|---------| +| **function** startScan(): **void**; | 启动扫描 | +| **function** getScanInfoList(): Array; | 获取扫描列表 | +| **function** setScanAlwaysAllowed(isScanAlwaysAllowed: boolean): **void**; | 设置后台扫描开关 | +| **function** getScanAlwaysAllowed(): boolean; | 获取后台扫描开关 | +| **function** getIpv6Info(): Ipv6Info; | 获取ipv6地址信息 | +| **function** isBandTypeSupported(bandType: WifiBandType): boolean; | 判断是否支持BandType | +| **function** get5GChannelList(): Array<**number**>; | 获取5G信道列表 | +| **function** getDisconnectedReason(): DisconnectedReason; | 获取网络断开原因 | + +### 3 废弃接口 + + +| 接口声明 |废弃说明 | +| ------------- |-------------------------------------------------------- | +| **function** scan(): **void**; | 使用startScan接口启动扫描 | +| **function** getScanResults(): Promise>; | 使用getScanInfoList获取扫描列表 | +| **function** getScanResults(callback: AsyncCallback>): **void**; | 使用getScanInfoList获取扫描列表 | +| **function** getScanResultsSync(): Array; | 使用getScanInfoList获取扫描列表 | diff --git a/zh-cn/release-notes/changelogs/OpenHarmony_4.0.9.5/changelogs-filemanagement.md b/zh-cn/release-notes/changelogs/OpenHarmony_4.0.9.5/changelogs-filemanagement.md new file mode 100644 index 0000000000000000000000000000000000000000..fe8a138de08225d8740733fee5a45ab96952e4b9 --- /dev/null +++ b/zh-cn/release-notes/changelogs/OpenHarmony_4.0.9.5/changelogs-filemanagement.md @@ -0,0 +1,25 @@ +# 文件管理子系统ChangeLog +## c1.filemanager.1 fileAccess 模块变更 +fileAccess 将不支持获取缩略图和媒体资源的部分查询 + +**变更影响** +1. getThumbnail 接口下架 +2. FILEKEY 图像和音频选项下架 + +**关键的接口/组件变更** +删除接口如下 + +| 类名 | 删除接口声明 | +| -------------- | ------------------------------------------------------------ | +| fileAccessHelper | getThumbnail(uri: string, size: image.Size): Promise;| +| fileAccessHelper | getThumbnail(uri: string, size: image.Size, callback: AsyncCallback): void;| + + 选项删除 +| 枚举类型 | 删除的键值 | +| -------- | ---- | +| FileKey | DURATION = 'duration' | +| FileKey | WIDTH = 'width' | +| FileKey | HEIGHT = 'height' | + + + diff --git a/zh-cn/release-notes/changelogs/v3.2-Release/changelogs-arkui.md b/zh-cn/release-notes/changelogs/v3.2-Release/changelogs-arkui.md index 23d453b41ef6811d484f1c62796676f6a2f1013b..204cfef02cb9f9dc919f08e6379e91609e5d91a5 100644 --- a/zh-cn/release-notes/changelogs/v3.2-Release/changelogs-arkui.md +++ b/zh-cn/release-notes/changelogs/v3.2-Release/changelogs-arkui.md @@ -304,3 +304,11 @@ pluginComponentManager.request({ } ) ``` + +## cl.arkui.4 FormComponent组件中的JS卡片禁用网络图片 + +FormComponent组件中的JS卡片禁止使用网络图片。 + +**变更影响** + +影响FormComponent中JS卡片中网络图片的加载显示。变更前JS卡片支持网络图片加载，变更后JS卡片不支持网络图片的加载。变更后建议将所需的网络图片下载至内存后刷新。 diff --git a/zh-cn/third-party-cases/app_quality_improvement_cases_about_crash.md b/zh-cn/third-party-cases/app_quality_improvement_cases_about_crash.md new file mode 100644 index 0000000000000000000000000000000000000000..3143a0c25a0ef47e45e145b598c90ec03b857d51 --- /dev/null +++ b/zh-cn/third-party-cases/app_quality_improvement_cases_about_crash.md @@ -0,0 +1,83 @@ +# 应用质量提升案例-应用Crash闪退问题案例分析 + +## 问题描述 + +OpenHarmony某应用点击多次或者页面切换时，会出现应用闪退现象。 + + + +## 问题现象 + +1.打印提示Crash，每次Crash的进程一致，均是Process name:com.chinasoftinc.launcher， 线程却不确定，mosquitto loop、jsThread-1随机出现； + +2.Crash的时机不确定，页面点击次数累计一定程序出现，native不回调JS function时不会出现Crash，JS function代码量多时，则Crash概率大，代码量小时，Crash概率小。 + + mosquitto loop、jsThread-1 二者crash随机出现 + +![img](figures/crash_1.png) + +mosquitto loop crash： + +![img](figures/crash_2.png) + +jsThread-1 crash： + +![img](figures/crash_3.png) + + Crash报错的其中两次堆栈信息如下，可以看到两次堆栈信息并不一致： + +![img](figures/crash_4.png) + +![img](figures/crash_5.png) + + + +## 问题分析 + +虽然每次crash的线程不一样，但范围是确定的，jsThread-1 或者 mosquitto loop，可以确定是两个线程交互的问题。 + +jsThread-1为UI线程，即应用页面对应的线程； + +mosquitto loop是用来监听mosquitto服务器是否有消息上来，有则触发JS Function回调函数； + +JS为单线程，没有锁，严格意义上不支持多线程，线程间的调度需要使用ArkUI统一的调度函数uv_queue_work来处理多线程调度问题。 + +如果不使用统一调度函数，会发生下面两种异常情况： + +1. jsThread-1线程运行时，mosquitto loop消息上来直接触发回调，会导致jsThread-1异常退出； + +2. mosquitto loop处理回调时，jsThread-1可能直接抢占处理，导致mosquitto loop异常退出。 + + + +## 问题冲突 + +Napi 提供了创建新线程的方法：napi_get_uv_event_loop，但只能在JS主线程中使用，uv_queue_work只能处理napi_get_uv_event_loop创建的线程，不支持mosquitto loop方式； + +若要监听消息，只能用mosquitto loop起新线程监听。 + + + +## 解决方案 + +问题本质原因是调用回调函数时出的问题： + +![img](figures/crash_6.png) + +监听消息的线程可以正常处理，与JS线程无冲突。 + +修改方案为：保留mosquitto loop获取消息，触发C处理消息上来事件，将原有消息事件处理中 直接调用napi_call_function 的方式改为 napi_get_uv_event_loop方式创建新的线程，uv_queue_work队列方式管理新线程调度，在新线程中调用napi_call_function。 + +消息事件处理函数： + +![img](figures/crash_7.png) + + 新线程中处理JS Function回调： + +![img](figures/crash_8.png) + + + +至此，crash问题得到解决。 + +希望本文能够为应用开发者处理类似crash问题提供帮助。 \ No newline at end of file diff --git a/zh-cn/third-party-cases/app_quality_improvement_cases_about_jserror.md b/zh-cn/third-party-cases/app_quality_improvement_cases_about_jserror.md new file mode 100644 index 0000000000000000000000000000000000000000..1710fe42fad3b341c91caa9e6da5f3df2b15aaaa --- /dev/null +++ b/zh-cn/third-party-cases/app_quality_improvement_cases_about_jserror.md @@ -0,0 +1,187 @@ +# 应用质量提升案例-稳定性测试常见JS_ERROR问题分析与定位 + +## 问题描述 + +本文案例分析OpenHarmony开发的应用进行稳定性测试遇到的JS_ERROR，对其产生的原因进行分析与定位，并给出解决方案。 + +几种常见的错误信息如下： + +1）Obj is not a valid object ：访问对象无效或不存在； + +2）is not callable ：调用方法不存在； + +3）Internal error. UI execution context not found：未找到UI执行的上下文。 + + + +## 案例分析 + +### softwareUpdate.js出现JS_ERROR + +问题描述： + +系统稳定性测试10000分钟，com.ohos.settings 出现 17次JS_ERROR(softwareUpdate.js)。 + +堆栈异常信息： + +``` +Module name:com.ohos.settings +Pid:28150 +Uid:20010012 +Lifetime: 0.000000s +Js-Engine: ark +page: pages/softwareUpdate.js +Error message: Obj is not a valid object +Stacktrace: + at get (\\MainAbility\\pages\\softwareUpdate.ets:512:25) + at loading (./pages/softwareUpdate.js:2127:16) + at anonymous (./pages/softwareUpdate.js:2141:13) +``` + +问题定位： + +该问题提示错误类型：Obj is not a valid object。 + +发生在调用 loading时get 操作，相关代码行数在commons.js中2141、2127、512等行数。 + +![img](figures/jserror_1.png) + +问题原因： + +经过代码比对、流程分析、hilog校对等方式，确认该问题是由于偶发退出页面时未销毁setInterval定时器，导致后台程序仍访问前台page页面中的全局变量this.angle。 + +通过模拟该场景可必现相同jserror日志。 + +解决措施： + +对业务代码流程进行梳理，确保开启/关闭定时器操作成对出现，避免再次发生后台程序访问前台page页面中的全局变量。 + + + +### notificationManage.js出现JS_ERROR + +问题描述： + +应用稳定性测试48小时，com.ohos.settings出现14次JS_ERROR(notificationManage.js)。 + +堆栈异常信息： + +``` +Module name:com.ohos.settings +Pid:17337 +Uid:20010012 +Lifetime: 0.000000s +Js-Engine: ark +page: pages/noticeApp/notificationManage.js +Error message: Obj is not a valid object +Stacktrace: + at initNotificationEnableInit (/pages/noticeApp/notificationManage.js:8479:16) + at initNotificationEnableInit (\pages\noticeApp\notificationManage.ets:31:5) + at anonymous (\pages\noticeApp\notificationManage.ets:20:7) +``` + + 问题定位： + +该问题提示错误类型：Obj is not a valid object。 + +发生在调用initNotificationEnableInit 时，相关代码行数在notificationManage.ets中20、31行，commons.js中8479行。 + +![img](figures/jserror_2.png) + +问题原因： + +经过代码比对、流程分析、hilog校对确认问题根因是notificationManage中调用initNotificationEnableInit 方法时参数非法，导致最终调用接口Notification.isNotificationEnabled时产生jserror。 + +解决措施： + +对非法参数进行异常处理。 + + + +### softwareUDiskUpdate.js出现JS_ERROR + +问题描述： + +系统稳定性测试10000分钟，com.ohos.settings 出现 1次JS_ERROR(softwareUDiskUpdate.js)。 + +堆栈信息： + +``` +Module name:com.ohos.settings +Pid:22221 +Uid:20010012 +Lifetime: 0.000000s +Js-Engine: ark +page: pages/softwareUDiskUpdate.js +Error message: is not callable +Stacktrace: + at anonymous (\\MainAbility\\pages\\softwareUDiskUpdate.ets:69:15) +``` + + 问题定位：该问题提示错误类型：is not callable。 + +发生softwareUDiskUpdate.ets中，相关代码行数69行。 + +![img](figures/jserror_3.png) + +问题原因： + +经过代码比对、流程分析、hilog校对确认问题根因是调用系统不存在的接口：UpdateSystemFromUDisk()。 + +解决措施： + +此部分代码为冗余未删除代码，需要进行代码清理。 + + + +### wifiPsd.js出现JS_ERROR + +问题描述： + +系统稳定性测试72小时，com.ohos.settings出现1次JS_ERROR:ohos_router_1.back。 + +堆栈信息： + +``` +Module name:com.ohos.settings +Version:2.0.0.002 +Pid:3995 +Uid:20010028 +Reason:Error +Error message:Internal error. UI execution context not found. +SourceCode: + _ohos_router_1.back({ + ^ +Stacktrace: + at anonymous (D:/WorkSpace/Code/Common_Master_3.2/product_min_system/kh_applications_system/applications_settings/product/phone/build/default/intermediates/loader_out/default/ets/pages/wlan/wifiPsd_.js:1197:17) + at anonymous (D:/WorkSpace/Code/Common_Master_3.2/product_min_system/kh_applications_system/applications_settings/product/phone/build/default/intermediates/loader_out/default/ets/MainAbility/MainAbility_.js:2009:17) + at anonymous (D:/WorkSpace/Code/Common_Master_3.2/product_min_system/kh_applications_system/applications_settings/product/phone/build/default/intermediates/loader_out/default/ets/MainAbility/MainAbility_.js:2008:13) +``` + + 问题定位： + +该问题错误提示：UI execution context not found。 + +发生在wifiPsd.js中，调用router.back()函数时出现异常。 + +![img](figures/jserror_4.png) + +问题原因： + +当在异步回调中执行router.back()时，会产生已经不在当前页面的现象，导致router操作失败，例如： + +1）在A页面设置定时器setTimeOut 5秒后router到B页面； + +2）在5S内手动点击切换到其他非A页面上，等待A页面设置的定时器setTimeOut执行时，必现jserror。 + +解决措施： + +对调用router.back()处代码添加try-catch保护。 + + + +## 总结 + +随着OpenHarmony生态的推广，对应的应用开发IDE、测试工具等也会不断完善，应用层面的错误信息也会披露的越来越清晰。大家在应用开发的过程中如果遇到JS_ERROR，可以通过阅读给出的堆栈或者log信息，结合代码来定位问题。 + +希望本文能够为应用开发者在此方面提供一些参考。 \ No newline at end of file diff --git a/zh-cn/third-party-cases/distributed-canvas.md b/zh-cn/third-party-cases/distributed-canvas.md new file mode 100644 index 0000000000000000000000000000000000000000..911ba45da6ba3395f434e7f6a338d2ace302fdbd --- /dev/null +++ b/zh-cn/third-party-cases/distributed-canvas.md @@ -0,0 +1,417 @@ +# 分布式画布流转场景 + +## 场景说明 + +两台设备组网，当其中一个设备修改文件时，两个设备可以同步修改的结果。分布式场景可以在协同办公（如多人多设备编辑同一文件），设备文档更新（分布式设备更新文件内容，所有设备同步更新）中发挥重要作用，有助于加快工作效率，减少工作中的冗余。 + +本示例将为大家介绍如何实现上述功能。 + +## 效果呈现 + +本例效果如下： + +| 设置分布式权限 | 进行分布式连接 | 连接后状态显示 | +| -------------------------------------- | ------------------------------------------ | ----------------------------------------- | +| ![](figures/disributed_permission.png) | ![](figures/disributed_canvas_connect.png) | ![](figures/disributed_canvas-before.png) | + +| 点击rect和ellipse按钮后后本机显示 | 另外一台机器分布式应用显示 | +| ---------------------------------------- | ---------------------------------------- | +| ![](figures/disributed_canvas-after.png) | ![](figures/disributed_canvas-after.png) | + +## 运行环境 + +本例基于以下环境开发，开发者也可以基于其他适配的版本进行开发。 + +- IDE：DevEco Studio 4.0.0.201 Beta1 +- SDK：Ohos_sdk_public 4.0.7.5 (API Version 10 Beta1) + +## 实现思路 + +在分布式文件场景中，分布式设备管理包含了分布式设备搜索、分布式设备列表弹窗、远端设备拉起三部分。 +首先在分布式组网内搜索设备，然后把设备展示到分布式设备列表弹窗中，最后根据用户的选择拉起远端设备。 + +- 分布式设备搜索：通过SUBSCRIBE_ID搜索分布式组网内的设备。 + +- 分布式设备列表弹窗：使用@CustomDialog装饰器来装饰分布式设备列表弹窗。 + +- 远端设备拉起：通过startAbility(deviceId)方法拉起远端设备的包。 + +- 分布式数据管理：(1)管理分布式数据库：创建一个distributedObject分布式数据对象实例，用于管理分布式数据对象。 + + ​ (2)订阅分布式数据变化：通过this.distributedObject.on('status', this.statusCallback)监听分布式数据对象的变更。 + +## 开发步骤 + +1. 申请所需权限 + + 在model.json5中添加以下配置： + + ```json + "requestPermissions": [ + { + "name": "ohos.permission.DISTRIBUTED_DATASYNC"//允许不同设备间的数据交换 + }, + { + "name": "ohos.permission.ACCESS_SERVICE_DM"//允许系统应用获取分布式设备的认证组网能力 + } + ] + ``` + +2. 构建UI框架 + + indexCanvas页面： + + TitleBar组件呈现标题栏。通过数据懒加载的方式遍历绘制的图形。被划出可视区域外的资源会被回收。 + + 绘制ellipse图形、rect图形的按钮使用Button组件呈现。 + + 返回按钮、删除按钮也通过Button组件呈现。 + + ```typescript + build() { + Column() { + TitleBar({ rightBtn: $r('app.media.trans'), onRightBtnClicked: this.showDialog }) + //自/common/TitleBar.ets中引入标题栏相关。点击标题栏中的右侧按钮会调用showDialog()函数连接组网设备 + Row() { + Text($r('app.string.state')) + .fontSize(30) + Image(this.isOnline ? $r('app.media.green') : $r('app.media.red')) + .size({ width: 30, height: 30 }) + .objectFit(ImageFit.Contain) + } + .width('100%') + .padding(16) + //通过懒加载模式遍历绘制的图形，将每个图形绘制在画布上 + LazyForEach(this.canvasDataSource, (item: CanvasPath, index) => { + Canvas(this.context) + .width('100%') + .height(200) + .backgroundColor('#00ffff') + .onReady(() => { + if (item.path === 'rect') { + this.context.save(); + this.path2Df.rect(80, 80, 100, 100); + this.context.stroke(this.path2Df); + this.context.restore(); + } + if (item.path === 'ellipse') { + this.context.restore(); + this.path2De.ellipse(100, 100, 50, 100, Math.PI * 0.25, Math.PI * 0.5, Math.PI); + this.context.stroke(this.path2De); + this.context.save(); + } + }) + }, item => JSON.stringify(item)) + + Row() { + Button('ellipse')//绘制ellipse图形的按钮 + .width(130) + .height(45) + .key('ellipse') + .onClick(() => { + if (this.globalObject.isContainString('ellipse') === -1) { + this.globalObject.add('ellipse'); //将绘制信息保存在持久全局数据中 + } + this.onPageShow(); + }) + Button('rect')//绘制rect图形的按钮 + .width(130) + .height(45) + .key('rect') + .onClick(() => { + if (this.globalObject.isContainString('rect') === -1) { + this.globalObject.add('rect'); + } + this.onPageShow(); + }) + }.margin({ top: 10 }) + .width('100%') + .justifyContent(FlexAlign.SpaceAround) + + Row() { + Button('back') + .width(130) + .height(45) + .key('back') + .backgroundColor(Color.Orange) + .onClick(() => { + router.back() + }) + Button('delete')//删除图形 + .width(130) + .height(45) + .key('delete') + .onClick(() => { + this.globalObject.clear(); + this.canvasDataSource['pathArray'] = []; + this.canvasDataSource.notifyDataReload(); + this.context.clearRect(0, 0, 950, 950) + }) + }.margin({ top: 10 }) + .width('100%') + .justifyContent(FlexAlign.SpaceAround) + } + .width('100%') + .height('100%') + .justifyContent(FlexAlign.Center) + .alignItems(HorizontalAlign.Center) + } + } + ``` + +3. 数据model + + 通过registerDataChangeListener进行对数据变动的监听，数据发生变化时，调用notifyDataReload方法通知数据已经准备就绪。 + + ```typescript + //BasicDataSource.ets + class BasicDataSource implements IDataSource { + private listeners: DataChangeListener[] = [] + + public totalCount(): number { + return 0 + } + + public getData(index: number): any { + return undefined + } + + //注册数据变动的监听 + registerDataChangeListener(listener: DataChangeListener): void { + if (this.listeners.indexOf(listener) < 0) { + console.info('add listener') + this.listeners.push(listener) + } + } + + unregisterDataChangeListener(listener: DataChangeListener): void { + const pos = this.listeners.indexOf(listener); + if (pos >= 0) { + console.info('remove listener') + this.listeners.splice(pos, 1) + } + } + + //数据reloaded，分布式数据数值变化需要调用这个接口重载下 + notifyDataReload(): void { + this.listeners.forEach(listener => { + listener.onDataReloaded() + }) + } + + notifyDataAdd(index: number): void { + this.listeners.forEach(listener => { + listener.onDataAdd(index) + }) + } + + .... + + export class CanvasDataSource extends BasicDataSource { + //监听的数据类型 + private pathArray: Canvas[] = [] + + //重载接口 + public totalCount(): number { + return this.pathArray.length + } + + public getData(index: number): any { + return this.pathArray[index] + } + + public addData(index: number, data: Canvas): void { + this.pathArray.splice(index, 0, data) + this.notifyDataAdd(index) + } + + public pushData(data: Canvas): void { + this.pathArray.push(data) + this.notifyDataAdd(this.pathArray.length - 1) + } + } + ``` + +4. 将两台设备组网 + + 使用自RemoteDeviceModel.ts中引入的类RemoteDeviceModel以扫描获得附近可以连接的设备。 + + ```typescript + showDialog = () => { + //RemoteDeviceModel引入自model/RemoteDeviceModel.ts + RemoteDeviceModel.registerDeviceListCallback(() => { + //得到附近可信的设备列表 + Logger.info(TAG, 'registerDeviceListCallback, callback entered') + this.devices = [] + this.devices = RemoteDeviceModel.discoverDevices.length > 0 ? RemoteDeviceModel.discoverDevices : RemoteDeviceModel.devices + if (this.dialogController) { + this.dialogController.close() + this.dialogController = undefined + } + this.dialogController = new CustomDialogController({ + builder: DeviceDialog({ + devices: this.devices, + onSelectedIndexChange: this.onSelectedDevice + }), + autoCancel: true + }) + this.dialogController.open() + }) + } + .................................... + //model/RemoteDeviceModel.ts + import deviceManager from '@ohos.distributedHardware.deviceManager' + registerDeviceListCallback(stateChangeCallback: () => void) { + if (typeof (this.deviceManager) !== 'undefined') { + this.registerDeviceListCallbackImplement(stateChangeCallback) + return + } + Logger.info(TAG, 'deviceManager.createDeviceManager begin') + try { + deviceManager.createDeviceManager(BUNDLE, (error, value) => { + if (error) { + Logger.error(TAG, 'createDeviceManager failed.') + return + } + this.deviceManager = value + this.registerDeviceListCallbackImplement(stateChangeCallback) + Logger.info(TAG, `createDeviceManager callback returned,value=${value}`) + }) + } catch (error) { + Logger.error(TAG, `createDeviceManager throw error, code=${error.code} message=${error.message}`) + } + + Logger.info(TAG, 'deviceManager.createDeviceManager end') + } + registerDeviceListCallbackImplement(stateChangeCallback: () => void) { + Logger.info(TAG, 'registerDeviceListCallback') + this.stateChangeCallback = stateChangeCallback + if (this.deviceManager === undefined) { + Logger.error(TAG, 'deviceManager has not initialized') + this.stateChangeCallback() + return + } + Logger.info(TAG, 'getTrustedDeviceListSync begin') + try { + let list = this.deviceManager.getTrustedDeviceListSync()//同步获取所有可信设备列表 + Logger.info(TAG, `getTrustedDeviceListSync end, devices=${JSON.stringify(list)}`) + if (typeof (list) !== 'undefined' && typeof (list.length) !== 'undefined') { + this.devices = list + } + } catch (error) { + Logger.error(TAG, `getLocalDeviceInfoSync throw error, code=${error.code} message=${error.message}`) + } + this.stateChangeCallback() + Logger.info(TAG, 'callback finished') + try { + this.deviceManager.on('deviceStateChange', (data) => { + if (data === null) { + return + } + Logger.info(TAG, `deviceStateChange data = ${JSON.stringify(data)}`) + switch (data.action) { + case deviceManager.DeviceStateChangeAction.READY://即设备处于可用状态，表示设备间信息已在分布式数据中同步完成, 可以运行分布式业务 + this.discoverDevices = [] + this.devices.push(data.device) + this.stateChangeCallback() + try { + let list = this.deviceManager.getTrustedDeviceListSync() + if (typeof (list) !== 'undefined' && typeof (list.length) !== 'undefined') { + this.devices = list + } + } catch (error) { + Logger.error(TAG, `getTrustedDeviceListSync throw error, code=${error.code} message=${error.message}`) + } + this.stateChangeCallback() + break + default: + break + } + }) + this.deviceManager.on('deviceFound', (data) => { + if (data === null) { + return + } + Logger.info(TAG, `deviceFound data=${JSON.stringify(data)}`) + this.onDeviceFound(data) + }) + this.deviceManager.on('discoverFail', (data) => { + Logger.info(TAG, `discoverFail data=${JSON.stringify(data)}`) + }) + this.deviceManager.on('serviceDie', () => { + Logger.info(TAG, 'serviceDie') + }) + } catch (error) { + Logger.error(TAG, `on throw error, code=${error.code} message=${error.message}`) + } + this.startDeviceDiscovery() + } + startDeviceDiscovery() { + SUBSCRIBE_ID = Math.floor(65536 * Math.random()) + var info = { + subscribeId: SUBSCRIBE_ID, + mode: 0xAA, + medium: 2, + freq: 2,//高频率 + isSameAccount: false, + isWakeRemote: true, + capability: 0 + } + Logger.info(TAG, `startDeviceDiscovery${SUBSCRIBE_ID}`) + try { + this.deviceManager.startDeviceDiscovery(info)//开始发现周边设备 + } catch (error) { + Logger.error(TAG, `startDeviceDiscovery throw error, code=${error.code} message=${error.message}`) + } + + } + ``` + +5. 实现同步编辑 + + 通过AppStorage设置持久性数据，然后实现IDataSource接口，通过注册数据监听接口监听数据的变化。 + + ```typescript + onPageShow() { + //每当完成编辑或者新建文件，就会回到主页，此时就会执行onPageShow() + //noteDataSource获取globalObject保存的分布式的持久性数据，并进行Reload操作传递。 + this.noteDataSource['dataArray'] = this.globalObject.distributedObject.documents + this.noteDataSource.notifyDataReload() + Logger.info(TAG, `this.sessionId = ${this.sessionId}`) + Logger.info(TAG, `globalSessionId = ${this.globalSessionId}`) + if (this.sessionId !== this.globalSessionId) { + this.sessionId = this.globalSessionId + this.share() + } + } + share() { + //多个设备间的对象如果设置为同一个sessionId，数据自动同步 + Logger.info(TAG, `sessionId = ${this.sessionId}`) + this.globalObject.setChangeCallback(() => { + this.noteDataSource['dataArray'] = this.globalObject.distributedObject.documents + this.noteDataSource.notifyDataReload() + }) + this.globalObject.setStatusCallback((session, networkId, status) => { + Logger.info(TAG, `StatusCallback,${status}`) + if (status === 'online') { + this.isOnline = true + } else { + this.isOnline = false + } + }) + this.globalObject.distributedObject.setSessionId(this.sessionId) + AppStorage.SetOrCreate('objectModel', this.globalObject) + } + ``` + +## 全部代码 + +本例完整代码sample示例链接：[分布式对象](https://gitee.com/openharmony/applications_app_samples/tree/master/code/SuperFeature/DistributedAppDev/DistributedNote) + +## 参考 + +[权限列表](../application-dev/security/permission-list.md#ohospermissiondistributed_datasync) + +[Path2D对象](../application-dev/reference/arkui-ts/ts-components-canvas-path2d.md) + +[分布式数据对象](../application-dev/reference/apis/js-apis-data-distributedobject.md) diff --git a/zh-cn/third-party-cases/distributed-file.md b/zh-cn/third-party-cases/distributed-file.md new file mode 100644 index 0000000000000000000000000000000000000000..2cef7070e7aa4479d5b4c69639e91d06d2ad1f4f --- /dev/null +++ b/zh-cn/third-party-cases/distributed-file.md @@ -0,0 +1,482 @@ +# 分布式文件场景 + +## 场景说明 + +两台设备组网的分布式场景是工作中常常需要的。常见的如代码的同步编辑、文档的同步修改等。这样的分布式场景有助于加快工作效率，减少工作中的冗余，本例将为大家介绍如何实现上述功能。 + +## 效果呈现 + +本例效果如下： + +| 设置分布式权限 | 进行分布式连接 | 连接后状态显示 | +| -------------------------------------- | ---------------------------------------- | --------------------------------------- | +| ![](figures/disributed_permission.png) | ![](figures/disributed_note_connect.png) | ![](figures/disributed_note-before.png) | + +| 点击添加进入编辑界面 | 保存后本机显示 | 另外一台机器分布式应用显示 | +| ------------------------------------- | -------------------------------------- | -------------------------------------- | +| ![](figures/disributed_note-edit.png) | ![](figures/disributed_note-after.png) | ![](figures/disributed_note-after.png) | + +## 运行环境 + +本例基于以下环境开发，开发者也可以基于其他适配的版本进行开发。 + +- IDE：DevEco Studio 4.0.0.201 Beta1 +- SDK：Ohos_sdk_public 4.0.7.5 (API Version 10 Beta1) + +## 实现思路 + +在分布式文件场景中，分布式设备管理包含了分布式设备搜索、分布式设备列表弹窗、远端设备拉起三部分。 +首先在分布式组网内搜索设备，然后把设备展示到分布式设备列表弹窗中，最后根据用户的选择拉起远端设备。 + +- 分布式设备搜索：通过SUBSCRIBE_ID搜索分布式组网内的设备。 + +- 分布式设备列表弹窗：使用@CustomDialog装饰器来装饰分布式设备列表弹窗。 + +- 远端设备拉起：通过startAbility(deviceId)方法拉起远端设备的包。 + +- 分布式数据管理：(1)管理分布式数据库：创建一个distributedObject分布式数据对象实例，用于管理分布式数据对象。 + + ​ (2)订阅分布式数据变化：通过this.distributedObject.on('status', this.statusCallback)监听分布式数据对象的变更。 + +## 开发步骤 + +1. 申请所需权限 + + 在model.json5中添加以下配置： + + ```json + "requestPermissions": [ + { + "name": "ohos.permission.DISTRIBUTED_DATASYNC"//允许不同设备间的数据交换 + }, + { + "name": "ohos.permission.ACCESS_SERVICE_DM"//允许系统应用获取分布式设备的认证组网能力 + } + ] + ``` + +2. 构建UI框架 + + index页面： + + TitleBar组件呈现标题栏。使用List组件呈现文件列表，ListItem由一个呈现文件类型标志的Image组件，一个呈现文件标题的Text组件，一个呈现文件内容的Text组件组成。 + + ```typescript + build() { + Column() { + TitleBar({ rightBtn: $r('app.media.trans'), onRightBtnClicked: this.showDialog }) + //自/common/TitleBar.ets中引入标题栏相关。点击标题栏中的右侧按钮会调用showDialog()函数连接组网设备 + Row() { + Text($r('app.string.state')) + .fontSize(30) + Image(this.isOnline ? $r('app.media.green') : $r('app.media.red'))//两台设备组网成功后状态显示为绿色、否则为红色 + .size({ width: 30, height: 30 }) + .objectFit(ImageFit.Contain) + } + .width('100%') + .padding(16) + //通过数据懒加载的方式从数据源中每次迭代一个文件进行展示，可用列表被放置在滚动容器中，被划出可视区域外的资源会被回收 + List({ space: 10 }) { + LazyForEach(this.noteDataSource, (item: Note, index) => { + ListItem() { + NoteItem({ note: item, index: index })//NoteItem引入自common/NoteItem.ets,负责主页文件信息的呈现 + .id(`${item.title}`) + } + }, item => JSON.stringify(item)) + } + .width('95%') + .margin(10) + .layoutWeight(1) + + Row() { + Column() { + Image($r('app.media.clear'))//清除按钮 + .size({ width: 40, height: 40 }) + Text($r('app.string.clear')) + .fontColor(Color.Red) + .fontSize(20) + }.layoutWeight(1) + .id('clearNote') + .onClick(() => { + //点击清除按钮清除所有文件 + Logger.info(TAG, 'clear notes') + this.noteDataSource['dataArray'] = [] + this.noteDataSource.notifyDataReload() + this.globalObject.clear() + AppStorage.SetOrCreate('sessionId', this.sessionId) + }) + + Column() { + Image($r('app.media.add'))//添加按钮 + .size({ width: 40, height: 40 }) + Text($r('app.string.add')) + .fontColor(Color.Black) + .fontSize(20) + }.layoutWeight(1) + .id('addNote') + .onClick(() => { + //点击添加按钮跳转到编辑页面 + router.push({ + url: 'pages/Edit', + params: { + note: new Note('', '', -1), + isAdd: true + } + }) + }) + } + .width('100%') + .padding(10) + .backgroundColor('#F0F0F0') + } + .width('100%') + .height('100%') + .backgroundColor('#F5F5F5') + } + } + ... + //common/NoteItem.ets + import router from '@ohos.router' + import { MARKS } from '../model/Const' + import Note from '../model/Note' + + @Component + export default struct NoteItem { + @State note: Note | undefined = undefined + private index: number = 0 + + build() { + Row() { + Image(this.note.mark >= 0 ? MARKS[this.note.mark] : $r('app.media.note'))//文件标志图片 + .size({ width: 30, height: 30 }) + .objectFit(ImageFit.Contain) + Column() { + Text(this.note.title)//文件标题 + .fontColor(Color.Black) + .fontSize(30) + .maxLines(1) + .textOverflow({ overflow: TextOverflow.Ellipsis }) + Text(this.note.content)//文件内容 + .fontColor(Color.Gray) + .margin({ top: 10 }) + .fontSize(25) + .maxLines(1)//在列表中最多展示一行 + .textOverflow({ overflow: TextOverflow.Ellipsis }) + } + .alignItems(HorizontalAlign.Start) + .margin({ left: 20 }) + } + .padding(16) + .width('100%') + .borderRadius(16) + .backgroundColor(Color.White) + .onClick(() => { + //点击文件进入此文件编辑页面 + router.push({ + url: 'pages/Edit', + params: { + index: this.index, + note: this.note, + isAdd: false + } + }) + }) + } + } + ``` + + Edit页面： + + 使用TextInput组件呈现文件标题输入框，使用TextArea组件呈现文件内容的输入区域，使用Button组件呈现保存按钮并绑定点击事件以新建或更新文件内容。 + + ```typescript + build() { + Column() { + TitleBar({ title: this.note.title === '' ? $r('app.string.add_note') : this.note.title }) + Column() { + Row() { + Image(this.note.mark >= 0 ? MARKS[this.note.mark] : $r('app.media.mark')) + .width(30) + .aspectRatio(1) + .margin({ left: 16, top: 16 }) + .objectFit(ImageFit.Contain) + .alignSelf(ItemAlign.Start) + Select([{ value: ' ', icon: MARKS[0] }, + { value: ' ', icon: MARKS[1] }, + { value: ' ', icon: MARKS[2] }, + { value: ' ', icon: MARKS[3] }, + { value: ' ', icon: MARKS[4] }]) + .selected(this.note.mark) + .margin({ top: 5 }) + .onSelect((index: number) => { + this.note.mark = index + }) + } + .width('100%') + + TextInput({ placeholder: 'input the title', text: this.note.title })//文件标题输入框 + .id('titleInput') + .placeholderColor(Color.Gray) + .fontSize(30) + .margin({ left: 15, right: 15, top: 15 }) + .height(60) + .backgroundColor(Color.White) + .onChange((value: string) => { + this.note.title = value + }) + TextArea({ placeholder: 'input the content', text: this.note.content })//文件内容输入区域 + .id('contentInput') + .placeholderColor(Color.Gray) + .backgroundColor(Color.White) + .fontSize(30) + .height('35%') + .margin({ left: 16, right: 16, top: 16 }) + .textAlign(TextAlign.Start) + .onChange((value: string) => { + this.note.content = value + }) + + Button() { + //保存按钮 + Text($r('app.string.save')) + .fontColor(Color.White) + .fontSize(17) + } + .id('saveNote') + .backgroundColor('#0D9FFB') + .height(50) + .width(200) + .margin({ top: 20 }) + .onClick(() => { + //点击按钮时调用model/DistributedObjectModel.ts定义的类globalObject中的方法 + if (!this.isAdd) { + let index = router.getParams()['index'] + this.globalObject.update(index, this.note.title, this.note.content, this.note.mark)//编辑时更新内容 + } else { + this.globalObject.add(this.note.title, this.note.content, this.note.mark)//新建时添加内容 + } + router.back()//返回主页 + }) + } + } + .width('100%') + .height('100%') + .backgroundColor('#F5F5F5') + } + } + ``` + +3. 将两台设备组网 + + 使用自RemoteDeviceModel.ts中引入的类RemoteDeviceModel以扫描获得附近可以连接的设备。 + + ```typescript + showDialog = () => { + //RemoteDeviceModel引入自model/RemoteDeviceModel.ts + RemoteDeviceModel.registerDeviceListCallback(() => { + //得到附近可信的设备列表 + Logger.info(TAG, 'registerDeviceListCallback, callback entered') + this.devices = [] + this.devices = RemoteDeviceModel.discoverDevices.length > 0 ? RemoteDeviceModel.discoverDevices : RemoteDeviceModel.devices + if (this.dialogController) { + this.dialogController.close() + this.dialogController = undefined + } + this.dialogController = new CustomDialogController({ + builder: DeviceDialog({ + devices: this.devices, + onSelectedIndexChange: this.onSelectedDevice + }), + autoCancel: true + }) + this.dialogController.open() + }) + } + ... + //model/RemoteDeviceModel.ts + import deviceManager from '@ohos.distributedHardware.deviceManager' + registerDeviceListCallback(stateChangeCallback: () => void) { + if (typeof (this.deviceManager) !== 'undefined') { + this.registerDeviceListCallbackImplement(stateChangeCallback) + return + } + Logger.info(TAG, 'deviceManager.createDeviceManager begin') + try { + deviceManager.createDeviceManager(BUNDLE, (error, value) => { + if (error) { + Logger.error(TAG, 'createDeviceManager failed.') + return + } + this.deviceManager = value + this.registerDeviceListCallbackImplement(stateChangeCallback) + Logger.info(TAG, `createDeviceManager callback returned,value=${value}`) + }) + } catch (error) { + Logger.error(TAG, `createDeviceManager throw error, code=${error.code} message=${error.message}`) + } + + Logger.info(TAG, 'deviceManager.createDeviceManager end') + } + registerDeviceListCallbackImplement(stateChangeCallback: () => void) { + Logger.info(TAG, 'registerDeviceListCallback') + this.stateChangeCallback = stateChangeCallback + if (this.deviceManager === undefined) { + Logger.error(TAG, 'deviceManager has not initialized') + this.stateChangeCallback() + return + } + Logger.info(TAG, 'getTrustedDeviceListSync begin') + try { + let list = this.deviceManager.getTrustedDeviceListSync()//同步获取所有可信设备列表 + Logger.info(TAG, `getTrustedDeviceListSync end, devices=${JSON.stringify(list)}`) + if (typeof (list) !== 'undefined' && typeof (list.length) !== 'undefined') { + this.devices = list + } + } catch (error) { + Logger.error(TAG, `getLocalDeviceInfoSync throw error, code=${error.code} message=${error.message}`) + } + this.stateChangeCallback() + Logger.info(TAG, 'callback finished') + try { + this.deviceManager.on('deviceStateChange', (data) => { + if (data === null) { + return + } + Logger.info(TAG, `deviceStateChange data = ${JSON.stringify(data)}`) + switch (data.action) { + case deviceManager.DeviceStateChangeAction.READY://即设备处于可用状态，表示设备间信息已在分布式数据中同步完成, 可以运行分布式业务 + this.discoverDevices = [] + this.devices.push(data.device) + this.stateChangeCallback() + try { + let list = this.deviceManager.getTrustedDeviceListSync() + if (typeof (list) !== 'undefined' && typeof (list.length) !== 'undefined') { + this.devices = list + } + } catch (error) { + Logger.error(TAG, `getTrustedDeviceListSync throw error, code=${error.code} message=${error.message}`) + } + this.stateChangeCallback() + break + default: + break + } + }) + this.deviceManager.on('deviceFound', (data) => { + if (data === null) { + return + } + Logger.info(TAG, `deviceFound data=${JSON.stringify(data)}`) + this.onDeviceFound(data) + }) + this.deviceManager.on('discoverFail', (data) => { + Logger.info(TAG, `discoverFail data=${JSON.stringify(data)}`) + }) + this.deviceManager.on('serviceDie', () => { + Logger.info(TAG, 'serviceDie') + }) + } catch (error) { + Logger.error(TAG, `on throw error, code=${error.code} message=${error.message}`) + } + this.startDeviceDiscovery() + } + startDeviceDiscovery() { + SUBSCRIBE_ID = Math.floor(65536 * Math.random()) + var info = { + subscribeId: SUBSCRIBE_ID, + mode: 0xAA, + medium: 2, + freq: 2,//高频率 + isSameAccount: false, + isWakeRemote: true, + capability: 0 + } + Logger.info(TAG, `startDeviceDiscovery${SUBSCRIBE_ID}`) + try { + this.deviceManager.startDeviceDiscovery(info)//开始发现周边设备 + } catch (error) { + Logger.error(TAG, `startDeviceDiscovery throw error, code=${error.code} message=${error.message}`) + } + + } + ``` + +4. 实现同步编辑 + + 通过AppStorage设置持久性数据，然后实现IDataSource接口，通过注册数据监听接口监听数据的变化。 + + ```typescript + class BasicDataSource implements IDataSource { + private listeners: DataChangeListener[] = [] + + public totalCount(): number { + return 0 + } + + public getData(index: number): any { + return undefined + } + + registerDataChangeListener(listener: DataChangeListener): void { + if (this.listeners.indexOf(listener) < 0) { + console.info('add listener') + this.listeners.push(listener) + } + } + + unregisterDataChangeListener(listener: DataChangeListener): void { + const pos = this.listeners.indexOf(listener); + if (pos >= 0) { + console.info('remove listener') + this.listeners.splice(pos, 1) + } + } + //数据准备好了 + notifyDataReload(): void { + this.listeners.forEach(listener => { + listener.onDataReloaded() + }) + } + ... + } + + onPageShow() { + //每当完成编辑或者新建文件，就会回到主页，此时就会执行onPageShow() + //noteDataSource获取globalObject保存的分布式的持久性数据，并进行Reload操作传递。 + this.noteDataSource['dataArray'] = this.globalObject.distributedObject.documents + this.noteDataSource.notifyDataReload() + Logger.info(TAG, `this.sessionId = ${this.sessionId}`) + Logger.info(TAG, `globalSessionId = ${this.globalSessionId}`) + if (this.sessionId !== this.globalSessionId) { + this.sessionId = this.globalSessionId + this.share() + } + } + share() { + //多个设备间的对象如果设置为同一个sessionId的笔记数据自动同步 + Logger.info(TAG, `sessionId = ${this.sessionId}`) + this.globalObject.setChangeCallback(() => { + this.noteDataSource['dataArray'] = this.globalObject.distributedObject.documents + this.noteDataSource.notifyDataReload() + }) + this.globalObject.setStatusCallback((session, networkId, status) => { + Logger.info(TAG, `StatusCallback,${status}`) + if (status === 'online') { + this.isOnline = true + } else { + this.isOnline = false + } + }) + this.globalObject.distributedObject.setSessionId(this.sessionId) + AppStorage.SetOrCreate('objectModel', this.globalObject) + } + ``` + +## 全部代码 + +本例完整代码sample示例链接：[分布式对象](https://gitee.com/openharmony/applications_app_samples/tree/master/code/SuperFeature/DistributedAppDev/DistributedNote) + +## 参考 + +- [权限列表](../application-dev/security/permission-list.md#ohospermissiondistributed_datasync) +- [分布式数据对象](../application-dev/reference/apis/js-apis-data-distributedobject.md) diff --git a/zh-cn/third-party-cases/figures/bluetooth_delete.png b/zh-cn/third-party-cases/figures/bluetooth_delete.png new file mode 100644 index 0000000000000000000000000000000000000000..60e73b525e27c0eb73e3f437e749bc96eff16943 Binary files /dev/null and b/zh-cn/third-party-cases/figures/bluetooth_delete.png differ diff --git a/zh-cn/third-party-cases/figures/bluetooth_delete_en.png b/zh-cn/third-party-cases/figures/bluetooth_delete_en.png new file mode 100644 index 0000000000000000000000000000000000000000..e9b040c7cd39ba4162feb5f4da81dbc0e64af474 Binary files /dev/null and b/zh-cn/third-party-cases/figures/bluetooth_delete_en.png differ diff --git a/zh-cn/third-party-cases/figures/bluetooth_dialog.png b/zh-cn/third-party-cases/figures/bluetooth_dialog.png new file mode 100644 index 0000000000000000000000000000000000000000..38ab4a29a780b6baba25d353a170c0f74743b668 Binary files /dev/null and b/zh-cn/third-party-cases/figures/bluetooth_dialog.png differ diff --git a/zh-cn/third-party-cases/figures/bluetooth_dialog_en.png b/zh-cn/third-party-cases/figures/bluetooth_dialog_en.png new file mode 100644 index 0000000000000000000000000000000000000000..63857c729802e00d4c3cc65ac236aa2ff34ce607 Binary files /dev/null and b/zh-cn/third-party-cases/figures/bluetooth_dialog_en.png differ diff --git a/zh-cn/third-party-cases/figures/bluetooth_list.png b/zh-cn/third-party-cases/figures/bluetooth_list.png new file mode 100644 index 0000000000000000000000000000000000000000..6edbda56e6cf01a45d055f995169ccf6e9463cbb Binary files /dev/null and b/zh-cn/third-party-cases/figures/bluetooth_list.png differ diff --git a/zh-cn/third-party-cases/figures/bluetooth_list_en.png b/zh-cn/third-party-cases/figures/bluetooth_list_en.png new file mode 100644 index 0000000000000000000000000000000000000000..4df05c5c4aee9216e0a0b5d2c0d7164fb18949be Binary files /dev/null and b/zh-cn/third-party-cases/figures/bluetooth_list_en.png differ diff --git a/zh-cn/third-party-cases/figures/bluetooth_match.png b/zh-cn/third-party-cases/figures/bluetooth_match.png new file mode 100644 index 0000000000000000000000000000000000000000..1daa1043afbdc2648c73675aba365722dc3df2b1 Binary files /dev/null and b/zh-cn/third-party-cases/figures/bluetooth_match.png differ diff --git a/zh-cn/third-party-cases/figures/bluetooth_match_en.png b/zh-cn/third-party-cases/figures/bluetooth_match_en.png new file mode 100644 index 0000000000000000000000000000000000000000..4cb0101c6dd18298dbd1f94c4c56af4bc6c5da12 Binary files /dev/null and b/zh-cn/third-party-cases/figures/bluetooth_match_en.png differ diff --git a/zh-cn/third-party-cases/figures/camera.png b/zh-cn/third-party-cases/figures/camera.png new file mode 100644 index 0000000000000000000000000000000000000000..245a0585d523889ba1f4411a1593176160ff80be Binary files /dev/null and b/zh-cn/third-party-cases/figures/camera.png differ diff --git a/zh-cn/third-party-cases/figures/camerapreview.gif b/zh-cn/third-party-cases/figures/camerapreview.gif new file mode 100644 index 0000000000000000000000000000000000000000..1e1f06dac46a9386f941d4701e5143fd0388ab1c Binary files /dev/null and b/zh-cn/third-party-cases/figures/camerapreview.gif differ diff --git a/zh-cn/third-party-cases/figures/connect.png b/zh-cn/third-party-cases/figures/connect.png new file mode 100644 index 0000000000000000000000000000000000000000..18be004d104f1672e42af11186eecc7586333a41 Binary files /dev/null and b/zh-cn/third-party-cases/figures/connect.png differ diff --git a/zh-cn/third-party-cases/figures/crash_1.png b/zh-cn/third-party-cases/figures/crash_1.png new file mode 100644 index 0000000000000000000000000000000000000000..35bf5af9d40e890796b95c8f5f44a3c2b7fb53b6 Binary files /dev/null and b/zh-cn/third-party-cases/figures/crash_1.png differ diff --git a/zh-cn/third-party-cases/figures/crash_2.png b/zh-cn/third-party-cases/figures/crash_2.png new file mode 100644 index 0000000000000000000000000000000000000000..a45f034cbb545b3c63db6962ce509fa018343c64 Binary files /dev/null and b/zh-cn/third-party-cases/figures/crash_2.png differ diff --git a/zh-cn/third-party-cases/figures/crash_3.png b/zh-cn/third-party-cases/figures/crash_3.png new file mode 100644 index 0000000000000000000000000000000000000000..5d3060410c0becbf3164a3a8820503933c9e5abc Binary files /dev/null and b/zh-cn/third-party-cases/figures/crash_3.png differ diff --git a/zh-cn/third-party-cases/figures/crash_4.png b/zh-cn/third-party-cases/figures/crash_4.png new file mode 100644 index 0000000000000000000000000000000000000000..1c1f87ceeaaaafd7a2b43a3ac291b06c6cc15500 Binary files /dev/null and b/zh-cn/third-party-cases/figures/crash_4.png differ diff --git a/zh-cn/third-party-cases/figures/crash_5.png b/zh-cn/third-party-cases/figures/crash_5.png new file mode 100644 index 0000000000000000000000000000000000000000..0eaf71d314ebe3f4151ae81867da33b568bea2e3 Binary files /dev/null and b/zh-cn/third-party-cases/figures/crash_5.png differ diff --git a/zh-cn/third-party-cases/figures/crash_6.png b/zh-cn/third-party-cases/figures/crash_6.png new file mode 100644 index 0000000000000000000000000000000000000000..d91d3277be2c3d1d022b2f1520dd7bd24f8f2a02 Binary files /dev/null and b/zh-cn/third-party-cases/figures/crash_6.png differ diff --git a/zh-cn/third-party-cases/figures/crash_7.png b/zh-cn/third-party-cases/figures/crash_7.png new file mode 100644 index 0000000000000000000000000000000000000000..ecd7c3a6a01f0f1b799d8b28a510bbf8514e795c Binary files /dev/null and b/zh-cn/third-party-cases/figures/crash_7.png differ diff --git a/zh-cn/third-party-cases/figures/crash_8.png b/zh-cn/third-party-cases/figures/crash_8.png new file mode 100644 index 0000000000000000000000000000000000000000..c0721d5826f914922b812a5ecff6fe0c02cb46d4 Binary files /dev/null and b/zh-cn/third-party-cases/figures/crash_8.png differ diff --git a/zh-cn/third-party-cases/figures/disributed_canvas-after.png b/zh-cn/third-party-cases/figures/disributed_canvas-after.png new file mode 100644 index 0000000000000000000000000000000000000000..7bc98d9f9f596af7150c173f9577a30f1f5ee1ff Binary files /dev/null and b/zh-cn/third-party-cases/figures/disributed_canvas-after.png differ diff --git a/zh-cn/third-party-cases/figures/disributed_canvas-before.png b/zh-cn/third-party-cases/figures/disributed_canvas-before.png new file mode 100644 index 0000000000000000000000000000000000000000..e6a17222c21405ee2a191946af81c5429fa821e7 Binary files /dev/null and b/zh-cn/third-party-cases/figures/disributed_canvas-before.png differ diff --git a/zh-cn/third-party-cases/figures/disributed_canvas_connect.png b/zh-cn/third-party-cases/figures/disributed_canvas_connect.png new file mode 100644 index 0000000000000000000000000000000000000000..249fae29cd541d0bae0150448eed500d70fdaf06 Binary files /dev/null and b/zh-cn/third-party-cases/figures/disributed_canvas_connect.png differ diff --git a/zh-cn/third-party-cases/figures/disributed_note-after.png b/zh-cn/third-party-cases/figures/disributed_note-after.png new file mode 100644 index 0000000000000000000000000000000000000000..9eef39c0351577a06a15be085bca058051bc8012 Binary files /dev/null and b/zh-cn/third-party-cases/figures/disributed_note-after.png differ diff --git a/zh-cn/third-party-cases/figures/disributed_note-before.png b/zh-cn/third-party-cases/figures/disributed_note-before.png new file mode 100644 index 0000000000000000000000000000000000000000..5b863b7a491a6a3671815637c90b13830043cc7e Binary files /dev/null and b/zh-cn/third-party-cases/figures/disributed_note-before.png differ diff --git a/zh-cn/third-party-cases/figures/disributed_note-edit.png b/zh-cn/third-party-cases/figures/disributed_note-edit.png new file mode 100644 index 0000000000000000000000000000000000000000..585a7084b4a95f63a08aaa2ac8a1a783c4727602 Binary files /dev/null and b/zh-cn/third-party-cases/figures/disributed_note-edit.png differ diff --git a/zh-cn/third-party-cases/figures/disributed_note_connect.png b/zh-cn/third-party-cases/figures/disributed_note_connect.png new file mode 100644 index 0000000000000000000000000000000000000000..a983cf00ca81f7280c84bb1e05d03494a5b76df4 Binary files /dev/null and b/zh-cn/third-party-cases/figures/disributed_note_connect.png differ diff --git a/zh-cn/third-party-cases/figures/disributed_permission.png b/zh-cn/third-party-cases/figures/disributed_permission.png new file mode 100644 index 0000000000000000000000000000000000000000..8d86371911f97124694b2555b1dd6eee975a9147 Binary files /dev/null and b/zh-cn/third-party-cases/figures/disributed_permission.png differ diff --git a/zh-cn/third-party-cases/figures/distributed.png b/zh-cn/third-party-cases/figures/distributed.png new file mode 100644 index 0000000000000000000000000000000000000000..b0fb2e9bc8958a06521bf2befe5377f4a195776b Binary files /dev/null and b/zh-cn/third-party-cases/figures/distributed.png differ diff --git a/zh-cn/third-party-cases/figures/jserror_1.png b/zh-cn/third-party-cases/figures/jserror_1.png new file mode 100644 index 0000000000000000000000000000000000000000..ad3987092bf60e16b5f9bbf7c60333cacdc0da8e Binary files /dev/null and b/zh-cn/third-party-cases/figures/jserror_1.png differ diff --git a/zh-cn/third-party-cases/figures/jserror_2.png b/zh-cn/third-party-cases/figures/jserror_2.png new file mode 100644 index 0000000000000000000000000000000000000000..43561e6ceb2b11cf5f1ca62d67e5b4b185d7ae72 Binary files /dev/null and b/zh-cn/third-party-cases/figures/jserror_2.png differ diff --git a/zh-cn/third-party-cases/figures/jserror_3.png b/zh-cn/third-party-cases/figures/jserror_3.png new file mode 100644 index 0000000000000000000000000000000000000000..f8e57ddd5d39f4c9cbd817dcc7b67f60f2993c27 Binary files /dev/null and b/zh-cn/third-party-cases/figures/jserror_3.png differ diff --git a/zh-cn/third-party-cases/figures/jserror_4.png b/zh-cn/third-party-cases/figures/jserror_4.png new file mode 100644 index 0000000000000000000000000000000000000000..e7535b656f7dcff1903be544ce65934051619687 Binary files /dev/null and b/zh-cn/third-party-cases/figures/jserror_4.png differ diff --git a/zh-cn/third-party-cases/figures/wlanconnect.png b/zh-cn/third-party-cases/figures/wlanconnect.png new file mode 100644 index 0000000000000000000000000000000000000000..7e1a604a564ad61652d907311a68dc15ecbf0e29 Binary files /dev/null and b/zh-cn/third-party-cases/figures/wlanconnect.png differ diff --git a/zh-cn/third-party-cases/figures/wlandisconnect.png b/zh-cn/third-party-cases/figures/wlandisconnect.png new file mode 100644 index 0000000000000000000000000000000000000000..5050ec683cd16c0fc8a224924584f1facccf2906 Binary files /dev/null and b/zh-cn/third-party-cases/figures/wlandisconnect.png differ diff --git a/zh-cn/third-party-cases/figures/wlanmain.png b/zh-cn/third-party-cases/figures/wlanmain.png new file mode 100644 index 0000000000000000000000000000000000000000..c8454fc71d01b013dbb68c0579773d12278782a6 Binary files /dev/null and b/zh-cn/third-party-cases/figures/wlanmain.png differ diff --git a/zh-cn/third-party-cases/figures/wlanscan.png b/zh-cn/third-party-cases/figures/wlanscan.png new file mode 100644 index 0000000000000000000000000000000000000000..366799135770c2bb5fa3d93f67b251f304d42641 Binary files /dev/null and b/zh-cn/third-party-cases/figures/wlanscan.png differ diff --git a/zh-cn/third-party-cases/how-to-connect-to-bluetooth.md b/zh-cn/third-party-cases/how-to-connect-to-bluetooth.md new file mode 100644 index 0000000000000000000000000000000000000000..45b22ac7716edab37e44b46b6ed54cc39b7e7fd6 --- /dev/null +++ b/zh-cn/third-party-cases/how-to-connect-to-bluetooth.md @@ -0,0 +1,413 @@ +# 如何进行蓝牙连接 + +## 场景说明 +蓝牙技术是一种无线数据和语音通信开放的全球规范，它是基于低成本的近距离无线连接，为固定和移动设备建立通信环境的一种特殊的连接。本示例通过[@ohos.bluetoothManager](../application-dev/reference/apis/js-apis-bluetoothManager.md)接口实现蓝牙设备发现、配对、取消配对功能。 + +## 效果呈现 + +本示例最终效果如下： + +| 发现设备 | 连接设备 | 断开连接 | +| ------------------------------- | --------------------------------- | --------------------------------- | +| ![](figures/bluetooth_list.png) | ![](figures/bluetooth_dialog.png) | ![](figures/bluetooth_delete.png) | + +## 运行环境 + +本例基于以下环境开发，开发者也可以基于其他适配的版本进行开发。 + +- IDE：DevEco Studio 3.1.1 Release +- SDK：Ohos_sdk_full 4.0.8.5(API Version 10 Beta1) + +## 实现思路 +本文涉及到蓝牙的设备发现、配对、取消配对三个功能特性，实现思路如下： + +- 启动和关闭蓝牙：在Index页面中通过Toggle组件的onChange函数控制蓝牙的开关，开关打开的情况下执行initBluetooth函数，关闭的情况下执行bluetooth.disableBluetooth()方法来断开蓝牙； +- 验证蓝牙是否处于连接状态：蓝牙打开的时候通过bluetooth.on('stateChange')方法监听蓝牙连接状态改变事件，如确认已打开，执行foundDevices()函数来查找设备接口，确认已关闭则执行bluetooth.stopBluetoothDiscovery()方法停止查询接口。 +- 发现设备：在foundDevices()函数中通过bluetooth.on('bluetoothDeviceFind')方法监听设备发现事件，通过bluetooth.getPairedDevices()方法更新已配对蓝牙地址，然后通过bluetooth.startBluetoothDiscovery()方法开启蓝牙扫描发现远端设备，并且通过bluetooth.setBluetoothScanMode()方法来被远端设备发现。 +- 蓝牙配对：通过bluetooth.on('pinRequired')方法监听远端蓝牙设备的配对请求事件，点击配对执行bluetooth.setDevicePairingConfirmation(this.data.deviceId, true)方法，点击取消执行bluetooth.setDevicePairingConfirmation(this.data.deviceId, false)方法。 +- 取消配对：使用bluetooth.cancelPairedDevice()断开指定的远端设备连接。 + +## 开发步骤 +1. 申请蓝牙权限。 + 使用蓝牙需要先申请对应的权限，在module.json5文件中添加以下配置： + + ```json + "requestPermissions": [ + { + //允许应用查看蓝牙的配置 + "name": "ohos.permission.USE_BLUETOOTH", + "reason": "$string:grant_use_bluetooth", + "usedScene": { + "abilities": [ + "MainAbility" + ], + "when": "inuse" + } + }, + { + //允许应用配置本地蓝牙，查找远端设备且与之配对连接 + "name": "ohos.permission.DISCOVER_BLUETOOTH", + "reason": "$string:grant_discovery_bluetooth", + "usedScene": { + "abilities": [ + "MainAbility" + ], + "when": "inuse" + } + }, + { + //允许应用获取设备位置信息 + "name": "ohos.permission.LOCATION", + "reason": "$string:grant_location", + "usedScene": { + "abilities": [ + "MainAbility" + ], + "when": "inuse" + } + }, + { + //允许应用获取设备模糊位置信息 + "name": "ohos.permission.APPROXIMATELY_LOCATION", + "reason": "$string:grant_location", + "usedScene": { + "abilities": [ + "MainAbility" + ], + "when": "inuse" + } + }, + { + //允许应用配对蓝牙设备，并对设备的电话簿或消息进行访问 + "name": "ohos.permission.MANAGE_BLUETOOTH", + "reason": "$string:grant_manage_bluetooth", + "usedScene": { + "abilities": [ + "MainAbility" + ], + "when": "inuse" + } + } + ] + ``` + +2. 构建UI框架，整体的UI框架分为TitleBar（页面名称），PinDialog（配对蓝牙弹框），index（主页面）三个部分。 + + ```ts + //Common/TitleBar.ets + @Component + export struct TitleBar { + private handlerClickButton: () => void + + build() { + Row() { + Image($r('app.media.ic_back')) + .width(40) + .height(30) + .onClick(() => { + this.handlerClickButton() + }) + Text($r('app.string.bluetooth')) + .fontSize(30) + .width(150) + .height(50) + .margin({ left: 15 }) + .fontColor('#ffa2a3a4') + } + .width('100%') + .height(60) + .padding({ left: 20, top: 10 }) + .backgroundColor('#ff2d30cb') + .constraintSize({ minHeight: 50 }) + } + } + + //Common/PinDalog.ets + ... + aboutToAppear() { + this.titleText = `"${this.data.deviceId}"要与您配对。请确认此配对码已在"${this.data.deviceId}"上直接显示，且不是手动输入的。` + this.pinCode = JSON.stringify(this.data.pinCode) + } + build() { + //配对弹框描述文字 + Column({ space: 10 }) { + Text($r('app.string.match_request')) + .fontSize(30) + .alignSelf(ItemAlign.Start) + Text(this.titleText) + .alignSelf(ItemAlign.Start) + .margin({ top: 20 }) + .fontSize(21) + Text(this.pinCode) + .fontSize(40) + .fontWeight(FontWeight.Bold) + .margin({ top: 20 }) + Flex({ direction: FlexDirection.Row, alignItems: ItemAlign.Center }) { + Checkbox({ name: 'checkbox' }) + .select(false) + .selectedColor('#ff3d6fb8') + .key('checkBox') + Text($r('app.string.grant_permission')) + .fontSize(15) + .margin({ left: 3, top: 6 }) + } + .alignSelf(ItemAlign.Start) + .width('95%') + .margin({ top: 5 }) + + Row() { + //配对选择UI，取消or配对 + this.choiceText($r('app.string.cancel'), () => { + bluetooth.setDevicePairingConfirmation(this.data.deviceId, false) + logger.info(TAG, `setDevicePairingConfirmation = ${bluetooth.setDevicePairingConfirmation(this.data.deviceId, false)}`) + this.controller.close() + }) + + Divider() + .vertical(true) + .height(32) + + this.choiceText($r('app.string.match'), () => { + bluetooth.setDevicePairingConfirmation(this.data.deviceId, true) + logger.info(TAG, `setDevicePairingConfirmation = ${bluetooth.setDevicePairingConfirmation(this.data.deviceId, true)}`) + this.controller.close() + }) + } + .margin({ top: 20 }) + } + .width('100%') + .padding(15) + } + ... + + //pages/index.ets + @Entry + @Component + struct Index { + build() { + Column() { + TitleBar({ handlerClickButton: this.handlerClickButton }) + Scroll() { + Column() { + Row() { + //蓝牙开关 + Column() { + Text($r('app.string.bluetooth')) + .fontSize(30) + .margin({ top: 20 }) + .alignSelf(ItemAlign.Start) + if (true === this.isOn) { + Text($r('app.string.discovery')) + .fontSize(20) + .alignSelf(ItemAlign.Start) + } + } + + Blank() + + Column() { + Toggle({ type: ToggleType.Switch, isOn: this.isOn }) + .selectedColor('#ff2982ea') + .onChange((isOn: boolean) => { + if (isOn) { + this.isOn = true + this.initBluetooth() + } else { + this.isOn = false + bluetooth.disableBluetooth() + this.deviceList = [] + this.discoveryList = [] + } + }) + } + .id('toggleBtn') + } + .width('90%') + + if (this.isOn) { + Divider() + .vertical(false) + .strokeWidth(10) + .color('#ffece7e7') + .lineCap(LineCapStyle.Butt) + .margin('1%') + //已配对的设备 + Text($r('app.string.paired_device')) + .fontSize(25) + .fontColor('#ff565555') + .margin({ left: '5%' }) + .alignSelf(ItemAlign.Start) + + ForEach(this.deviceList, (item, index) => { + Row() { + Text(item) + .fontSize(20) + } + .alignSelf(ItemAlign.Start) + .width('100%') + .height(50) + .margin({ left: '5%', top: '1%' }) + .id(`pairedDevice${index}`) + .onClick(() => { + AlertDialog.show({ + //取消配对 + title: $r('app.string.disconnect'), + message: '此操作将会断开您与以下设备的连接：' + item, + primaryButton: { + value: $r('app.string.cancel'), + action: () => { + } + }, + //确认取消 + secondaryButton: { + value: $r('app.string.confirm'), + action: () => { + try { + bluetooth.cancelPairedDevice(item); + this.deviceList = bluetooth.getPairedDevices() + this.discoveryList = [] + bluetooth.startBluetoothDiscovery() + } catch (err) { + console.error("errCode:" + err.code + ",errMessage:" + err.message); + } + } + } + }) + }) + }) + + Divider() + .vertical(false) + .strokeWidth(10) + .color('#ffece7e7') + .lineCap(LineCapStyle.Butt) + .margin('1%') + + Text($r('app.string.available_device')) + .fontSize(25) + .fontColor('#ff565555') + .margin({ left: '5%', bottom: '2%' }) + .alignSelf(ItemAlign.Start) + //可用设备列表 + ForEach(this.discoveryList, (item) => { + Row() { + Text(item) + .fontSize(20) + } + .alignSelf(ItemAlign.Start) + .width('100%') + .height(50) + .margin({ left: '5%', top: '1%' }) + //进行配对操作点击 + .onClick(() => { + logger.info(TAG, `start bluetooth.pairDevice,item = ${item}`) + let pairStatus = bluetooth.pairDevice(item) + logger.info(TAG, `pairStatus = ${pairStatus}`) + }) + + Divider() + .vertical(false) + .color('#ffece7e7') + .lineCap(LineCapStyle.Butt) + .margin('1%') + }) + } + } + } + .constraintSize({ maxHeight: '85%' }) + } + } + } + ``` + +3. 蓝牙开关打开关闭操作，需要打开蓝牙开关才能进行后续操作： + ```ts + initBluetooth() { + bluetooth.on('stateChange', (data) => { + logger.info(TAG, `enter on stateChange`) + //判断蓝牙开关状态 + if (data === bluetooth.BluetoothState.STATE_ON) { + logger.info(TAG, `enter BluetoothState.STATE_ON`) + //蓝牙打开后的相关操作 + this.foundDevices() + } + if (data === bluetooth.BluetoothState.STATE_OFF) { + logger.info(TAG, `enter BluetoothState.STATE_OFF`) + bluetooth.off('bluetoothDeviceFind', (data) => { + logger.info(TAG, `offBluetoothDeviceFindData = ${JSON.stringify(data)}`) + }) + //关闭 + bluetooth.stopBluetoothDiscovery() + this.discoveryList = [] + } + logger.info(TAG, `BluetoothState = ${JSON.stringify(data)}`) + }) + //开启蓝牙 + bluetooth.enableBluetooth() + } + ``` + +4. 设置蓝牙扫描模式并开启扫描去发现设备，并订阅蓝牙设备发现上报时间获取设备列表 + ```ts + foundDevices() { + //订阅蓝牙设备发现上报事件 + bluetooth.on('bluetoothDeviceFind', (data) => { + logger.info(TAG, `enter on bluetoothDeviceFind`) + if (data !== null && data.length > 0) { + if (this.discoveryList.indexOf(data[0]) === -1 && this.deviceList.indexOf(data[0]) === -1) { + this.discoveryList.push(data[0]) + } + logger.info(TAG, `discoveryList = ${JSON.stringify(this.discoveryList)}`) + } + let list = bluetooth.getPairedDevices() + if (list !== null && list.length > 0) { + this.deviceList = list + logger.info(TAG, `deviceList = ${JSON.stringify(this.deviceList)}`) + } + }) + //开启蓝牙扫描，可以发现远端设备 + bluetooth.startBluetoothDiscovery() + //设置蓝牙扫描模式，可以被远端设备发现 + bluetooth.setBluetoothScanMode(bluetooth.ScanMode.SCAN_MODE_CONNECTABLE_GENERAL_DISCOVERABLE, TIME) + } + ``` + +5. 设置蓝牙扫描模式并开启扫描去发现设备，并订阅蓝牙设备发现上报时间获取设备列表 + + ```ts + //配对确定和取消代码在PinDialog.ets文件中 + //setDevicePairingConfirmation(device: string, accept: boolean): void + //device string 表示远端设备地址，例如："XX:XX:XX:XX:XX:XX + //accept boolean 接受配对请求设置为true，否则设置为false + + //订阅蓝牙配对状态改变事件，根据蓝牙状态更新设备列表 + bluetooth.on('bondStateChange', (data) => { + logger.info(TAG, `enter bondStateChange`) + logger.info(TAG, `data = ${JSON.stringify(data)}`) + if (data.state === bluetooth.BondState.BOND_STATE_BONDED) { + logger.info(TAG, `BOND_STATE_BONDED`) + let index = this.discoveryList.indexOf(data.deviceId) + this.discoveryList.splice(index, 1) + this.deviceList = bluetooth.getPairedDevices() + } + if (data.state === bluetooth.BondState.BOND_STATE_INVALID) { + logger.info(TAG, `BOND_STATE_INVALID`) + this.deviceList = bluetooth.getPairedDevices() + } + logger.info(TAG, `bondStateChange,data = ${JSON.stringify(data)}`) + }) + ``` + +​ + +## 完整代码 + +本例完整代码sample示例链接：[蓝牙Sample](https://gitee.com/openharmony/applications_app_samples/tree/master/code/SystemFeature/Connectivity/Bluetooth) + + + +## 参考 +- [权限申请指导](../application-dev/security/accesstoken-guidelines.md) +- [@ohos.bluetooth](../application-dev/reference/apis/js-apis-bluetooth.md) + +​ \ No newline at end of file diff --git a/zh-cn/third-party-cases/take-picture-and-preview.md b/zh-cn/third-party-cases/take-picture-and-preview.md new file mode 100644 index 0000000000000000000000000000000000000000..f45e3fee25151ba9b519beb56fac2f5087ee4e2f --- /dev/null +++ b/zh-cn/third-party-cases/take-picture-and-preview.md @@ -0,0 +1,257 @@ +# 如何调用设备摄像头进行拍照、预览并将拍摄结果保存在媒体库中 + +## 场景说明 + +调用设备摄像头进行拍照、预览是许多应用开发过程中都需要的功能。在拍照完成时显示照片预览图可以确认拍摄的照片是否达到预期，本例将为大家介绍如何实现上述功能。 + +## 效果呈现 + +本例效果如下： + +| 拍照 | 预览 | +| :----------------------------------------------------------: | :----------------------------------------------------------: | +| contactlist | contactlist | + + + +## 运行环境 + +本例基于以下环境开发，开发者也可以基于其他适配的版本进行开发。 + +- IDE：DevEco Studio 4.0.0.201 Beta1 +- SDK：Ohos_sdk_public 4.0.7.5 (API Version 10 Beta1) + +## 实现思路 + +本例使用@ohos.multimedia.camera接口实现相机示例的主要功能：拍照、预览； + +- 拍照：XComponent组件负责绘制摄像头画面呈现的窗口，其onload事件调用cameraModel.ts的initCamera方法初始化相机功能输出画面信息。拍照动作使用Image组件实现，其onclick事件调用cameraModel.ts的takepicture方法开始拍照。 + +- 预览：返回相机界面点击底部左侧预览图可进入相册应用，可以在其中查看照片和录制的视频。 + +## 开发步骤 + +1. 申请所需权限 + + 在model.json5中添加以下配置： + + ```json + "requestPermissions": [ + { + "name": "ohos.permission.CAMERA"//允许应用使用相机拍摄照片和录制视频 + }, + { + "name": "ohos.permission.MICROPHONE"//允许应用使用麦克风 + }, + { + "name": "ohos.permission.MEDIA_LOCATION"//允许应用访问用户媒体文件中的地理位置信息 + }, + { + "name": "ohos.permission.WRITE_MEDIA"//允许应用读写用户外部存储中的媒体文件信息 + }, + { + "name": "ohos.permission.READ_MEDIA"//允许应用读取用户外部存储中的媒体文件信息 + } + ] + ``` + +2. 创建绘制组件XComponent以输出摄像头获取的画面，其绑定的onload方法中设定了画幅的大小。 + + ```typescript + build() { + Column() { + Title() + .visibility(this.isTitleShow ? Visibility.Visible : Visibility.None) + Stack({ alignContent: Alignment.Bottom }) { + Stack({ alignContent: Alignment.TopStart }) { + XComponent({ + id: 'componentId', + type: 'surface', + controller: this.mXComponentController //将控制器绑定至XComponent组件 + }) + .onLoad(() => { + this.mXComponentController.setXComponentSurfaceSize({ surfaceWidth: 640, surfaceHeight: 480 });//设置surface大小 + this.surfaceId = this.mXComponentController.getXComponentSurfaceId(); + this.currentModel = CameraMode.modePhoto; + this.cameraModel.initCamera(this.surfaceId); //调用model/cameraModel.ts初始化相机功能 + }) + .width('100%') + .height('100%') + .margin({ bottom: 152 }) + Column() { + } + .width('97%') + .height('100%') + ``` + +3. 初始化相机功能 + + initCamera方法通过创建相机管理器实例cameraMgr来创建画面输出对象previewOutput。cameraMgr再通过创建CaptureSession实例来配置会话，完成相机功能的准备工作。 + + ```typescript + import image from '@ohos.multimedia.image';//自@ohos.multimedia.image引入image，提供图片处理效果 + ... + private receiver: image.ImageReceiver = undefined;//图像接收类，用于获取组件surface id，接收最新的图片和读取下一张图片 + ... + constructor() { + this.mediaModel = MediaModel.getMediaInstance();//通过调用model/MediaModel.ets中的方法创建mediaInstance类mediaModel + //创建ImageReceiver实例receiver + this.receiver = image.createImageReceiver( + cameraWH.width, + cameraWH.height, + FOUR, + EIGHT + ); + //接收图片时注册回调 + this.receiver.on('imageArrival', () => { + //从ImageReceiver读取下一张图片 + this.receiver.readNextImage((err, image) => { + if (err || image === undefined) { + return; + } + //根据图像的组件类型从图像中获取组件缓存 + image.getComponent(FOUR, (errMsg, img) => { + if (errMsg || img === undefined) { + return; + } + let buffer = new ArrayBuffer(FOUR_THOUSAND_AND_SIXTY_NINE); + if (img.byteBuffer) { + buffer = img.byteBuffer; + } + this.saveImage(buffer, image); + }); + }); + }); + } + + + async initCamera(surfaceId: string): Promise { + ... + try { + this.cameraMgr = camera.getCameraManager(globalThis.cameraContext);//获取相机管理器实例 + } + this.camerasArray = this.cameraMgr.getSupportedCameras();//获取支持指定的相机设备对象 + if (this.camerasArray.length === 0) { + return; + } + let mCamera = this.camerasArray[0]; + this.cameraInput = this.cameraMgr.createCameraInput(mCamera); + this.cameraInput.open(); + this.capability = this.cameraMgr.getSupportedOutputCapability(mCamera);//查询相机设备支持的输出能力 + let previewProfile = this.capability.previewProfiles[0]; + //通过相机管理器创建预览输出对象 + this.previewOutput = this.cameraMgr.createPreviewOutput( + previewProfile, + surfaceId //surfaceId从XComponent组件获取 + ); + let rSurfaceId = await this.receiver.getReceivingSurfaceId();//获取一个surface id供其他组件使用 + let photoProfile = this.capability.photoProfiles[0]; + //通过相机管理器创建照片输出对象 + this.photoOutPut = this.cameraMgr.createPhotoOutput( + photoProfile, + rSurfaceId //rSurfaceId通过构造函数中定义的图像接收类receiver获取 + ); + this.capSession = this.cameraMgr.createCaptureSession();//创建CaptureSession实例 + this.capSession.beginConfig();//开始配置会话 + this.capSession.addInput(this.cameraInput);//将cameraInput加入会话 + this.capSession.addOutput(this.previewOutput);//将预览输出加入会话 + this.capSession.addOutput(this.photoOutPut);//将照片输出加入会话 + await this.capSession.commitConfig();//提交配置信息 + await this.capSession.start();//开始输出 + } + + ``` + +4. 点击按钮进行拍照 + + 拍照按钮通过Image组件呈现，其绑定的onClick方法调用takePicture方法开始拍照。 + + ```typescript + Image(this.getCameraIcon()) + .size({ width: 64, height: 64 }) + .margin({ left: 10 }) + .id('camera') + .onClick(() => { + if (this.currentModel === CameraMode.modePhoto) { + prompt.showToast({ message: '拍照中...', duration: 200 }); + this.cameraModel.takePicture();//调用model/cameraModel.takePicture()开始拍照 + } + }) + ``` + +5. 拍照功能具体实现 + + - 拍照 + + ```typescript + async takePicture(): Promise { + //设置拍照相关参数 + let photoSettings = { + rotation: this.imageRotation, + quality: camera.QualityLevel.QUALITY_LEVEL_MEDIUM, + location: { + // 位置信息，经纬度 + latitude: 12.9698, + longitude: 77.75, + altitude: 1000, + }, + mirror: false, + }; + await this.photoOutPut.capture(photoSettings); + AppStorage.Set('isRefresh', true); + } + ``` + + - 保存图片 + + saveImage方法使用MediaModel中的createAndGetUri方法创建Image类型资源，将拍摄到的照片写入到这个资源中去。 + + ```typescript + //model/MediaModel.ts中定义的负责保存图片的相关方法 + async createAndGetUri(mediaType: mediaLibrary.MediaType): Promise { + let dateTimeUtil: DateTimeUtil = new DateTimeUtil(); + let info: FileInfo = this.getInfoFromMediaType(mediaType); + let name: string = `${dateTimeUtil.getDate()}_${dateTimeUtil.getTime()}`;//获取当前时间 + let displayName: string = `${info.prefix}${name}${info.suffix}`; + //获取公共目录路径。 + let publicPath: string = await this.mediaLibraryTest.getPublicDirectory( + info.directory + );//通过引用自@ohos.multimedia.mediaLibrary的mediaLibraryTest类创建媒体资源，其中定义了媒体类型、名称、路径。 + let fileAsset: mediaLibrary.FileAsset = await this.mediaLibraryTest.createAsset( + mediaType,//根据传入函数createAndGetUri的mediaType参数决定创建什么类型的媒体资源 + displayName, + publicPath + ); + return fileAsset; + } + async getFdPath(fileAsset: mediaLibrary.FileAsset): Promise { + let fd: number = await fileAsset.open('Rw');//打开当前文件 + return fd; + } + ... + + async saveImage(buffer: ArrayBuffer, img: image.Image): Promise { + this.fileAsset = await this.mediaModel.createAndGetUri(mediaLibrary.MediaType.IMAGE); + //通过调用MediaModel中的方法创建Image类型资源 + this.photoPath = this.fileAsset.uri; + this.fd = await this.mediaModel.getFdPath(this.fileAsset); + await fileIo.write(this.fd, buffer);//将拍摄的照片写入到Mediamodel传回的资源中去 + await this.fileAsset.close(this.fd);//释放open函数 + await img.release(); + if (this.takePictureHandle) { + this.takePictureHandle(this.photoPath); + } + } + ``` + +## 全部代码 + +本例完整代码sample示例链接：[相机](https://gitee.com/openharmony/applications_app_samples/tree/master/code/SystemFeature/Media/Camera) + +## 参考 + +- [权限列表](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/security/permission-list.md#ohospermissiondistributed_datasync) +- [@ohos.multimedia.camera](../application-dev/reference/apis/js-apis-camera.md) + + + diff --git a/zh-cn/third-party-cases/wlan-search-connect-disconnect.md b/zh-cn/third-party-cases/wlan-search-connect-disconnect.md new file mode 100644 index 0000000000000000000000000000000000000000..8439befad413a6c6a9460f9b9eb5e60990935fb2 --- /dev/null +++ b/zh-cn/third-party-cases/wlan-search-connect-disconnect.md @@ -0,0 +1,448 @@ +# 如何实现WLAN网络扫描、连接、断开 + +## 场景说明 + +对可用的WLAN列表进行扫描，连接、断开WLAN网络是设备常见的功能，本例将为大家介绍如何实现上述功能。 + +## 效果呈现 + +本例效果如下： + +| 扫描WLAN | 连接WLAN | 断开WLAN | +| :----------------------------------------------------------: | :----------------------------------------------------------: | :----------------------------------------------------------: | +| contactlist | contactlist | contactlist | + +## 运行环境 + +本例基于以下环境开发，开发者也可以基于其他适配的版本进行开发。 + +- IDE：DevEco Studio 4.0.0.201 Beta1 +- SDK：Ohos_sdk_public 4.0.7.5 (API Version 10 Beta1) + +## 实现思路 + +本例主要通过@ohos.wifiManager 相关API实现WLAN激活和关闭、扫描和连接WLAN等功能。 + +- WLAN功能的激活和关闭：点击首页的切换按钮，如果是打开，使用wifi.enableWifi()开启WLAN功能；如果是关闭，则使用wifi.disconnect()断开WLAN功能， 然后使用wifi.disableWifi()关闭WLAN。 +- WLAN的连接：点击WLAN列表中加密的WLAN，并在弹窗中输入密码后，会在AvailableWifi.ets中通过WifiModule.connectNetwork()调用wifi.connectToDevice()连接WLAN。 +- WLAN的扫描：进入Index.ets 后就会间歇性的调用wifi.scan()开启扫描，然后通过WifiModel模块中的getScanInfos()调用wifi.getScanResults()来获取扫描的结果. + +## 开发步骤 + +1. 申请所需权限 + + 在model.json5中添加以下配置： + + ```json + "requestPermissions": [ + { + "name": "ohos.permission.GET_WIFI_INFO"//允许应用获取WLAN信息 + }, + { + "name": "ohos.permission.GET_WIFI_INFO_INTERNAL"//允许应用获取WLAN信息 + }, + { + "name": "ohos.permission.SET_WIFI_INFO"//允许应用配置WLAN设备 + }, + { + "name": "ohos.permission.GET_WIFI_PEERS_MAC"//允许应用获取对端WLAN或者蓝牙设备的MAC地址 + }, + { + "name": "ohos.permission.GET_WIFI_LOCAL_MAC"//允许应用获取本机WLAN或者蓝牙设备的MAC地址 + }, + { + "name": "ohos.permission.GET_WIFI_CONFIG"//允许应用获取WLAN配置信息 + }, + { + "name": "ohos.permission.SET_WIFI_CONFIG"//允许应用配置WLAN信息 + }, + { + "name": "ohos.permission.MANAGE_WIFI_CONNECTION"//允许应用管理WLAN连接 + }, + { + "name": "ohos.permission.MANAGE_WIFI_HOTSPOT"//允许应用开启或者关闭WLAN热点 + }, + { + "name": "ohos.permission.LOCATION"//允许应用获取设备位置信息 + }, + { + "name": "ohos.permission.APPROXIMATELY_LOCATION"//允许应用获取设备模糊位置信息 + } + ] + ``` + +2. 准备工作 + + 定义boolean变量isSwitchOn作为WLAN开关是否打开的标志。 + + ```typescript + import wifi from '@ohos.wifiManager' + aboutToAppear() { + // 如果WLAN是开的，就记录下状态，然后扫描WLAN，并获取连接信息 + if (wifi.isWifiActive()) {//查询WLAN是否已使能 + Logger.log(TAG, 'wifi is active') + this.isSwitchOn = true//已使能说明WLAN开关已被打开，那么让isSwitchOn为true + wifi.scan()//@ohos.wifiManager的接口，对WLAN进行扫描 + this.scan()//自定义的scan函数，确保扫描的持续性 + this.getLinkedInfo() + } + // 启动监听 + this.addListener()//监听连接状态的变化 + } + ``` + +3. 持续地扫描可用WLAN + + scan方法不断地自我调用以实现对WLAN的不停扫描。 + + ```typescript + async getLinkedInfo() { + try { + //调用getLinkedInfo接口得到是否已连接WLAN的信息 + let wifiLinkedInfo = await wifi.getLinkedInfo() + if (wifiLinkedInfo === null || wifiLinkedInfo.bssid === '') { + //如果结果为空，则说明未连接 + this.isLinked = false + this.linkedInfo = null + return + } + this.isLinked = true + this.linkedInfo = wifiLinkedInfo + } catch (err) { + Logger.info(`getLinkedInfo failed err is ${JSON.stringify(err)}`) + } + } + async scan() { + // 获取有关WLAN连接的信息,存入linkedInfo + await this.getLinkedInfo() + // 不停地扫描WLAN + let result: Array = await this.wifiModel.getScanInfos()//调用model/WifiModel.ets中的getScanInfos得到扫描结果 + if (this.isSwitchOn) { + //如果WLAN功能已打开，则要进行不停地扫描 + AppStorage.SetOrCreate('wifiList', result)//将扫描结果存至全局 + //每3000毫秒调用一次scan()，实现不停扫描可用WLAN + setTimeout(async () => { + await this.scan() + }, 3000) + } + } + addListener() { + // WLAN连接状态改变事件发生时，修改连接信息 + wifi.on('wifiConnectionChange', async state => { + Logger.log(TAG, `wifiConnectionChange: ${state}`) + await this.getLinkedInfo()//WLAN连接状态改变，重新获取WLAN连接信息 + }) + // WLAN状态改变时，先清空WLAN列表，然后判断是否是开启状态，如果是就扫描 + wifi.on('wifiStateChange', state => { + Logger.log(TAG, `wifiStateLisener state: ${state}`) + AppStorage.SetOrCreate('wifiList', []) + if (state === 1) { // 1: wifi is enable, 0:wifi is disable + this.scan() + } + }) + } + ... + //model/WifiModel.ets + async getScanInfos(): Promise> { + Logger.log(TAG, 'scanWifi begin') + let wifiList: Array = [] + let result: Array = [] + try { + result = await wifi.getScanResults()//因为在abouttoappear()中执行了wifi.scan()，所以这里直接调用getScanResults接口得到扫描结果 + } catch (err) { + Logger.log(TAG, `scan info err: ${JSON.stringify(err)}`) + return wifiList + } + Logger.log(TAG, `scan info call back: ${result.length}`) + for (var i = 0; i < result.length; ++i) { + wifiList.push({ + ssid: result[i].ssid, + bssid: result[i].bssid, + securityType: result[i].securityType, + rssi: result[i].rssi, + band: result[i].band, + frequency: result[i].frequency, + timestamp: result[i].timestamp + }) + } + return wifiList + } + ``` + +4. 构建UI框架、通过关闭按钮实现断开WLAN连接。 + + TitleBar组件呈现了标题框。WLAN开关按钮由一个Toggle组件呈现，其绑定的onChange事件在按钮被打开时开始扫描可用WLAN，在被关闭时断开当前连接WLAN并且关闭WLAN功能。当前已连接的WLAN由两个Text组件分别显示其ssid与连接状态。 + + ```typescript + build() { + Column() { + TitleBar()//引入自component/TitleBar.ets，负责标题框的具体呈现 + Row() { + Text($r('app.string.wlan')) + .fontSize(22) + .fontWeight(FontWeight.Bold) + .height(40) + Column() { + Toggle({ type: ToggleType.Switch, isOn: this.isSwitchOn })//切换按钮 + .id('switch') + .onChange((isOn: boolean) => { + Logger.log(`LSQ: wifi swtich is: ${isOn}`) + AppStorage.SetOrCreate('wifiList', []) + try { + // 如果按钮被打开了，记录状态，打开网络，开始扫描可用WLAN + if (isOn) { + this.isSwitchOn = true + wifi.enableWifi()//使WLAN功能可用 + return + } else { + // 如果按钮被关闭了记录状态，断开网络禁用网络 + this.isSwitchOn = false + this.isLinked = false + wifi.disconnect()//断开当前WLAN连接 + wifi.disableWifi()//使WLAN功能不可用 + } + } catch (error) { + Logger.error(TAG, `failed,code:${JSON.stringify(error.code)},message:${JSON.stringify(error.message)}`) + } + }) + } + } + .width('100%') + .padding({ left: 16, right: 16 }) + if (this.isLinked && this.isSwitchOn) { + //如果当前按钮处于打开状态，且WLAN是已连接状态 + Column() { + Text($r('app.string.connected')) + .fontSize(22) + .width('100%') + Row() { + Text(this.linkedInfo.ssid)//展示当前已连接的WLAN + .fontSize(20) + .fontColor(Color.Black) + .layoutWeight(1) + Text($r('app.string.connected')) + .fontSize(18) + .fontColor(Color.Black) + } + .width('100%') + .padding(10) + .margin({ left: 16, right: 16 }) + .border({ radius: 15, color: Color.Gray, width: 1 }) + .backgroundColor(Color.White) + } + .width('100%') + .padding({ left: 16, right: 16 }) + } + if (this.isSwitchOn) { + //如果按钮处于打开状态，展示所有可用WLAN + AvailableWifi({ linkedInfo: this.linkedInfo })//AvailableWifi引入自component/AvailableWifi.ets + } + } + .width('100%') + .height('100%') + .backgroundColor($r('app.color.index_bg')) + } + ``` + +5. 展示可用WLAN列表及WLAN的连接。 + + 使用List组件呈现可用WLAN列表，ListItem由一个呈现WLANssid的Text组件，一个表示其是否被加密的Text组件和一个展示其加密与否图像的Image组件组成。 + + ```typescript + //component/AvailableWifi.ets + build() { + List() { + ListItem() { + Row() { + Text($r('app.string.available_wlan')) + .fontSize(22) + .layoutWeight(1) + } + .id('validWlan') + .width('100%') + } + //通过数据懒加载的方式从数据源中每次迭代一个可用WLAN进行展示，可用列表被放置在滚动容器中，被划出可视区域外的资源会被回收 + LazyForEach(this.wifiDataResource, (item, index) => { + ListItem() { + WifiView({ wifi: item })//WifiView引入自Component/WifiView.ets，负责可用WLAN信息展示的具体实现 + } + .id(`Wifi${index}`) + //对可用WLAN点击时触发事件 + .onClick(() => { + Logger.info(TAG, 'wifi click') + this.scanInfo = item + if (this.linkedInfo !== null && item.ssid === this.linkedInfo.ssid) { + prompt.showToast({ message: 'this wifi is connected' })//如果当前已连接WLAN并且点击的就是这个WLAN，创建并显示文本提示框 + return + } + if (item.securityType === 0 || item.securityType === 1) { + //如果点击的这个WLAN的加密类型是无效加密类型或者开放加密类型，调用model/Wifimodel.ets中的connectNetwork方法连接此WLAN + this.wifiModel.connectNetwork(item, '') + return + } + //如果点击的这个WLAN的加密类型是其他加密类型，则需要输入密码，调用component/PswDialog.ets中的方法进行弹窗的生成 + this.pswDialogController.open() + }) + }, item => JSON.stringify(item)) + } + .width('100%') + .height('100%') + .padding({ left: 16, right: 16 }) + .layoutWeight(1) + .divider({ strokeWidth: 1, color: Color.Gray, startMargin: 10, endMargin: 10 }) + .margin({ top: 10 }) + } + //pswDialogController回调的action函数，将传回的WLAN信息与密码传入model/Wifimodel.ets中的connectNetwork方法中 + onAccept(scanInfo, psw) { + Logger.info(TAG, 'connect wifi') + self.wifiModel.connectNetwork(scanInfo, psw) + } + ... + //Component/WifiView.ets + aboutToAppear() { + Logger.debug(TAG, `aboutToAppear ${JSON.stringify(this.wifi)}`) + if (this.wifi) { + if (this.wifi.securityType) { + if (this.wifi.securityType === 0 || this.wifi.securityType === 1) { + //WLAN的加密类型是无效加密类型或者开放加密类型 + this.securityString = $r('app.string.open') + this.isLock = false + } + } + } + } + build() { + Row() { + Column() { + if (this.wifi) { + if (this.wifi.ssid) { + Text(this.wifi.ssid) + .fontSize(20) + .width('100%') + } + } + //如果WLAN的加密类型是无效加密类型或者开放加密类型，显示“开放”，反之显示“加密” + Text(this.securityString) + .fontSize(18) + .fontColor(Color.Gray) + .width('100%') + } + .layoutWeight(1) + + Stack({ alignContent: Alignment.BottomEnd }) { + //如果WLAN的加密类型是无效加密类型或者开放加密类型，显示不带锁的图标，反之显示带锁的图标 + Image($r('app.media.wifi')) + .height(30) + .width(30) + .objectFit(ImageFit.Contain) + if (this.isLock) { + Image($r('app.media.lock')) + .objectFit(ImageFit.Contain) + .width(15) + .height(15) + } + } + .width(40) + .height(40) + .margin({ right: 10 }) + } + .backgroundColor(Color.White) + .width('100%') + .padding(10) + } + } + ... + //model/Wifimodel.ets + connectNetwork(scanInfo: wifi.WifiScanInfo, psw) { + prompt.showToast({ message: 'connecting', duration: 5000 }) + Logger.debug(TAG, `connectNetwork bssid=${scanInfo.bssid}`) + // 这里因为api问题，需要声明为any，已提单 + let deviceConfig: any = { + ssid: scanInfo.ssid, + bssid: scanInfo.bssid, + preSharedKey: psw, + isHiddenSsid: false, + securityType: scanInfo.securityType + } + try { + wifi.connectToDevice(deviceConfig)//连接到指定网络 + Logger.debug(TAG, `connectToDevice success`) + } catch (err) { + Logger.debug(TAG, `connectToDevice fail err is ${JSON.stringify(err)}`) + } + try { + wifi.addDeviceConfig(deviceConfig)//添加网络配置 + } catch (err) { + Logger.debug(TAG, `addDeviceConfig fail err is ${JSON.stringify(err)}`) + } + } + ... + //component/PswDialog.ets + build() { + Column() { + Text(this.scanInfo.ssid) + .fontSize(20) + .width('95%') + + TextInput({ placeholder: 'input password' })//密码的输入框 + .id('input') + .type(InputType.Password) + .placeholderColor(Color.Gray) + .fontSize(19) + .margin({ top: 15 }) + .width('95%') + .height(36) + //每当输入框中的内容变化，它就赋值给psw + .onChange((value: string) => { + this.psw = value + }) + + Row() { + //确认按钮 + Button() { + Text($r('app.string.sure')) + .fontColor(Color.Blue) + .fontSize(17) + } + .id('sure') + .layoutWeight(7) + .backgroundColor(Color.White) + .margin(5) + .onClick(() => { + this.controller.close() + this.action(this.scanInfo, this.psw) + }) + + Text() + .width(1) + .height(35) + .backgroundColor($r('app.color.text_color')) + //取消按钮 + Button() { + Text($r('app.string.cancel')) + .fontColor(Color.Red) + .fontSize(17) + } + .layoutWeight(7) + .backgroundColor(Color.White) + .margin(5) + .onClick(() => { + this.controller.close() + }) + } + .width('100%') + .margin({ top: '3%' }) + } + .padding(15) + } + ``` + +## 全部代码 + +本例完整代码sample示例链接：[WLAN](https://gitee.com/openharmony/applications_app_samples/tree/master/code/SystemFeature/Connectivity/Wlan) + +## 参考 + +- [权限列表](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/security/permission-list.md#ohospermissiondistributed_datasync) +- [@ohos.wifiManager](../application-dev/reference/apis/js-apis-wifiManager.md) +