!7630 翻译完成 7433/7036

Merge pull request !7630 from ester.zhou/C1-0802

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.
 
+> **NOTE**<br>
+>
+> This component is supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version.
+
 
 ## Required Permissions
 
@@ -14,7 +15,7 @@ No
 
 ## Child Components
 
-No
+Not supported
 
 
 ## APIs
@@ -54,11 +55,12 @@ Creates a time picker whose default time range is from 00:00 to 23:59.
 
 ### Time Picker
 
-```
+```ts
+// xxx.ets
 @Entry
 @Component
 struct TimePickerExample {
-  private selectedTime: Date = new Date('08-00')
+  private selectedTime: Date = new Date('7/22/2022 8:00:00')
 
   build() {
     Column() {

en/application-dev/reference/arkui-ts/ts-container-swiper.md

 # Swiper
 
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**
+> **NOTE**<br>
+>
 > This component is supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version.
 
 
-The **&lt;Swiper&gt;** component provides a container that allows users to switch among child components by swiping operations.
+The **<Swiper\>** component provides a container that allows users to switch among child components through swiping.
 
 
 ## Required Permissions
@@ -23,9 +24,9 @@ This component can contain child components.
 Swiper(value:{controller?: SwiperController})
 
 - Parameters
-    | Name | Type | Mandatory | Default Value | Description | 
+  | Name | Type | Mandatory | Default Value | Description |
   | -------- | -------- | -------- | -------- | -------- |
-  | controller | [SwiperController](#swipercontroller) | No | null | Controller bound to the component to control the page switching. | 
+  | controller | [SwiperController](#swipercontroller) | No | null | Controller bound to the component to control the page switching. |
 
 
 ## Attributes
@@ -42,30 +43,32 @@ Swiper(value:{controller?: SwiperController})
 | itemSpace | Length | 0 | Space between child components. |
 | cachedCount<sup>8+</sup> | number | 1 | Number of child components to be cached. |
 | disableSwipe<sup>8+</sup> | boolean | false | Whether to disable the swipe feature. |
-| curve<sup>8+</sup> | [Curve](ts-animatorproperty.md) \| Curves | Curve.Ease | Animation curve. The ease-in/ease-out curve is used by default. For details about common curves, see [Curve enums](ts-animatorproperty.md). You can also create custom curves ([interpolation curve objects](ts-interpolation-calculation.md)) by using the API provided by the interpolation calculation module. |
+| curve<sup>8+</sup> | [Curve](ts-animatorproperty.md) \| Curves | Curve.Ease | Animation curve. The ease-in/ease-out curve is used by default. For details about common curves, see [Curve enums](ts-animatorproperty.md). You can also create custom curves ([interpolation curve objects](ts-interpolation-calculation.md)) by using APIs provided by the interpolation calculation module. |
+| indicatorStyle<sup>8+</sup> | {<br/>left?:&nbsp;Length,<br/>top?:&nbsp;Length,<br/>right?:&nbsp;Length,<br/>bottom?:&nbsp;Length,<br/>size?:&nbsp;Length,<br/>color?:&nbsp;Color,<br/>selectedColor?:&nbsp;Color<br/>} | -          | Style of the navigation dots indicator.<br/>- **left**:&nbsp;distance between the navigation dots indicator and the left edge of the **\<Swiper>** component.<br/>- **top**:&nbsp;distance between the navigation dots indicator and the top edge of the **\<Swiper>** component.<br/>- **right**:&nbsp;distance between the navigation dots indicator and the right edge of the **\<Swiper>** component.<br/>- **bottom**:&nbsp;distance between the navigation dots indicator and the right edge of the **\<Swiper>** component.<br/>- **size**:&nbsp;diameter of the navigation dots indicator.<br/>- **color**:&nbsp;color of the navigation dots indicator.<br/>- **selectedColor**:&nbsp;color of the selected navigation dot. |
 
 
-### SwiperController
+## SwiperController
 
-Controller of the **&lt;Swiper&gt;** component. You can bind this object to the **&lt;Swiper&gt;** component and use it to control page switching.
+Controller of the **<Swiper\>** component. You can bind this object to the **<Swiper\>** component and use it to control page switching.
 
-  | Name | Description | 
+| Name | Description |
 | -------- | -------- |
-| showNext():void | Turns to the next page. | 
-| showPrevious():void | Turns to the previous page. | 
+| showNext():void | Turns to the next page. |
+| showPrevious():void | Turns to the previous page. |
 
 
 ## Events
 
-  | Name | Description | 
+| Name | Description |
 | -------- | -------- |
-| onChange( index: number) =&gt; void | Triggered when the index of the currently displayed component changes. | 
+| onChange( index: number) =&gt; void | Triggered when the index of the currently displayed component changes. |
 
 
 ## Example
 
 
-```
+```ts
+// xxx.ets
 class MyDataSource implements IDataSource {
   private list: number[] = []
   private listener: DataChangeListener
@@ -96,7 +99,7 @@ struct SwiperExample {
   private swiperController: SwiperController = new SwiperController()
   private data: MyDataSource = new MyDataSource([])
 
-  private aboutToAppear(): void {
+  aboutToAppear(): void {
     let list = []
     for (var i = 1; i <= 10; i++) {
       list.push(i.toString());

en/application-dev/reference/arkui-ts/ts-universal-events-key.md

 # Key Event
 
+A key event is triggered when a component interacts with a keyboard, remote control, or any other input device with keys.
 
 > **NOTE**
 >
@@ -15,7 +16,7 @@ None
 
 | Name | Bubbling Supported | Description |
 | -------- | -------- | -------- |
-| onKeyEvent(event: (event?: KeyEvent) => void) | Yes | Called when a key event occurs. For details about the event parameters, see [KeyEvent Object](#KeyEvent Object). |
+| onKeyEvent(event: (event?: KeyEvent) => void) | Yes | Called when the a key event occurs on the bound component in focus. For details about **event**, see [KeyEvent](#keyevent). |
 
 
 ## KeyEvent
@@ -24,7 +25,7 @@ None
   | Name | Type | Description |
   | -------- | -------- | -------- |
   | type | [KeyType](#keytype-enums) | Type of a key. |
-  | keyCode | number | Key code. |
+  | [keyCode](../apis/js-apis-keycode.md) | number | Key code. |
   | keyText | string | Key value. |
   | keySource | [KeySource](#keysource-enums) | Type of the input device that triggers the key event. |
   | deviceId | number | ID of the input device that triggers the key event. |
@@ -36,7 +37,7 @@ None
   | -------- | -------- |
   | stopPropagation(): void | Stops the event from bubbling upwards or downwards. |
 
-##  KeyType Enums
+## KeyType Enums
 
 | Name | Description |
 | -------- | -------- |
@@ -47,20 +48,10 @@ None
 ## KeySource Enums
 | Name | Description |
 | -------- | -------- |
-| Unknown | Unknown input device. |
-| [KeyCode](#common-keycode-enums) | The input device is a keyboard. |
+| Unknown  | Unknown input device. |
+| Keyboard | The input device is a keyboard. |
 
-## Common KeyCode Enums
 
-| Value | Behavior | Physical Button |
-| -------- | -------- | -------- |
-| 19 | Upward | Up button. |
-| 20 | Downward | Down button. |
-| 21 | Leftward | Left button. |
-| 22 | Rightward | Right button. |
-| 23 | OK | **OK** key on a remote control. |
-| 66 | OK | **Enter** key on a keyboard. |
-| 160 | OK | **Enter** button on the numeric keypad. |
 
 
 ## Example

en/application-dev/ui/ts-component-based-component.md

@@ -13,16 +13,17 @@ A struct decorated by @Component has the componentization capability and can ser
 - Data-driven update: The UI of custom components can be automatically updated based on the data of state variables.
 
 
-For details about componentization, see [About @Component](ts-function-build.md).
+For details about componentization, see [About @Component](ts-custom-component-initialization.md).
 
 
-> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**:
-> - The build method must be defined for a custom component.
-> 
+> **NOTE**
+>
+> - The **build** method must be defined for a custom component.
+>
 > - Custom constructors are prohibited for custom components.
 
 
-The following code illustrates how to create a custom component named MyComponent:
+The following code illustrates how to create a custom component named **MyComponent**:
 
 ```
 @Component
@@ -37,10 +38,10 @@ struct MyComponent {
 ```
 
 
-The build method of MyComponent is executed during initial rendering. When the component status changes, the build method will be executed again.
+The **build** method of **MyComponent** is executed during initial rendering. When the component status changes, the build method will be executed again.
 
 
-The following code illustrates how to use MyComponent:
+The following code illustrates how to use **MyComponent**:
 
 ```
 @Component
@@ -55,8 +56,7 @@ struct ParentComponent {
 }
 ```
 
-
-MyComponent can be applied multiple times and reused in different components, as shown in the code below:
+**MyComponent** can be applied multiple times and reused in different components, as shown in the code below:
 
 ```
 @Component
@@ -76,11 +76,11 @@ struct ParentComponent {
         }
     }
 
-    private aboutToAppear() {
+    aboutToAppear() {
         console.log('ParentComponent: Just created, about to become rendered first time.')
     }
 
-    private aboutToDisappear() {
+    aboutToDisappear() {
         console.log('ParentComponent: About to be removed from the UI.')
     }
 }