diff --git a/en/application-dev/ui/ui-js-animate-transform.md b/en/application-dev/ui/ui-js-animate-transform.md index 3b6fe35a82a50468f5321d3d97eb98a55a3c87ff..a9b74278cc196e9150bdcd6d15983efe5bbcac12 100644 --- a/en/application-dev/ui/ui-js-animate-transform.md +++ b/en/application-dev/ui/ui-js-animate-transform.md @@ -586,16 +586,4 @@ You can set multiple transform attributes at the same time to apply different tr > > - When using the shorthand notion, note that the animation effect varies according to the sequence of the style values. > -> - The style values in the transform attribute used when the animation starts and ends must be in one-to-one mapping. Only the styles that have value mappings are played. -## Samples - -The following samples are provided to help you better understand how to develop animations with the **transform** attribute: - -- [`JsAnimation`: Animation App (JavaScript, API 8)](https://gitee.com/openharmony/app_samples/tree/master/UI/JsAnimation) -- [`JsAnimationStyle`: JS Animation and Custom Font Styles (API 8)](https://gitee.com/openharmony/app_samples/tree/master/UI/JsAnimationStyle) - -- [`Clock`: Clock (JavaScript, API 8)](https://gitee.com/openharmony/app_samples/tree/master/common/Clock) - -- [Animation Styles (JavaScaript)](https://gitee.com/openharmony/codelabs/tree/master/JSUI/AnimationDemo) - -- [Common Image Operations](https://gitee.com/openharmony/codelabs/tree/master/Media/ImageJsDemo) \ No newline at end of file +> - The style values in the transform attribute used when the animation starts and ends must be in one-to-one mapping. Only the styles that have value mappings are played. \ No newline at end of file diff --git a/en/application-dev/ui/ui-js-building-ui-component.md b/en/application-dev/ui/ui-js-building-ui-component.md index 752b8c4e4d527c9ffa0357fa9474aa1430bca6d9..6a93952026ecb44f61cc61246a917d915d962866 100644 --- a/en/application-dev/ui/ui-js-building-ui-component.md +++ b/en/application-dev/ui/ui-js-building-ui-component.md @@ -19,18 +19,3 @@ Components can be classified into the following types based on their functions. | Canvas | canvas | | Grid | grid-container, grid-row, grid-col | | SVG | svg, rect, circle, ellipse, path, line, polyline, polygon, text, tspan, textPath, animate, animateMotion, animateTransform | -## Samples - -The following samples are provided to help you better understand how to develop components: - -- [`JsPanel`: Content Display Panel (JavaScript, API 8)](https://gitee.com/openharmony/app_samples/tree/master/UI/JsPanel) -- [`Popup`: JavaScript Bubble (API 8)](https://gitee.com/openharmony/app_samples/tree/master/UI/Popup) -- [`RefreshContainer`: Refresh Container (JavaScript, API 8)](https://gitee.com/openharmony/app_samples/tree/master/UI/RefreshContainer) -- [`JSComponments`: JavaScript Bubble (API 8)](https://gitee.com/openharmony/app_samples/tree/master/UI/JSComponments) -- [`JsUserRegistration`: User Registration (JavaScript, API 8)](https://gitee.com/openharmony/app_samples/tree/master/UI/JsUserRegistration) -- [`ECG`: Heart Rate Detection (JavaScript, API 7)](https://gitee.com/openharmony/app_samples/tree/master/common/ECG) - -- [`Badge`: Badge (JavaScript, API 8)](https://gitee.com/openharmony/app_samples/tree/master/UI/Badge) -- [`JsVideo`: JsVideo (API 8)](https://gitee.com/openharmony/app_samples/tree/master/media/JsVideo) -- [Rating (JavaScript)](https://gitee.com/openharmony/codelabs/tree/master/JSUI/RatingApplication) -- [Simple Video Player](https://gitee.com/openharmony/codelabs/tree/master/Media/VideoOpenHarmony) diff --git a/en/application-dev/ui/ui-js-component-tabs.md b/en/application-dev/ui/ui-js-component-tabs.md index 9583e28c33e486ed92bef6289ed7c43ccad364d1..fe3f9f0cf1463d5b42a7e0840c6112c957d2b53b 100644 --- a/en/application-dev/ui/ui-js-component-tabs.md +++ b/en/application-dev/ui/ui-js-component-tabs.md @@ -319,11 +319,4 @@ export default { } ``` -![en-us_image_tab.gif](figures/en-us_image_tab.gif) - - -## Samples - -The following sample is provided to help you better understand how to develop the **<tabs>** component: - -[`Tabs`: Tabs (JavaScript, API 8)](https://gitee.com/openharmony/app_samples/tree/master/UI/Tabs) \ No newline at end of file +![en-us_image_tab.gif](figures/en-us_image_tab.gif) \ No newline at end of file diff --git a/en/application-dev/ui/ui-js-components-canvas.md b/en/application-dev/ui/ui-js-components-canvas.md index f1d935f866c29f06ee98109bbea1adf659003995..979152c48147a871529b8ad3a68b94f49186350b 100644 --- a/en/application-dev/ui/ui-js-components-canvas.md +++ b/en/application-dev/ui/ui-js-components-canvas.md @@ -140,9 +140,3 @@ export default { > ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**
> The **<canvas>** component cannot be created in **onInit** or **onReady**. -## Samples - -The following sample is provided to help you better understand how to develop the **\** component: - -[`JsCanvas`: \ (JavaScript, API 8)](https://gitee.com/openharmony/app_samples/tree/master/UI/JsCanvas) - diff --git a/en/application-dev/ui/ui-js-components-chart.md b/en/application-dev/ui/ui-js-components-chart.md index 9db89430bdc5ce1f214a38aaef75a058b193adcf..3d23a4f275d8701bcd398094ff2cd191526aa47f 100644 --- a/en/application-dev/ui/ui-js-components-chart.md +++ b/en/application-dev/ui/ui-js-components-chart.md @@ -615,9 +615,4 @@ export default { ``` -![en-us_image_0000001232162328](figures/en-us_image_0000001232162328.gif) -## Samples - -The following sample is provided to help you better understand how to develop the **<chart>** component: - -[`Chart`: chart (JavaScript, API 8)](https://gitee.com/openharmony/app_samples/tree/master/UI/chart) \ No newline at end of file +![en-us_image_0000001232162328](figures/en-us_image_0000001232162328.gif) \ No newline at end of file diff --git a/en/application-dev/ui/ui-js-components-dialog.md b/en/application-dev/ui/ui-js-components-dialog.md index c13d5ce75c14622fee913049508c71d67e6902d1..024dcf2ecdc7b175bc42a0d95dd034a964d9e324 100644 --- a/en/application-dev/ui/ui-js-components-dialog.md +++ b/en/application-dev/ui/ui-js-components-dialog.md @@ -328,9 +328,4 @@ export default { ``` -![en-us_image_0000001223127756](figures/en-us_image_0000001223127756.gif) -## Samples - -The following sample is provided to help you better understand how to develop the **<dialog>** component: - -[`JsDialog`: JS Dialog Box (API 8)](https://gitee.com/openharmony/app_samples/tree/master/UI/JsDialog) \ No newline at end of file +![en-us_image_0000001223127756](figures/en-us_image_0000001223127756.gif) \ No newline at end of file diff --git a/en/application-dev/ui/ui-js-components-list.md b/en/application-dev/ui/ui-js-components-list.md index 8981d4f7c0f1f61bd65e50c1f10a5513837a7dd0..ee26a8b65886736e619c65defbd038e121682e12 100644 --- a/en/application-dev/ui/ui-js-components-list.md +++ b/en/application-dev/ui/ui-js-components-list.md @@ -318,9 +318,4 @@ export default { ``` -![en-us_image_0000001267767861](figures/en-us_image_0000001267767861.gif) -## Samples - -The following sample is provided to help you better understand how to develop the **<list>** component: - -[`JsList`: JSList Offerings (API 7)](https://gitee.com/openharmony/app_samples/tree/master/UI/JsList) \ No newline at end of file +![en-us_image_0000001267767861](figures/en-us_image_0000001267767861.gif) \ No newline at end of file diff --git a/en/application-dev/ui/ui-js-components-stepper.md b/en/application-dev/ui/ui-js-components-stepper.md index caccc7f25503e11f2ac4a4da450524d7b89f052d..4ab5951f921892c6576bce38a8c9f64525967631 100644 --- a/en/application-dev/ui/ui-js-components-stepper.md +++ b/en/application-dev/ui/ui-js-components-stepper.md @@ -411,9 +411,4 @@ export default { } ``` -![en-us_image_0000001267887817](figures/en-us_image_0000001267887817.gif) -## Samples - -The following sample is provided to help you better understand how to develop the **<stepper>** component: - -[`StepNavigator`: StepNavigator (JavaScript, API 7)](https://gitee.com/openharmony/app_samples/tree/master/UI/StepNavigator) \ No newline at end of file +![en-us_image_0000001267887817](figures/en-us_image_0000001267887817.gif) \ No newline at end of file diff --git a/en/application-dev/ui/ui-js-components-swiper.md b/en/application-dev/ui/ui-js-components-swiper.md index d240e96baa6d8d1765d9af5a506855838f483547..7a5514ed2c330c0be3882718247fc92ddf1a6c24 100644 --- a/en/application-dev/ui/ui-js-components-swiper.md +++ b/en/application-dev/ui/ui-js-components-swiper.md @@ -368,9 +368,4 @@ export default { } ``` -![en-us_image_0000001231843132](figures/en-us_image_0000001231843132.gif) -## Samples - -The following sample is provided to help you better understand how to develop the **<swiper>** component: - -- [`Swiper`: Swiper (JavaScript, API 7)](https://gitee.com/openharmony/app_samples/tree/master/UI/Swiper) +![en-us_image_0000001231843132](figures/en-us_image_0000001231843132.gif) \ No newline at end of file diff --git a/en/application-dev/ui/ui-js-components-text.md b/en/application-dev/ui/ui-js-components-text.md index f058773e25d50b45a0adb6a3fc1860ea1d3e480b..76a777c7ddb20c58120f25bcc6d8a4277c557142 100644 --- a/en/application-dev/ui/ui-js-components-text.md +++ b/en/application-dev/ui/ui-js-components-text.md @@ -286,9 +286,4 @@ export default { } ``` -![en-us_image_0000001267887849](figures/en-us_image_0000001267887849.gif) -## Samples - -The following sample is provided to help you better understand how to develop the **<text>** component: - -- [`JsTextComponents`: JavaScript Basic Components (API 8)](https://gitee.com/openharmony/app_samples/tree/master/UI/JsBasicComponents) +![en-us_image_0000001267887849](figures/en-us_image_0000001267887849.gif) \ No newline at end of file diff --git a/zh-cn/application-dev/quick-start/basic-resource-file-categories.md b/zh-cn/application-dev/quick-start/basic-resource-file-categories.md index e15c49af5f6d2636c212ec794b8063d5439eed98..7437de6729fa415b94876fee3d9fa50dcd2b1a65 100644 --- a/zh-cn/application-dev/quick-start/basic-resource-file-categories.md +++ b/zh-cn/application-dev/quick-start/basic-resource-file-categories.md @@ -75,7 +75,4 @@ base目录与限定词目录下面可以创建资源组目录（包括element、 | --------- | ---------------------------------------- | ---------------------------------------- | | element | 表示元素资源，以下每一类数据都采用相应的JSON文件来表征。
- boolean，布尔型
- color，颜色
- float，浮点型
- intarray，整型数组
- integer，整型
- pattern，样式
- plural，复数形式
- strarray，字符串数组
- string，字符串 | element目录中的文件名称建议与下面的文件名保持一致。每个文件中只能包含同一类型的数据。
- boolean.json
- color.json
- float.json
- intarray.json
- integer.json
- pattern.json
- plural.json
- strarray.json
- string.json | | media | 表示媒体资源，包括图片、音频、视频等非文本格式的文件。 | 文件名可自定义，例如：icon.png。 | -| animation | 表示动画资源，采用XML文件格式。 | 文件名可自定义，例如：zoom_in.xml。 | -| layout | 表示布局资源，采用XML文件格式。 | 文件名可自定义，例如：home_layout.xml。 | -| graphic | 表示可绘制资源，采用XML文件格式。 | 文件名可自定义，例如：notifications_dark.xml。 | | profile | 表示其他类型文件，以原始文件形式保存。 | 文件名可自定义。 | diff --git a/zh-cn/application-dev/ui/js-framework-syntax-css.md b/zh-cn/application-dev/ui/js-framework-syntax-css.md index a9937650333f75338257615a82d5c6cb840b8b47..73d8b70981cf92b74fde766fa071cfdad635cafb 100644 --- a/zh-cn/application-dev/ui/js-framework-syntax-css.md +++ b/zh-cn/application-dev/ui/js-framework-syntax-css.md @@ -1,6 +1,6 @@ # CSS语法参考 -CSS是描述HML页面结构的样式语言。所有组件均存在系统默认样式，也可在页面CSS样式文件中对组件、页面自定义不同的样式。 +CSS是描述HML页面结构的样式语言。所有组件均存在系统默认样式，也可在页面CSS样式文件中对组件、页面自定义不同的样式。请参考[通用样式](../reference/arkui-js/js-components-common-styles.md)了解基于JS扩展的类Web开发范式支持的组件样式。 ## 尺寸单位 diff --git a/zh-cn/application-dev/ui/ts-component-based-component.md b/zh-cn/application-dev/ui/ts-component-based-component.md index 91bfe2437ac4add3ad12fe8f042cd0800fae36d3..b5857a0e8610f9ee358e79ca828d00e6d1325136 100644 --- a/zh-cn/application-dev/ui/ts-component-based-component.md +++ b/zh-cn/application-dev/ui/ts-component-based-component.md @@ -12,7 +12,7 @@ - 数据驱动更新：由状态变量的数据驱动，实现UI自动更新。 -对组件化的深入描述，请参考深入理解组件化。 +对组件化的深入描述，请参考[深入理解组件化](ts-custom-component-initialization.md)。 > **说明：** diff --git a/zh-cn/application-dev/ui/ts-component-based-styles.md b/zh-cn/application-dev/ui/ts-component-based-styles.md index c655aaa5e925637bfc945f992e7fa1867d200c3a..03a0ab8c6b61890e9456cd5123b130d156046723 100644 --- a/zh-cn/application-dev/ui/ts-component-based-styles.md +++ b/zh-cn/application-dev/ui/ts-component-based-styles.md @@ -4,7 +4,7 @@ @Styles装饰器将新的属性函数添加到基本组件上，如Text、Column、Button等。当前@Styles仅支持通用属性。通过@Styles装饰器可以快速定义并复用组件的自定义样式。 -@Styles可以定义在组件内或组件外，在组件外定义时需带上function关键字，组件内定义时不需要。 +@Styles可以定义在组件内或组件外，在组件外定义时需在方法前添加function关键字，组件内定义时不需要添加function关键字。 ``` diff --git a/zh-cn/application-dev/ui/ui-ts-creating-simple-page.md b/zh-cn/application-dev/ui/ui-ts-creating-simple-page.md index b5ee557e6d2eb9a8d08b4b810a344a30aef11ae2..c82d9a23ccdde3e1b7029b954aa4783394c16e0c 100644 --- a/zh-cn/application-dev/ui/ui-ts-creating-simple-page.md +++ b/zh-cn/application-dev/ui/ui-ts-creating-simple-page.md @@ -440,9 +440,6 @@ .fontWeight(FontWeight.Bold) .layoutWeight(1) Flex({ alignItems: ItemAlign.Center }) { - Circle({width: 6, height: 6}) - .margin({right: 12}) - .fill(colorValue) Text(name) .fontSize(17.4) .flexGrow(1)