Merge branch 'master' of https://gitee.com/openharmony/docs into br_333

Signed-off-by: Nfangjinliang <fangjinliang1@huawei.com>

en/application-dev/Readme-EN.md

@@ -9,6 +9,7 @@
     - [Getting Started with Application Development](quick-start/Readme-EN.md)
     - [Directory Structure](quick-start/package-structure.md)
 - Development
+    - [Ability Development](ability/Readme-EN.md)
     - [UI Development](ui/Readme-EN.md)
     - Basic Feature Development
        - [Window Manager](windowmanager/Readme-EN.md)

en/application-dev/ability/Readme-EN.md

+# Ability Development
+ - [Ability Framework Overview](ability-brief.md)
+ - FA Model
+   - [FA Model Overview](fa-brief.md)
+   - [Page Ability Development](fa-pageability.md)
+   - [Service Ability Development](fa-serviceability.md)
+   - [Data Ability Development](fa-dataability.md)
+   - [FA Widget Development](fa-formability.md)
+ - Other
+   - [Ability Assistant Usage](ability-assistant-guidelines.md)

en/application-dev/ability/fa-formability.md

+# FA Widget Development
+
+## Widget Overview
+A Form ability presents a widget, which is a set of UI components used to display important information or operations for an application. It provides users with direct access to a desired application service, without requiring them to open the application.
+
+A widget displays brief information about an application on the UI of another application (host application, currently system applications only) and provides basic interactive features such as opening a UI page or sending a message. The widget client is responsible for displaying the service widget.
+
+Basic concepts:
+- Widget provider
+  The widget provider is an atomic service that provides the content to be displayed. It controls the display content, component layout, and component click events of a widget.
+- Widget client
+  The widget client is an application that displays the widget content and controls the position where the widget is displayed in the host application.
+- Widget Manager
+  The Widget Manager is a resident agent that manages widgets added to the system and provides functions such as periodic widget update.
+
+> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**
+> The widget client and provider do not keep running all the time. The Widget Manager starts the widget provider to obtain widget information when a widget is added, deleted, or updated.
+
+You only need to develop widget content as the widget provider. The system automatically handles the work done by the widget client and Widget Manager.
+
+The widget provider controls the widget content to display, component layout, and click events bound to components.
+
+## Scenario
+
+Form ability development refers to the development conducted by the widget provider based on the Feature Ability (FA) model(fa-brief.md). As a widget provider, you need to carry out the following operations:
+
+- Develop the lifecycle callback functions in **FormAbility**.
+- Create a **FormBindingData** object.
+- Update a widget through **FormProvider**.
+- Develop the widget UI page.
+
+## Available APIs
+
+The table below describes the lifecycle callback functions provided **FormAbility**.
+
+**Table 1** FormAbility APIs
+
+| API                                                      | Description                                        |
+| :----------------------------------------------------------- | :------------------------------------------- |
+| onCreate(want: Want): formBindingData.FormBindingData        | Called to notify the widget provider that a **Form** instance (widget) has been created.          |
+| onCastToNormal(formId: string): void                         | Called to notify the widget provider that a temporary widget has been converted to a normal one.|
+| onUpdate(formId: string): void                               | Called to notify the widget provider that a widget has been updated.          |
+| onVisibilityChange(newStatus: { [key: string]: number }): void | Called to notify the widget provider of the change of widget visibility.        |
+| onEvent(formId: string, message: string): void               | Called to instruct the widget provider to receive and process the widget event.      |
+| onDestroy(formId: string): void                              | Called to notify the widget provider that a **Form** instance (widget) has been destroyed.          |
+| onConfigurationUpdated(config: Configuration): void;         | Called when the configuration of the environment where the ability is running is updated.                      |
+
+For details about the **FormProvider** APIs, see [FormProvider](../reference/apis/js-apis-formprovider.md).
+
+**Table 2** FormProvider APIs
+
+| API                                                      | Description                                             |
+| :----------------------------------------------------------- | :------------------------------------------------ |
+| setFormNextRefreshTime(formId: string, minute: number, callback: AsyncCallback<void>): void; | Sets the next refresh time for a widget. This API uses an asynchronous callback to return the result.                   |
+| setFormNextRefreshTime(formId: string, minute: number): Promise<void>; | Sets the next refresh time for a widget. This API uses a promise to return the result.|
+| updateForm(formId: string, formBindingData: FormBindingData, callback: AsyncCallback<void>): void; | Updates a widget. This API uses an asynchronous callback to return the result.                                 |
+| updateForm(formId: string, formBindingData: FormBindingData): Promise<void>; | Updates a widget. This API uses a promise to return the result.              |
+
+## How to Develop
+
+### Creating a Form Ability
+
+To create a widget in the FA model, you need to implement the lifecycle callback functions of **FormAbility**. The sample code is as follows:
+
+1. Import the required modules.
+
+   ```javascript
+   import formBindingData from '@ohos.application.formBindingData'
+   import formInfo from '@ohos.application.formInfo'
+   import formProvider from '@ohos.application.formProvider'
+   ```
+   
+2. Implement the lifecycle callback functions of **FormAbility**.
+
+   ```javascript
+   export default {
+       onCreate(want) {
+           console.log('FormAbility onCreate');
+           // Persistently store widget information for subsequent use, such as widget instance retrieval and update.
+           let obj = {
+               "title": "titleOnCreate",
+               "detail": "detailOnCreate"
+           };
+           let formData = formBindingData.createFormBindingData(obj);
+           return formData;
+       },
+       onCastToNormal(formId) {
+           // Called when the widget client converts the temporary widget into a normal one. The widget provider should do something to respond to the conversion.
+           console.log('FormAbility onCastToNormal');
+       },
+       onUpdate(formId) {
+           // To support scheduled update, periodic update, or update requested by the widget client for a widget, override this method for data update.
+           console.log('FormAbility onUpdate');
+           let obj = {
+               "title": "titleOnUpdate",
+               "detail": "detailOnUpdate"
+           };
+           let formData = formBindingData.createFormBindingData(obj);
+           formProvider.updateForm(formId, formData).catch((error) => {
+               console.log('FormAbility updateForm, error:' + JSON.stringify(error));
+           });
+       },
+       onVisibilityChange(newStatus) {
+           // Called when the widget client initiates an event about visibility changes. The widget provider should do something to respond to the notification.
+           console.log('FormAbility onVisibilityChange');
+       },
+       onEvent(formId, message) {
+           // If the widget supports event triggering, override this method and implement the trigger.
+           console.log('FormAbility onEvent');
+       },
+       onDestroy(formId) {
+           // Delete widget data.
+           console.log('FormAbility onDestroy');
+       },
+       onAcquireFormState(want) {
+           console.log('FormAbility onAcquireFormState');
+           return formInfo.FormState.READY;
+       },
+   }
+   ```
+
+### Configuring config.json for the Form Ability
+
+Configure the **config.json** file for the **Form** ability.
+
+- The **js** module in the **config.json** file provides the JavaScript resources of the **Form** ability. The internal field structure is described as follows:
+
+  | Field| Description                                                         | Data Type| Default              |
+  | -------- | ------------------------------------------------------------ | -------- | ------------------------ |
+  | name     | Name of a JavaScript component. The default value is **default**.   | String  | No                      |
+  | pages    | Route information about all pages in the JavaScript component, including the page path and page name. The value is an array, in which each element represents a page. The first element in the array represents the home page of the JavaScript FA.| Array    | No                      |
+  | window   | Window-related configurations. This field applies only to phones, tablets, smart TVs, head units, and wearable devices.| Object    | Yes                  |
+  | type     | Type of the JavaScript component. Available values are as follows:<br>**normal**: indicates that the JavaScript component is an application instance.<br>**form**: indicates that the JavaScript component is a widget instance.| String  | Yes (initial value: **normal**)|
+  | mode     | Development mode of the JavaScript component.                                      | Object    | Yes (initial value: left empty)      |
+
+  A configuration example is as follows:
+
+  ```json
+     "js": [{
+         "name": "widget",
+         "pages": ["pages/index/index"],
+         "window": {
+             "designWidth": 720,
+             "autoDesignWidth": true
+         },
+         "type": "form"
+     }]
+  ```
+
+- The **abilities** module in the **config.json** file corresponds to the **Form** ability. The internal field structure is described as follows:
+
+  | Field           | Description                                                         | Data Type  | Default              |
+  | ------------------- | ------------------------------------------------------------ | ---------- | ------------------------ |
+  | name                | Class name of the widget. The value is a string with a maximum of 127 bytes.                   | String    | No                      |
+  | 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)      |
+  | isDefault           | Whether the widget is a default one. Each ability has only one default widget.<br>**true**: The widget is the default one.<br>**false**: The widget is not the default one.| Boolean    | No                      |
+  | type                | Type of the widget. Available values are as follows:<br>**Java**: indicates a Java-programmed widget.<br>**JS**: indicates a JavaScript-programmed widget.| String    | No                      |
+  | colorMode           | Color mode of the widget. Available values are as follows:<br>**auto**: The widget adopts the auto-adaptive color mode.<br>**dark**: The widget adopts the dark color mode.<br>**light**: The widget adopts the light color mode.| String    | Yes (initial value: **auto**)|
+  | supportDimensions   | Grid styles supported by the widget. Available values are as follows:<br>1 * 2: indicates a grid with one row and two columns.<br>2 * 2: indicates a grid with two rows and two columns.<br>2 * 4: indicates a grid with two rows and four columns.<br>4 * 4: indicates a grid with four rows and four columns.| String array| No                      |
+  | defaultDimension    | Default grid style of the widget. The value must be available in the **supportDimensions** array of the widget.| String    | No                      |
+  | landscapeLayouts    | Landscape layouts for the grid styles. Values in this array must correspond to the values in the **supportDimensions** array. This field is required only by Java-programmed widgets.| String array| No                      |
+  | portraitLayouts     | Portrait layouts for the grid styles. Values in this array must correspond to the values in the **supportDimensions** array. This field is required only by Java-programmed widgets.| String array| No                      |
+  | updateEnabled       | Whether the widget can be updated periodically. Available values are as follows:<br>**true**: The widget can be updated periodically, depending on the update way you select, either at a specified interval (**updateDuration**) or at the scheduled time (**scheduledUpdateTime**). **updateDuration** is preferentially recommended.<br>**false**: The widget cannot be updated periodically.| Boolean  | No                      |
+  | scheduledUpdateTime | Scheduled time to update the widget. The value is in 24-hour format and accurate to minute.        | String    | Yes (initial value: **0:0**) |
+  | updateDuration      | Interval to update the widget. The value is a natural number, in the unit of 30 minutes.<br>If the value is **0**, this field does not take effect.<br>If the value is a positive integer ***N***, the interval is calculated by multiplying ***N*** and 30 minutes.| Number      | Yes (initial value: **0**)   |
+  | formConfigAbility   | Name of the facility or activity used to adjust a widget.                        | String    | Yes (initial value: left empty)    |
+  | formVisibleNotify   | Whether the widget is allowed to use the widget visibility notification.                          | String    | Yes (initial value: left empty)    |
+  | jsComponentName     | Component name of the widget. The value is a string with a maximum of 127 bytes. This field is required only by JavaScript-programmed widgets.| String    | No                      |
+  | metaData            | Metadata of the widget. This field contains the array of the **customizeData** field.           | Object      | Yes (initial value: left empty)    |
+  | customizeData       | Custom information about the widget.                                      | Object array  | Yes (initial value: left empty)    |
+
+  A configuration example is as follows:
+
+  ```json
+     "abilities": [{
+         "name": "FormAbility",
+         "description": "This is a FormAbility",
+         "formsEnabled": true,
+         "icon": "$media:icon",
+         "label": "$string:form_FormAbility_label",
+         "srcPath": "FormAbility",
+         "type": "service",
+         "forms": [{
+             "colorMode": "auto",
+             "defaultDimension": "2*2",
+             "description": "This is a service widget.",
+             "formVisibleNotify": true,
+             "isDefault": true,
+             "jsComponentName": "widget",
+             "name": "widget",
+             "scheduledUpdateTime": "10:30",
+             "supportDimensions": ["2*2"],
+             "type": "JS",
+             "updateDuration": 1,
+             "updateEnabled": true
+          }]
+     }]
+  ```
+
+
+### Widget Data Persistence
+
+Mostly, the widget provider is started only when it needs to obtain information about a widget. The Widget Manager supports multi-instance management and uses the widget ID to identify an instance. If the widget provider supports widget data modification, it must persistently store the data based on the widget ID, so that it can access the data of the target widget when obtaining, updating, or starting a widget.
+
+```javascript
+       onCreate(want) {
+           console.log('FormAbility onCreate');
+
+           let formId = want.parameters["ohos.extra.param.key.form_identity"];
+           let formName = want.parameters["ohos.extra.param.key.form_name"];
+           let tempFlag = want.parameters["ohos.extra.param.key.form_temporary"];
+           // Persistently store widget information for subsequent use, such as widget instance retrieval and update.
+           storeFormInfo(formId, formName, tempFlag, want);
+
+           let obj = {
+               "title": "titleOnCreate",
+               "detail": "detailOnCreate"
+           };
+           let formData = formBindingData.createFormBindingData(obj);
+           return formData;
+       }
+```
+
+You should override **onDestroy** to delete widget data.
+
+```javascript
+       onDestroy(formId) {
+           // Delete widget data.
+           deleteFormInfo(formId);
+           console.log('FormAbility onDestroy');
+       }
+```
+
+For details about the persistence method, see [Lightweight Data Store Development](../database/database-preference-guidelines.md).
+
+Note that the **Want** passed by the widget client to the widget provider contains a temporary flag, indicating whether the requested widget is a temporary one.
+
+Normal widget: a widget that will be persistently used by the widget client
+
+Temporary widget: a widget that is temporarily used by the widget client
+
+Data of a temporary widget is not persistently stored. If the widget framework is killed and restarted, data of a temporary widget will be deleted. However, the widget provider is not notified of which widget is deleted, and still keeps the data. Therefore, the widget provider should implement data clearing. In addition, the widget client may convert a temporary widget into a normal one. If the conversion is successful, the widget provider should process the widget ID and store the data persistently. This prevents the widget provider from deleting persistent data when clearing temporary widgets.
+
+### Developing the Widget UI Page
+You can use HML, CSS, and JSON to develop the UI page for a JavaScript-programmed widget.
+
+> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**
+> Currently, only the JavaScript-based web-like development paradigm can be used to develop the widget UI.
+
+   - HML:
+   ```html
+   <div class="container">
+       <stack>
+           <div class="container-img">
+               <image src="/common/widget.png" class="bg-img"></image>
+           </div>
+           <div class="container-inner">
+               <text class="title">{{title}}</text>
+               <text class="detail_text" onclick="routerEvent">{{detail}}</text>
+           </div>
+       </stack>
+   </div>
+   ```
+
+   - CSS:
+
+   ```css
+.container {
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+}
+
+.bg-img {
+    flex-shrink: 0;
+    height: 100%;
+}
+
+.container-inner {
+    flex-direction: column;
+    justify-content: flex-end;
+    align-items: flex-start;
+    height: 100%;
+    width: 100%;
+    padding: 12px;
+}
+
+.title {
+    font-size: 19px;
+    font-weight: bold;
+    color: white;
+    text-overflow: ellipsis;
+    max-lines: 1;
+}
+
+.detail_text {
+    font-size: 16px;
+    color: white;
+    opacity: 0.66;
+    text-overflow: ellipsis;
+    max-lines: 1;
+    margin-top: 6px;
+}
+   ```
+
+   - JSON:
+   ```json
+   {
+     "data": {
+       "title": "TitleDefault",
+       "detail": "TextDefault"
+     },
+     "actions": {
+       "routerEvent": {
+         "action": "router",
+         "abilityName": "com.example.MyApplication.hmservice.FormAbility",
+         "params": {
+           "message": "add detail"
+         }
+       }
+     }
+   }
+   ```
+
+Now you've got a widget shown below.
+
+![fa-form-example](figures/fa-form-example.png)

en/application-dev/reference/apis/Readme-EN.md

@@ -18,6 +18,8 @@
 - Media
     -   [Audio Management](js-apis-audio.md)
     -   [Media](js-apis-media.md)
+    -   [Image Processing](js-apis-image.md)
+    -   [Camera](js-apis-camera.md)
 - Security
     -   [User Authentication](js-apis-useriam-userauth.md)
     -   [Access Control](js-apis-abilityAccessCtrl.md)
@@ -76,8 +78,6 @@
     -   [Application Context](js-apis-basic-features-app-context.md)
     -   [Console Logs](js-apis-basic-features-logs.md)
     -   [Page Routing](js-apis-basic-features-routes.md)
-    -   [Pop-up Window](js-apis-basic-features-pop-up.md)
-    -   [Application Configuration](js-apis-basic-features-configuration.md)
     -   [Timer](js-apis-basic-features-timer.md)
     -   [Setting the System Time](js-apis-system-time.md)
     -   [Animation](js-apis-basic-features-animator.md)

en/application-dev/reference/apis/js-apis-audio.md

@@ -3058,7 +3058,6 @@ Reads the buffer from the audio capturer. This API uses an asynchronous callback
 audioCapturer.read(bufferSize, true, async(err, buffer) => {
     if (!err) {
         console.log("Success in reading the buffer data");
-        var number = fileio.writeSync(fd, buffer);
     }
 };
 ```

en/application-dev/reference/apis/js-apis-bluetooth.md

@@ -1311,7 +1311,7 @@ Disconnects an A2DP connection.
 
 ```js
 let a2dpSrc = bluetooth.getProfile(PROFILE_A2DP_SOURCE);
-let boolean ret = a2dpSrc.disconnect('XX:XX:XX:XX:XX:XX');
+let ret = a2dpSrc.disconnect('XX:XX:XX:XX:XX:XX');
 ```
 
 

en/application-dev/reference/apis/js-apis-socket.md

@@ -563,7 +563,7 @@ Enables listening for error events of the UDPSocket connection. This API uses an
 **Example**
 
 ```
-let udp = socket.constructUDPSocketInstance()
+let udp = socket.constructUDPSocketInstance();
 udp.on('error', err => {
 	console.log("on error, err:" + JSON.stringify(err))
 });
@@ -591,7 +591,7 @@ Disables listening for error events of the UDPSocket connection. This API uses a
 **Example**
 
 ```
-let udp = socket.constructUDPSocketInstance()
+let udp = socket.constructUDPSocketInstance();
 let callback = err =>{
 	console.log("on error, err:" + JSON.stringify(err));
 }

en/application-dev/reference/apis/js-apis-wifiext.md

+# WLAN
+
+> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**<br/>
+> The initial APIs of this module are supported since API version 8. Newly added APIs will be marked with a superscript to indicate their earliest API version.<br/>
+The APIs described in this document are used only for non-universal products, such as routers.
+
+
+## Modules to Import
+
+```js
+import wifiext from '@ohos.wifiext';
+```
+
+## wifiext.enableHotspot
+
+enableHotspot(): boolean;
+
+Enables the WLAN hotspot.
+
+- Required permissions:
+  ohos.permission.MANAGE_WIFI_HOTSPOT_EXT
+
+- System capability:
+  SystemCapability.Communication.WiFi.HotspotExt
+
+- Return value
+  | **Type**| **Description**|
+  | -------- | -------- |
+  | boolean | Returns **true** if the operation is successful; returns **false** otherwise.|
+
+
+## wifiext.disableHotspot
+
+disableHotspot(): boolean;
+
+Disables the WLAN hotspot.
+
+- Required permissions:
+  ohos.permission.MANAGE_WIFI_HOTSPOT_EXT
+
+- System capability:
+  SystemCapability.Communication.WiFi.HotspotExt
+
+- Return value
+  | **Type**| **Description**|
+  | -------- | -------- |
+  | boolean | Returns **true** if the operation is successful; returns **false** otherwise.|
+
+
+## wifiext.getSupportedPowerModel
+
+getSupportedPowerModel(): Promise&lt;Array&lt;PowerModel&gt;&gt;
+
+Obtains the supported power models. The method uses a promise to return the result.
+
+- Required permissions:
+  ohos.permission.GET_WIFI_INFO
+
+- System capability:
+  SystemCapability.Communication.WiFi.HotspotExt
+
+- Return value
+  | Type| Description|
+  | -------- | -------- |
+  | Promise&lt;Array&lt;[PowerModel](#PowerModel)&gt;&gt; | Promise used to return the power models obtained.|
+
+
+## PowerModel
+
+Enumerates of the power models.
+
+| Name| Default Value| Description|
+| -------- | -------- | -------- |
+| SLEEPING | 0 | Sleeping|
+| GENERAL | 1 | General|
+| THROUGH_WALL | 2 | Through_wall|
+
+
+## wifiext.getSupportedPowerModel
+
+getSupportedPowerModel(callback: AsyncCallback&lt;Array&lt;PowerModel&gt;&gt;): void
+
+Obtains the supported power models. The method uses an asynchronous callback to return the result.
+
+- Required permissions:
+  ohos.permission.GET_WIFI_INFO
+
+- System capability:
+  SystemCapability.Communication.WiFi.HotspotExt
+
+- Parameters
+  | Name| Type| Mandatory| Description|
+  | -------- | -------- | -------- | -------- |
+  | callback | AsyncCallback&lt;[PowerModel](#PowerModel)&gt; | Yes| Callback used to return the power models obtained.|
+
+
+## wifiext.getPowerModel
+
+getPowerModel(): Promise&lt;PowerModel&gt;
+
+Obtains the power model. The method uses a promise to return the result.
+
+- Required permissions:
+  ohos.permission.GET_WIFI_INFO
+
+- System capability:
+  SystemCapability.Communication.WiFi.HotspotExt
+
+- Return value
+  | Type| Description|
+  | -------- | -------- |
+  | Promise&lt;[PowerModel](#PowerModel)&gt; | Promise used to return the power model obtained.|
+
+
+## wifiext.getPowerModel
+
+getPowerModel(callback: AsyncCallback&lt;PowerModel&gt;): void
+
+Obtains the power model. The method uses an asynchronous callback to return the result.
+
+- Required permissions:
+  ohos.permission.GET_WIFI_INFO
+
+- System capability:
+  SystemCapability.Communication.WiFi.HotspotExt
+
+- Parameters
+  | Name| Type| Mandatory| Description|
+  | -------- | -------- | -------- | -------- |
+  | callback | AsyncCallback&lt;[PowerModel](#PowerModel)&gt; | Yes| Callback invoked to return the power mode obtained.|
+
+
+## wifiext.setPowerModel
+
+setPowerModel(model: PowerModel) : boolean;
+
+ Sets the power model.
+
+- Required permissions:
+  ohos.permission.MANAGE_WIFI_HOTSPOT_EXT
+
+- System capability:
+  SystemCapability.Communication.WiFi.HotspotExt
+
+- Parameters
+  | Name| Type| Mandatory| Description|
+  | -------- | -------- | -------- | -------- |
+  | model | AsyncCallback&lt;[PowerModel](#PowerModel)&gt; | Yes| Power model to set.|
+
+- Return value
+  | **Type**| **Description**|
+  | -------- | -------- |
+  | boolean | Returns **true** if the operation is successful; returns **false** otherwise.|

en/application-dev/reference/arkui-ts/Readme-EN.md

@@ -73,6 +73,7 @@
         - [TextInput](ts-basic-components-textinput.md)
         - [TextPicker](ts-basic-components-textpicker.md)
         - [TextTimer](ts-basic-components-texttimer.md)
+        - [TimePicker](ts-basic-components-timepicker.md)
         - [Toggle](ts-basic-components-toggle.md)
         - [TextClock](ts-basic-components-textclock.md)
         - [Web](ts-basic-components-web.md)
@@ -143,6 +144,7 @@
         - [Action Sheet](ts-methods-action-sheet.md)
         - [Custom Dialog Box](ts-methods-custom-dialog-box.md)
         - [Date Picker Dialog Box](ts-methods-datepicker-dialog.md)
+        - [Time Picker Dialog Box](ts-methods-timepicker-dialog.md)
         - [Text Picker Dialog Box](ts-methods-textpicker-dialog.md)
     - [Menu](ts-methods-menu.md)
 - Appendix

en/application-dev/reference/arkui-ts/ts-basic-components-datepicker.md

 # DatePicker
 
-
 > ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**
 > This component is supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version.
 
 
-The **<DatePicker>** component allows users to select date and time.
+The **\<DatePicker>** component allows users to select a date from the given range.
 
 
 ## Required Permissions
 
-None
+No
 
 
 ## Child Components
 
-None
+No
 
 
 ## APIs
 
-DatePicker(value:{start?: Date, end?: Date, selected?: Date, type?: DatePickerType})
+DatePicker(options?: DatePickerOptions)
 
-Creates a date picker that allows users to select a date or time within the specified range.
+Creates a date picker in the given date range.
 
-- Parameters
-    | Name | Type | Mandatory | Default Value | Description |
+- options parameters
+  | Name| Type| Mandatory| Default Value| Description|
   | -------- | -------- | -------- | -------- | -------- |
-  | start | Date | No | Date('1970-1-1') | Start date of the date picker. |
-  | end | Date | No | Date('2100-12-31') | End date of the date picker. |
-  | selected | Date | No | Current system date or time | Selected date when **type** is set to **DatePickerType.Date** and selected time when **type** is set to **DatePickerType.Time**. |
-  | type | DatePickerType | No | DatePickerType.Date | Picker type, which can be date picker and time picker. The date picker is used by default. |
-
-- DatePickerType enums
-    | Name | Description |
-  | -------- | -------- |
-  | Date | Date picker. |
-  | Time | Time picker. |
+  | start | Date | No| Date('1970-1-1') | Start date of the picker.|
+  | end | Date | No| Date('2100-12-31') | End date of the picker.|
+  | selected | Date | No| Current system date| Date of the selected item.|
 
 
 ## Attributes
 
-| Name | Type | Default Value | Description |
-| -------- | -------- | -------- |-------- |
-| lunar | boolean | false | Whether to display the lunar calendar.<br/>- **true**: The lunar calendar is displayed.<br/>- **false**: The lunar calendar is not displayed. |
-| useMilitaryTime | boolean | false | Whether the display time is in 24-hour format. The value cannot be dynamically modified. |
+| Name| Type| Default Value| Description|
+| -------- | -------- | -------- | -------- |
+| lunar | boolean | false | Whether to display the lunar calendar.<br>-&nbsp;**true**: Display the lunar calendar.<br>-&nbsp;**false**: Do not display the lunar calendar.|
 
 
 ## Events
 
-| Name | Description |
+| Name| Description|
 | -------- | -------- |
-| onChange(callback: (value: DatePickerResult) =&gt; void) | This event is triggered when a date or time is selected. |
+| onChange(callback:&nbsp;(value:&nbsp;DatePickerResult)&nbsp;=&gt;&nbsp;void) | Triggered when a date is selected.|
 
-- DatePickerResult
-    | Name | Type | Description |
-  | -------- | -------- | -------- |
-  | year | number | Year of the selected date (when **type** is **DatePickerType.Date**). |
-  | month | number | Month of the selected date (when **type** is **DatePickerType.Date**). |
-  | day | number | Date of the selected date (when **type** is **DatePickerType.Date**). |
-  | hour | number | Hour portion of the selected time (when **type** is **DatePickerType.Time**). |
-  | minute | number | Minute portion of the selected time (when **type** is **DatePickerType.Time**). |
+### DatePickerResult
+| Name| Type| Description|
+| -------- | -------- | -------- |
+| year | number | Year of the selected date.|
+| month | number | Month of the selected date.|
+| day | number | Day of the selected date.|
 
 
 ## Example
 
 
-### Date Picker (with Lunar Calendar)
-
+### Date Picker Sample Code (With Lunar Calendar)
 
 ```
 @Entry
@@ -79,9 +67,8 @@ struct DatePickerExample01 {
     Column() {
       DatePicker({
         start: new Date('1970-1-1'),
-        end: new Date('2200-1-1'),
+        end: new Date('2100-1-1'),
         selected: this.selectedDate,
-        type: DatePickerType.Date
       })
       .lunar(true)
       .onChange((date: DatePickerResult) => {
@@ -93,8 +80,7 @@ struct DatePickerExample01 {
 ```
 
 
-### Date Picker (Without Lunar Calendar)
-
+### Date Picker Sample Code (No Lunar Calendar)
 
 ```
 @Entry
@@ -106,9 +92,8 @@ struct DatePickerExample02 {
     Column() {
       DatePicker({
         start: new Date('1970-1-1'),
-        end: new Date('2200-1-1'),
+        end: new Date('2100-1-1'),
         selected: this.selectedDate,
-        type: DatePickerType.Date
       })
       .lunar(false)
       .onChange((date: DatePickerResult) => {
@@ -120,31 +105,3 @@ struct DatePickerExample02 {
 ```
 
 
-
-### Time Picker
-
-
-```
-@Entry
-@Component
-struct DatePickerExample03 {
-  private selectedTime: Date = new Date('2021-9-29 08:00:00')
-
-  build() {
-    Column() {
-      DatePicker({
-        start: new Date('00:00:00'),
-        end: new Date('23:59:59'),
-        selected: this.selectedTime,
-        type: DatePickerType.Time
-      })
-      .useMilitaryTime(true)
-      .onChange((date: DatePickerResult) => {
-        console.info('select current date is: ' + JSON.stringify(date))
-      })
-    }.width('100%')
-  }
-}
-```
-
-![en-us_image_0000001256858401](figures/en-us_image_0000001256858401.gif)

en/application-dev/reference/arkui-ts/ts-basic-components-timepicker.md

+# TimePicker
+
+> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**
+> This component is supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version.
+
+
+The **\<TimePicker>** component allows users to select a time from the given range.
+
+
+## Required Permissions
+
+No
+
+
+## Child Components
+
+No
+
+
+## APIs
+
+TimePicker(options?: TimePickerOptions)
+
+Creates a time picker whose default time range is from 00:00 to 23:59.
+
+- options parameters
+  | Name| Type| Mandatory| Default Value| Description|
+  | -------- | -------- | -------- | -------- | -------- |
+  | selected | Date | No| Current system time| Time of the selected item.|
+
+
+## Attributes
+
+| Name| Type| Default Value| Description|
+| -------- | -------- | -------- | -------- |
+| useMilitaryTime | boolean | false | Whether to display time in 24-hour format. The value cannot be modified dynamically.|
+
+
+## Events
+
+| Name| Description|
+| -------- | -------- |
+| onChange(callback:&nbsp;(value:&nbsp;TimePickerResult )&nbsp;=&gt;&nbsp;void) | Triggered when a time is selected.|
+
+### TimePickerResult
+| Name| Type| Description|
+| -------- | -------- | -------- |
+| hour | number | Hour portion of the selected time.|
+| minute | number | Minute portion of the selected time.|
+
+
+## Example
+
+
+### Time Picker
+
+```
+@Entry
+@Component
+struct TimePickerExample {
+  private selectedTime: Date = new Date('08-00')
+
+  build() {
+    Column() {
+      TimePicker({
+        selected: this.selectedTime,
+      })
+      .useMilitaryTime(true)
+      .onChange((date: TimePickerResult) => {
+        console.info('select current date is: ' + JSON.stringify(date))
+      })
+    }.width('100%')
+  }
+}
+```
+
+![en-us_image_0000001251292933](figures/en-us_image_0000001251292933.gif)

en/application-dev/reference/arkui-ts/ts-methods-datepicker-dialog.md

@@ -3,7 +3,7 @@
 > ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**
 > This component is supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version.
 
-You can display a date or time picker in a dialog box to allow users to select a date or time from the given range.
+You can display a date picker in a dialog box to allow users to select a date from the given range.
 
 ## Required Permissions
 
@@ -11,22 +11,20 @@ None
 
 ## DatePickerDialog.show
 
-show(options?: DatePickerDialogOption)
+show(options?: DatePickerDialogOptions)
 
-Shows a date or time picker in the given settings.
+Defines and displays a date picker dialog box.
 
-- DatePickerDialogOption parameters
+- options parameters
   | Name| Type| Mandatory| Default Value| Description|
   | -------- | -------- | -------- | -------- | -------- |
   | start | Date | No| Date('1970-1-1') | Start date of the picker.|
   | end | Date | No| Date('2100-12-31') | End date of the picker.|
-  | selected | Date | No| Current system date or time| Date or time of the selected item in the picker. When **type** is set to **DatePickerType.Date**, this parameter indicates the date of the selected item. When **type** is set to **DatePickerType.Time**, this parameter indicates the time of the selected item.|
-  | type | [DatePickerType](ts-basic-components-datepicker.md) | No| DatePickerType.Date | Picker type, which can be the date picker and time picker.|
+  | selected | Date | No| Current system date| Date of the selected item.|
   | lunar | boolean | No| false | Whether to display the lunar calendar.|
-  | useMilitaryTime | boolean | No| false | Whether to display time in 24-hour format.|
-  | onAccept | (value: [DatePickerResult](ts-basic-components-datepicker.md)) => void | No| - | Triggered when the OK button in the dialog box is clicked.|
+  | onAccept | (value: [DatePickerResult](ts-basic-components-datepicker.md#DatePickerResult)) => void | No| - | Triggered when the OK button in the dialog box is clicked.|
   | onCancel | () => void | No| - | Triggered when the Cancel button in the dialog box is clicked.|
-  | onChange | (value: [DatePickerResult](ts-basic-components-datepicker.md)) => void | No| - | Triggered when the selected item in the picker changes.|
+  | onChange | (value: [DatePickerResult](ts-basic-components-datepicker.md#DatePickerResult)) => void | No| - | Triggered when the selected item in the picker changes.|
 
 ## Example
 
@@ -36,8 +34,6 @@ Shows a date or time picker in the given settings.
 @Component
 struct DatePickerDialogExample01 {
   @State isLunar: boolean = true
-  @State isUseMilitaryTime: boolean = false
-  @State datePickerType: DatePickerType = DatePickerType.Date
   selectedDate: Date = new Date("2000-1-1")
 
   build() {
@@ -48,15 +44,10 @@ struct DatePickerDialogExample01 {
           start: new Date("2000-1-1"),
           end: new Date("2005-1-1"),
           selected: this.selectedDate,
-          type: this.datePickerType,
           lunar: this.isLunar,
-          useMilitaryTime: this.isUseMilitaryTime,
           onAccept: (value: DatePickerResult) => {
-            console.info("DatePickerDialog:onAccept()" + JSON.stringify(value))
-            if (this.datePickerType == DatePickerType.Date) {
             this.selectedDate.setFullYear(value.year, value.month, value.day)
-            } else if (this.datePickerType == DatePickerType.Time) {
-              this.selectedDate.setHours(value.hour, value.minute, value.second)
+            console.info("DatePickerDialog:onAccept()" + JSON.stringify(value))
             }
           },
           onCancel: () => {
@@ -77,49 +68,6 @@ struct DatePickerDialogExample01 {
 @Component
 struct DatePickerDialogExample02 {
   @State isLunar: boolean = false
-  @State isUseMilitaryTime: boolean = false
-  @State datePickerType: DatePickerType = DatePickerType.Date
-  selectedDate: Date = new Date("2000-1-1")
-
-  build() {
-    Flex({direction: FlexDirection.Column, alignItems: ItemAlign.Center,
-      justifyContent: FlexAlign.Center }) {
-      Button("DatePickerDialog").onClick(() => {
-        DatePickerDialog.show({
-          start: new Date("2000-1-1"),
-          end: new Date("2005-1-1"),
-          selected: this.selectedDate,
-          type: this.datePickerType,
-          lunar: this.isLunar,
-          useMilitaryTime: this.isUseMilitaryTime,
-          onAccept: (value: DatePickerResult) => {
-            console.info("DatePickerDialog:onAccept()" + JSON.stringify(value))
-            if (this.datePickerType == DatePickerType.Date) {
-              this.selectedDate.setFullYear(value.year, value.month, value.day)
-            } else if (this.datePickerType == DatePickerType.Time) {
-              this.selectedDate.setHours(value.hour, value.minute, value.second)
-            }
-          },
-          onCancel: () => {
-            console.info("DatePickerDialog:onCancel()")
-          },
-          onChange: (value: DatePickerResult) => {
-            console.info("DatePickerDialog:onChange()" + JSON.stringify(value))
-          }
-        })
-      })
-    }
-  }
-}
-```
-### Time Picker Sample Code (24-Hour Clock)
-```
-@Entry
-@Component
-struct DatePickerDialogExample03 {
-  @State isLunar: boolean = false
-  @State isUseMilitaryTime: boolean = true
-  @State datePickerType: DatePickerType = DatePickerType.Time
   selectedDate: Date = new Date("2000-1-1")
 
   build() {
@@ -130,56 +78,10 @@ struct DatePickerDialogExample03 {
           start: new Date("2000-1-1"),
           end: new Date("2005-1-1"),
           selected: this.selectedDate,
-          type: this.datePickerType,
           lunar: this.isLunar,
-          useMilitaryTime: this.isUseMilitaryTime,
           onAccept: (value: DatePickerResult) => {
-            console.info("DatePickerDialog:onAccept()" + JSON.stringify(value))
-            if (this.datePickerType == DatePickerType.Date) {
             this.selectedDate.setFullYear(value.year, value.month, value.day)
-            } else if (this.datePickerType == DatePickerType.Time) {
-              this.selectedDate.setHours(value.hour, value.minute, value.second)
-            }
-          },
-          onCancel: () => {
-            console.info("DatePickerDialog:onCancel()")
-          },
-          onChange: (value: DatePickerResult) => {
-            console.info("DatePickerDialog:onChange()" + JSON.stringify(value))
-          }
-        })
-      })
-    }
-  }
-}
-```
-### Time Picker Sample Code (12-Hour Clock)
-```
-@Entry
-@Component
-struct DatePickerDialogExample04 {
-  @State isLunar: boolean = false
-  @State isUseMilitaryTime: boolean = false
-  @State datePickerType: DatePickerType = DatePickerType.Time
-  selectedDate: Date = new Date("2000-1-1")
-
-  build() {
-    Flex({direction: FlexDirection.Column, alignItems: ItemAlign.Center,
-      justifyContent: FlexAlign.Center }) {
-      Button("DatePickerDialog").onClick(() => {
-        DatePickerDialog.show({
-          start: new Date("2000-1-1"),
-          end: new Date("2005-1-1"),
-          selected: this.selectedDate,
-          type: this.datePickerType,
-          lunar: this.isLunar,
-          useMilitaryTime: this.isUseMilitaryTime,
-          onAccept: (value: DatePickerResult) => {
             console.info("DatePickerDialog:onAccept()" + JSON.stringify(value))
-            if (this.datePickerType == DatePickerType.Date) {
-              this.selectedDate.setFullYear(value.year, value.month, value.day)
-            } else if (this.datePickerType == DatePickerType.Time) {
-              this.selectedDate.setHours(value.hour, value.minute, value.second)
             }
           },
           onCancel: () => {

en/application-dev/reference/arkui-ts/ts-methods-timepicker-dialog.md

+# Time Picker Dialog Box
+
+> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**
+> This component is supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version.
+
+You can display a time picker in a dialog box to allow users to select a time from the given range, which is from 00:00 to 23:59 by default.
+
+## Required Permissions
+
+None
+
+## TimePickerDialog.show
+
+show(options?: TimePickerDialogOptions)
+
+Defines and displays a time picker dialog box.
+
+- options parameters
+  | Name| Type| Mandatory| Default Value| Description|
+  | -------- | -------- | -------- | -------- | -------- |
+  | selected | Date | No| Current system time| Time of the selected item.|
+  | useMilitaryTime | boolean | No| false | Whether to display time in 24-hour format.|
+  | onAccept | (value: [TimePickerResult](ts-basic-components-timepicker.md#TimePickerResult)) => void | No| - | Triggered when the OK button in the dialog box is clicked.|
+  | onCancel | () => void | No| - | Triggered when the Cancel button in the dialog box is clicked.|
+  | onChange | (value: [TimePickerResult](ts-basic-components-timepicker.md#TimePickerResult)) => void | No| - | Triggered when the selected item in the picker changes.|
+
+## Example
+
+### Time Picker Sample Code (24-Hour Clock)
+```
+@Entry
+@Component
+struct TimePickerDialogExample01 {
+  @State isUseMilitaryTime: boolean = true
+
+  build() {
+    Flex({direction: FlexDirection.Column, alignItems: ItemAlign.Center,
+      justifyContent: FlexAlign.Center }) {
+      Button("TimePickerDialog").onClick(() => {
+        TimePickerDialog.show({
+          useMilitaryTime: this.isUseMilitaryTime,
+          onAccept: (value: TimePickerResult) => {
+            this.selectedDate.setHours(value.hour, value.minute, value.second)
+            console.info("TimePickerDialog:onAccept()" + JSON.stringify(value))
+          },
+          onCancel: () => {
+            console.info("TimePickerDialog:onCancel()")
+          },
+          onChange: (value: TimePickerResult) => {
+            console.info("TimePickerDialog:onChange()" + JSON.stringify(value))
+          }
+        })
+      })
+    }
+  }
+}
+```
+### Time Picker Sample Code (12-Hour Clock)
+```
+@Entry
+@Component
+struct TimePickerDialogExample02 {
+  @State isUseMilitaryTime: boolean = false
+
+  build() {
+    Flex({direction: FlexDirection.Column, alignItems: ItemAlign.Center,
+      justifyContent: FlexAlign.Center }) {
+      Button("TimePickerDialog").onClick(() => {
+        TimePickerDialog.show({
+          useMilitaryTime: this.isUseMilitaryTime,
+          onAccept: (value: TimePickerResult) => {
+            this.selectedDate.setHours(value.hour, value.minute, value.second)
+            console.info("TimePickerDialog:onAccept()" + JSON.stringify(value))
+          },
+          onCancel: () => {
+            console.info("TimePickerDialog:onCancel()")
+          },
+          onChange: (value: TimePickerResult) => {
+            console.info("TimePickerDialog:onChange()" + JSON.stringify(value))
+          }
+        })
+      })
+    }
+  }
+}
+```

en/application-dev/website.md

-# Application Development
+# OpenHarmony Application Development Documentation
 
 - [Application Development Overview](application-dev-guide.md)
 - Quick Start

en/device-dev/subsystems/Readme-EN.md

@@ -74,6 +74,7 @@
   - [Startup](subsys-boot-overview.md)
   - [init Module](subsys-boot-init.md)
   - [appspawn Module](subsys-boot-appspawn.md)
+  - [appspawn Module for the Standard System](subsys-boot-appspawn-standard.md)
   - [bootstrap Module](subsys-boot-bootstrap.md)
   - [syspara Module](subsys-boot-syspara.md)
   - [FAQs](subsys-boot-faqs.md)

zh-cn/application-dev/ability/ability-assistant-guidelines.md

@@ -29,12 +29,12 @@ Ability assistant（Ability助手，简称为aa）是实现应用、原子化服
   用于启动一个ability。
 
   | 参数      | 参数说明                   |
-  | --------- | ---------------------- |
+  | --------- | -------------------------- |
   | -h/--help | 帮助信息。                 |
-  | -d        | 可选参数，device id    |
-  | -a        | 必选参数，ability name |
-  | -b        | 必选参数，bundle name  |
-  | -D        | 可选参数，调试模式     |
+  | -d        | 可选参数，`device id`。    |
+  | -a        | 必选参数，`ability name`。 |
+  | -b        | 必选参数，`bundle name`。  |
+  | -D        | 可选参数，调试模式。       |
 
   **返回值：**
 
@@ -77,11 +77,10 @@ Ability assistant（Ability助手，简称为aa）是实现应用、原子化服
   | -a/--all          | -                    | 打印所有mission内的Ability。                                 |
   | -l/--mission-list | type（缺省打印全部） | 打印任务栈信息。<br />type：<br />NORMAL <br />DEFAULT_STANDARD<br />DEFAULT_SINGLE<br />LAUNCHER |
   | -e/--extension    | elementName          | 打印扩展组件信息。                                           |
-  | -u/--userId       | UserId               | 打印指定UserId的栈信息，需要和其他参数组合使用，例如 aa dump -a -u 100、aa dump -d -u 100、 |
+  | -u/--userId       | UserId               | 打印指定UserId的栈信息，需要和其他参数组合使用，例如 `aa dump -a -u 100`、`aa dump -d -u 100` |
   | -d/--data         |                      | 打印Data Ability。                                           |
   | -i/--ability      | AbilityRecord ID     | 打印指定Ability详细信息                                      |
-  | -c/--client       |                      | 打印Ability详细信息，需要和其他参数组合使用，例如 aa dump -a -c、aa dump -i 21 -c、 |
-  
+  | -c/--client       |                      | 打印Ability详细信息，需要和其他参数组合使用，例如 `aa dump -a -c`、`aa dump -i 21 -c` |
   
   **使用方法：**
   

zh-cn/application-dev/ability/ability-brief.md

@@ -2,7 +2,10 @@
 
 ​        Ability是应用所具备能力的抽象，也是应用程序的重要组成部分。Ability是系统调度应用的最小单元，是能够完成一个独立功能的组件，一个应用可以包含一个或多个Ability。 
 
-​        Ability框架模型结构具有两种形态。第一种形态为FA模型，API 8及其更早版本的应用程序只能使用FA模型进行开发， FA模型将Ability分为FA（Feature Ability）和PA（Particle Ability）两种类型，其中FA支持Page Ability，PA支持Service Ability和Data Ability；从API9开始，Ability框架引入了Stage模型作为第二种应用形态，Stage模型将Ability分为PageAbility和ExtensionAbility两大类，其中ExtensionAbility又被扩展为ServiceExtensionAbility、FormExtensionAbility、DataShareExtensionAbility等等一系列ExtensionAbility，以便满足更多的使用场景。
+​        Ability框架模型结构具有两种形态：
+
+- 第一种形态为FA模型。API 8及其更早版本的应用程序只能使用FA模型进行开发。 FA模型将Ability分为FA（Feature Ability）和PA（Particle Ability）两种类型，其中FA支持Page Ability，PA支持Service Ability、Data Ability、以及FormAbility；
+- 第二种形态为Stage模型。从API 9开始，Ability框架引入了Stage模型作为第二种应用形态，Stage模型将Ability分为PageAbility和ExtensionAbility两大类，其中ExtensionAbility又被扩展为ServiceExtensionAbility、FormExtensionAbility、DataShareExtensionAbility等等一系列ExtensionAbility，以便满足更多的使用场景。
 
 ​        Stage模型的设计，主要是为了方便开发者更加方便地开发出分布式环境下的复杂应用。下表给出了两种模型在设计上的差异：
 

zh-cn/application-dev/ability/stage-brief.md

@@ -67,7 +67,7 @@
 
 ### 进程模型
 
-​        OpenHarmony系统中的应用均满足单进程模型。所谓的单进程模型，是指不允许应用配置多进程，应用中所有的进程都是由系统创建和管理的。每个应用至多并存三个进程：
+​        OpenHarmony系统中的应用均满足单进程模型。所谓的单进程模型，是指不允许应用配置多进程，应用中所有的进程都是由系统创建和管理的。每个应用至多并存三类进程：
 
 - 主进程：运行所有的Ability组件、页面和业务逻辑；