!17950 调整语句和样式【不需要翻译】

Merge pull request !17950 from duangavin123/master

zh-cn/third-party-cases/book-flip-animation.md

@@ -17,7 +17,7 @@
 
 ## 实现思路
 
-如图，我们分上下两层、左右两侧建立4个文本组件（下文用A、B、C、D代称），左右两侧分别代表打开书籍的左右两面，上下两层堆叠放置。
+如图，分上下两层、左右两侧建立4个文本组件（下文用A、B、C、D代称），左右两侧分别代表打开书籍的左右两面，上下两层堆叠放置。
 当B沿旋转轴旋转180度覆盖在A上时，就体现为翻页效果。一个翻页动作的完成包括以下几步：
 
 1. B沿旋转轴旋转180度。
@@ -33,10 +33,11 @@
 
 ## 开发步骤
 
-1. 创建文本组件
-    首先，我们看到动效中用到了4个文本组件，我们可以定义一个文本组件，然后对其进行重复调用。创建时我们为其添加[rotate](../application-dev/reference/arkui-ts/ts-universal-attributes-transformation.md)属性，用来控制组件的旋转。
-    由于各组件旋转的角度和旋转中心不同，需要父组件在调用时传入对应的参数，所以我们为对应变量添加[@Prop](../application-dev/quick-start/arkts-prop.md)装饰器，用来控制变量传递。具体代码如下：
-    ```
+1. 创建文本组件。
+
+    动效中用到了4个文本组件，因此可以先定义一个文本组件，然后对其进行重复调用。同时为文本组件添加[rotate](../application-dev/reference/arkui-ts/ts-universal-attributes-transformation.md)属性，用来控制组件的旋转。
+    由于各组件旋转的角度和旋转中心不同，需要父组件在调用时传入对应的参数，所以需要为对应变量添加[@Prop](../application-dev/quick-start/arkts-prop.md)装饰器，用来控制变量传递。具体代码如下：
+    ```ts
     @Component
     struct BookCard{
       // 为变量添加@Prop装饰器，用于接收父组件的动态传参
@@ -67,9 +68,10 @@
       }
     }
     ```
-2. 创建父组件框架
-    由于文本组件分为上下两层，所以我们在父组件中采用[Stack](../application-dev/reference/arkui-ts/ts-container-stack.md)组件进行层叠布局。同时使用[Divider](../application-dev/reference/arkui-ts/ts-basic-components-divider.md)组件作为书籍两个页面间的分隔线。具体代码如下：
-    ```
+2. 创建父组件框架。
+
+    由于文本组件分为上下两层，所以在父组件中采用[Stack](../application-dev/reference/arkui-ts/ts-container-stack.md)组件进行层叠布局。同时使用[Divider](../application-dev/reference/arkui-ts/ts-basic-components-divider.md)组件作为书籍两个页面间的分隔线。具体代码如下：
+    ```ts
     @Entry
     @Component
     struct BookAnimation {
@@ -102,14 +104,14 @@
     }
     ```
 
-3. 添加翻页动效
+3. 添加翻页动效。
 
-    最后我们通过以下几点来为静态的组件添加动效：
+    最后通过以下几点来为静态的组件添加动效：
     - 根据**实现思路**章节的分析，在父组件中定义对应的变量，并在调用子组件时分别传入子组件。
     - 自定义book_animate函数，在其中使用animateTo方法添加动画效果，同时控制动画的时长，以及动画过程中各元素状态的改变。
     - 在[aboutToAppear](../application-dev/reference/arkui-ts/ts-custom-component-lifecycle.md#abouttoappear)方法中，使用[setInterval](../application-dev/reference/apis/js-apis-timer.md)方法重复调用book_animate函数，以实现连续翻页动效。
     具体代码如下：
-    ```
+    ```ts
     @Entry
     @Component
     struct BookAnimation {
@@ -177,11 +179,11 @@
       }
     }
     ```
-    通过以上步骤我们就可以实现翻页动效了。
+    通过以上步骤就可以实现翻页动效了。
 
 ## 完整代码
 示例完整代码如下：
-```
+```ts
 @Component
 struct BookCard{
   @Prop num:number

zh-cn/third-party-cases/different-operations-for-one-component.md

 # 如何为同一组件在不同场景下绑定不同的业务逻辑
 
 ## 场景介绍
-我们在应用开发过程中经常遇到这样的场景：在不同的地方需要呈现同样的UI效果，为了简化处理，我们往往会把对应的UI元素封装成自定义组件，然后在用到的地方进行调用。但是，通常情况下，UI展示往往伴随着动态交互，而且在不同场景下需要做不同的交互处理。
+在应用开发过程中经常遇到这样的场景：在不同的地方需要呈现同样的UI效果，为了简化处理，往往会把对应的UI元素封装成自定义组件，然后在用到的地方进行调用。但是，通常情况下，UI展示往往伴随着动态交互，而且在不同场景下需要做不同的交互处理。
+
 *比如：A、B两个页面都有返回按钮，但是在A页面中点击返回按钮是返回上一页，在B页面点击返回按钮是直接退出当前应用。同样是点击返回按钮，但是业务处理逻辑是不同的。*
 那么在不同场景下调用同一组件的时候如何实现不同的交互逻辑呢？这就引出了本文要讲的内容。
 
 ## 实现思路
-要使同一组件实现不同效果，我们很容易就想到通过变量传参进行控制，而不是直接在程序中采用固定值，这样我们就可以根据不同场景传入不同参数从而实现不同效果。
-我们通常使用传参的方式改变组件的属性，比如：大小、边框、背景色、字体等等，同样的，我们也可以通过传参的方式改变组件绑定的业务逻辑，只不过，此时我们传入的是方法，然后在对应方法中写入具体的业务逻辑。
+要使同一组件实现不同效果，我们很容易就想到通过变量传参进行控制，而不是直接在程序中采用固定值，这样就可以根据不同场景传入不同参数从而实现不同效果。
+通过传参的方式改变组件的属性，比如：大小、边框、背景色、字体等等，同样的，也可以通过传参的方式改变组件绑定的业务逻辑，只不过此时传入的是含有业务逻辑的方法。
 接下来我们用一个简单的例子讲解如何实现。
 
 ## 开发示例
 
-本示例将在一个页面中两次引用同一个按钮，然后为两次引用加入不同的处理逻辑，第一次引用中，点击按钮跳转到‘’Hello World!’‘页面；第二次引用中，点击按钮跳转到’‘Hello ArkTS!’‘页面。
+本示例将在一个页面中两次引用同一个按钮，然后为两次引用加入不同的处理逻辑，第一次引用中，点击按钮跳转到“Hello World!”页面；第二次引用中，点击按钮跳转到“Hello ArkTS!”页面。
 
 ### 环境要求
 - IDE：DevEco Studio 3.1 Beta1
@@ -20,7 +21,8 @@
 
 ### 开发步骤
 1. 创建按钮组件
-    首先，让我们创建被引用的按钮组件。
+
+    首先，创建被引用的按钮组件。
     这里需要注意的是，由于按钮要绑定不同的处理逻辑，所以我们在点击事件中不要写入固定的处理逻辑，而是传入一个自定义的空方法，该方法的逻辑在父组件中实现，然后传入。具体代码如下：
     ```ts
     @Component
@@ -41,6 +43,7 @@
     ```
 
 2. 在父组件中引用按钮组件
+
     接下来，我们在父组件中引用两次第1步中创建的按钮组件。具体代码如下：
     ```ts
     @Entry
@@ -61,8 +64,9 @@
     ```
 
 3. 在父组件中传入处理逻辑
-    以上两步已经把我们的页面框架搭好了，接下来就是给按钮组件传入处理逻辑了，这也是最重要的一步。
-    我们在第1步中为按钮组件的点击事件绑定了一个空函数，现在我们在父组件中创建一个带有具体处理逻辑的函数，并将其传入按钮组件中。在父组件中可以通过为同一函数传入不同参数来为两个按钮组件绑定不同逻辑，也可以通过不同函数来实现，本例中采用前者进行实现。具体代码如下：
+
+    以上两步已经把页面框架搭好了，接下来给按钮组件传入处理逻辑，这也是最重要的一步。
+    在第1步中为按钮组件的点击事件绑定了一个空函数，现在我们在父组件中创建一个带有具体处理逻辑的函数，并将其传入按钮组件中。在父组件中可以通过为同一函数传入不同参数来为两个按钮组件绑定不同逻辑，也可以通过不同函数来实现，本例中采用前者进行实现。具体代码如下：
     ```ts
     import router from '@ohos.router'
     @Entry
@@ -89,8 +93,8 @@
     }
     ```
 
-    通过以上步骤我们实现了在为同一按钮组件绑定不同的业务处理逻辑，接下来就让我们看下效果吧！
-    注意：文中的‘’Hello World!’‘页面和’‘Hello ArkTS!’‘页面不是本文说明的重点，所以本文中不做开发介绍。
+    通过以上步骤我们实现了在为同一按钮组件绑定不同的业务处理逻辑，接下来看下效果吧！
+    注意：文中的“Hello World!”页面和“Hello ArkTS!”页面不是本文说明的重点，所以本文中不做开发介绍。
 
     ![相同子组件不同业务逻辑](figures/different-operations-one-component.gif)
 

zh-cn/third-party-cases/how-to-group-contacts-with-alphabet.md

-# 如何按字母分组展示联系人（仅UI）
+# 如何按字母分组展示联系人
 
 ## 场景说明
 在通讯录中，需要将联系人按照姓氏的首字母进行分组排列，从而更方便联系人的查找；联系人列表右侧的字母导航可以随列表的滑动而定位到对应字母处；同时，也可以通过字母导航控制列表跳到指定联系人分组。
-本例即为大家介绍如何通过实现上述场景。
+本例即为大家介绍如何实现上述场景。
 
 ## 效果呈现
 本示例最终效果如下：
@@ -23,7 +23,7 @@
 ## 开发步骤
 针对上述关键特性，具体实现步骤如下：
 
-1、先通过Stack、List、ListItemGroup、AlphabetIndexer等关键组件将UI框架搭建起来。
+1、通过Stack、List、ListItemGroup、AlphabetIndexer等关键组件将UI框架搭建起来。
 先构建列表数据，其中Contact为联系人数据类。
 ```ts
 contactGroups: object[] = [
@@ -113,7 +113,7 @@ struct ContactList{
 
 ![contactframe](figures/contactframe.PNG)
 
-2、接下来我们为UI框架添加逻辑控制。首先，通过List的onScrollIndex事件获取到列表滑动位置的索引，并将索引同步给右侧字母表的selected属性，从而在滑动联系人时，使右侧字母导航随之变动，关键代码如下：
+2、接下来为UI框架添加逻辑控制。首先，通过List的onScrollIndex事件获取到列表滑动位置的索引，并将索引同步给右侧字母表的selected属性，从而在滑动联系人时，使右侧字母导航随之变动，关键代码如下：
 ```ts
   ...
   // 创建动态变量，用于指定字母导航的选择项