Skip to content

D
Docs

OpenHarmony / Docs
大约 2 年 前同步成功

通知 161
Star 293
Fork 28
D
Docs
提交 8aeebccc 编写于 作者: H HelloCrease
浏览文件
操作

geshi 

Signed-off-by: NHelloCrease <lian15@huawei.com>
上级 cdb6cf82
展开全部 显示空白变更内容
内联 并排
Showing with 1292 addition and 1054 deletion
zh-cn/application-dev/reference/arkui-ts/ts-animatorproperty.md
浏览文件 @ 8aeebccc
......@@ -8,7 +8,7 @@
| 名称 | 参数类型 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- |
| ---------- | ---------------------------------------- | --------------- | ----------------------- |
| duration | number | 1000 | 单位为毫秒，默认动画时长为1000毫秒。 |
| curve | Curve | Curve.Linear | 默认曲线为线性。 |
| delay | number | 0 | 单位为毫秒，默认不延时播放。 |
......@@ -18,7 +18,7 @@
- Curve枚举说明
| 名称 | 描述 |
| -------- | -------- |
| ------------------- | ---------------------------------------- |
| Linear | 表示动画从头到尾的速度都是相同的。 |
| Ease | 表示动画以低速开始，然后加快，在结束前变慢，CubicBezier(0.25,&nbsp;0.1,&nbsp;0.25,&nbsp;1.0)。 |
| EaseIn | 表示动画以低速开始，CubicBezier(0.42,&nbsp;0.0,&nbsp;1.0,&nbsp;1.0)。 |
......@@ -36,7 +36,8 @@
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct AttrAnimationExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-blank.md
浏览文件 @ 8aeebccc
......@@ -39,7 +39,8 @@ Blank(min?: Length)
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct BlankExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-button.md
浏览文件 @ 8aeebccc
......@@ -64,7 +64,8 @@
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct ButtonExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-checkbox.md
浏览文件 @ 8aeebccc
......@@ -41,7 +41,8 @@ Checkbox( name?: string, group?: string )
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct CheckboxExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-checkboxgroup.md
浏览文件 @ 8aeebccc
......@@ -48,7 +48,8 @@ CheckboxGroup( group?: string )
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct CheckboxExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-datapanel.md
浏览文件 @ 8aeebccc
......@@ -34,7 +34,8 @@ DataPanel(value:{values: number[], max?: number, type?: DataPanelType})
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct DataPanelExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-datepicker.md
浏览文件 @ 8aeebccc
......@@ -57,7 +57,8 @@ DatePicker(options?: DatePickerOptions)
### 日期选择器（显示农历）
```
```ts
// xxx.ets
@Entry
@Component
struct DatePickerExample01 {
......@@ -84,7 +85,8 @@ struct DatePickerExample01 {
### 日期选择器（不显示农历）
```
```ts
// xxx.ets
@Entry
@Component
struct DatePickerExample02 {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-divider.md
浏览文件 @ 8aeebccc
......@@ -39,7 +39,8 @@ Divider()
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct DividerExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-gauge.md
浏览文件 @ 8aeebccc
......@@ -44,7 +44,8 @@ Gauge(value:{value: number, min?: number, max?: number})
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct GaugeExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-imageanimator.md
浏览文件 @ 8aeebccc
......@@ -63,7 +63,8 @@ ImageAnimator()
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct ImageAnimatorExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-loadingprogress.md
浏览文件 @ 8aeebccc
......@@ -34,7 +34,8 @@ LoadingProgress()
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct LoadingProgressExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-marquee.md
浏览文件 @ 8aeebccc
......@@ -44,7 +44,8 @@ Marquee(value: { start: boolean, step?: number, loop?: number, fromStart?: boole
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct MarqueeExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-navigation.md
浏览文件 @ 8aeebccc
......@@ -27,7 +27,7 @@ Navigation()
## 属性
| 名称 | 参数类型 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- |
| -------------- | ---------------------------------------- | ------------------------ | ---------------------------------------- |
| title | string&nbsp;\|&nbsp;[CustomBuilder](../../ui/ts-types.md) | - | 页面标题。 |
| subtitle | string | - | 页面副标题。 |
| menus | Array<NavigationMenuItem&gt;&nbsp;\|&nbsp;[CustomBuilder](../../ui/ts-types.md) | - | 页面右上角菜单。 |
......@@ -39,21 +39,21 @@ Navigation()
- NavigationMenuItem类型接口说明
| 名称 | 类型 | 必填 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- | -------- |
| ------ | ----------------------- | ---- | ---- | --------------- |
| value | string | 是 | - | 菜单栏单个选项的显示文本。 |
| icon | string | 否 | - | 菜单栏单个选项的图标资源路径。 |
| action | ()&nbsp;=&gt;&nbsp;void | 否 | - | 当前选项被选中的事件回调。 |
- Object类型接口说明
| 名称 | 类型 | 必填 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- | -------- |
| ------ | ----------------------- | ---- | ---- | --------------- |
| value | string | 是 | - | 工具栏单个选项的显示文本。 |
| icon | string | 否 | - | 工具栏单个选项的图标资源路径。 |
| action | ()&nbsp;=&gt;&nbsp;void | 否 | - | 当前选项被选中的事件回调。 |
- NavigationTitleMode枚举说明
| 名称 | 描述 |
| -------- | -------- |
| ---- | ---------------------------------------- |
| Free | 当内容为可滚动组件时，标题随着内容向上滚动而缩小（子标题的大小不变、淡出）。向下滚动内容到顶时则恢复原样。 |
| Mini | 固定为小标题模式（图标+主副标题）。 |
| Full | 固定为大标题模式（主副标题）。 |
......@@ -65,14 +65,14 @@ Navigation()
## 事件
| 名称 | 功能描述 |
| -------- | -------- |
| ---------------------------------------- | ---------------------------------------- |
| onTitleModeChange(callback:&nbsp;(titleMode:&nbsp;NavigationTitleMode)&nbsp;=&gt;&nbsp;void) | 当titleMode为NavigationTitleMode.Free时，随着可滚动组件的滑动标题栏模式发生变化时触发此回调。 |
## 示例
```
// Example 01
```ts
// xxx.ets
@Entry
@Component
struct NavigationExample {
......@@ -159,8 +159,8 @@ struct NavigationExample {
![zh-cn_image_0000001237616085](figures/zh-cn_image_0000001237616085.gif)
```
// Example 02
```ts
// xxx.ets
@Entry
@Component
struct ToolbarBuilderExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-patternlock.md
浏览文件 @ 8aeebccc
......@@ -19,7 +19,7 @@ PatternLock(controller?: PatternLockController)
- 参数
| 参数名 | 参数类型 | 必填 | 默认值 | 描述 |
| ---------- | ----------------------------------------------- | ---- | ------ | -------------------------------------------- |
| ---------- | ---------------------------------------- | ---- | ---- | ---------------------- |
| controller | [PatternLockController](#patternlockcontroller) | 否 | null | 给组件绑定一个控制器，用来控制组件状态重置。 |
## 属性
......@@ -27,7 +27,7 @@ PatternLock(controller?: PatternLockController)
不支持`backgroundColor`以外的通用属性设置。
| 名称 | 参数类型 | 默认值 | 描述 |
| --------------- | --------------------------------------------------- | ----------- | ------------------------------------------------------------ |
| --------------- | ------------------------------------- | ----------- | ---------------------------------------- |
| sideLength | Length | 300vp | 设置组件的宽度和高度（相同值）。最小可以设置为0。 |
| circleRadius | Length | 14vp | 设置宫格圆点的半径。 |
| regularColor | [ResourceColor](../../ui/ts-types.md) | Color.Black | 设置宫格圆点在“未选中”状态的填充颜色。 |
......@@ -40,7 +40,7 @@ PatternLock(controller?: PatternLockController)
## 事件
| 名称 | 描述 |
| ------------------------------------------------------------ | ------------------------------------------------------------ |
| ---------------------------------------- | ---------------------------------------- |
| onPatternComplete(callback: (input: Array\<number\>) => void) | 密码输入结束时被调用的回调函数。<br />input: 与选中宫格圆点顺序一致的数字数组，数字为选中宫格的索引（0到8）。 |
## PatternLockController
......@@ -61,7 +61,8 @@ reset(): void
## 示例
```typescript
```ts
// xxx.ets
@Entry
@Component
struct PatternLockExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-plugincomponent.md
浏览文件 @ 8aeebccc
......@@ -28,20 +28,20 @@ PluginComponent(value: { template: PluginComponentTemplate, data: any })
- 参数
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| -------- | -------- | -------- | -------- | -------- |
| ----- | ---------------------------------------- | ---- | ---- | ---------------------------------------- |
| value | {<br/>template:&nbsp;PluginComponentTemplate,<br/>data:&nbsp;KVObject<br/>} | 是 | - | template:&nbsp;&nbsp;组件模板，用于跟提供者定义的组件绑定。<br/>data:&nbsp;传给插件组件提供者使用的数据。 |
- PluginComponentTemplate类型说明
| 参数 | 类型 | 描述 |
| -------- | -------- | -------- |
| ------- | ------ | ----------------------- |
| source | string | 组件模板名。 |
| ability | string | 提供者Ability的abilityname。 |
## 事件
| 名称 | 功能描述 |
| -------- | -------- |
| 名称 | 功能描述 |
| ---------------------------------------- | ---------------------------------------- |
| onComplete(callback:&nbsp;()&nbsp;=&gt;&nbsp;void) | 组件加载完成回调。 |
| onError(callback:&nbsp;(info:&nbsp;{&nbsp;errcode:&nbsp;number,&nbsp;msg:&nbsp;string&nbsp;})&nbsp;=&gt;&nbsp;void) | 组件加载错误回调。<br/>errcode:&nbsp;错误码。<br/>msg:&nbsp;错误信息。 |
......@@ -68,13 +68,13 @@ push(param: PushParameters, callback: AsyncCallback&lt;void&gt;): void
- 参数
| 参数名 | 类型 | 必填 | 说明 |
| -------- | -------- | -------- | -------- |
| -------- | ------------------------- | ---- | -------------------------------- |
| param | PushParameters | 是 | 组件使用者的详细信息，详见PushParameters参数说明。 |
| callback | AsyncCallback&lt;void&gt; | 是 | 此次接口调用的异步回调。 |
- PushParameters参数说明
| 参数名 | 类型 | 必填 | 说明 |
| -------- | -------- | -------- | -------- |
| --------- | -------- | ---- | --------------- |
| want | Want | 是 | 组件使用者Ability信息。 |
| name | string | 是 | 组件名称。 |
| data | KVObject | 否 | 组件数据值。 |
......@@ -92,27 +92,27 @@ request(param: RequestParameters, callback: AsyncCallback&lt;RequestCallbackPara
- 参数
| 参数名 | 类型 | 必填 | 说明 |
| -------- | -------- | -------- | -------- |
| -------- | ---------------------------------------- | ---- | ------------------------------------ |
| param | RequestParameters | 是 | 组件模板的详细请求信息，详见RequestParameters参数说明。 |
| callback | AsyncCallback<RequestCallbackParameters&nbsp;\|&nbsp;void&gt; | 是 | 此次请求的异步回调，&nbsp;通过回调接口的参数返回接受请求的数据。 |
- RequestParameters参数说明
| 参数名 | 类型 | 必填 | 说明 |
| -------- | -------- | -------- | -------- |
| ---- | -------- | ---- | --------------- |
| want | Want | 是 | 组件提供者Ability信息。 |
| name | string | 是 | 请求组件名称。 |
| data | KVObject | 是 | 附加数据。 |
- RequestCallbackParameters说明
| 名称 | 类型 | 说明 |
| -------- | -------- | -------- |
| ----------------- | ----------------------- | ----- |
| componentTemplate | PluginComponentTemplate | 组件模板。 |
| data | KVObject | 组件数据。 |
| extraData | KVObject | 附加数据。 |
- KVObject类型说明
| 参数 | 类型 | 说明 |
| -------- | -------- | -------- |
| ---- | ---------------------------------------- | ---------------------------------------- |
| key | number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;boolean&nbsp;\|&nbsp;Array&nbsp;\|&nbsp;KVObject | KVObject用[key，value]来存储数据，key是string类型的，value可以是number，string，boolean，数组或者另外的一个KVObject。 |
......@@ -128,19 +128,19 @@ on(eventType: string, callback: OnPushEventCallback | OnRequestEventCallback): v
- 参数
| 参数名 | 类型 | 必填 | 说明 |
| -------- | -------- | -------- | -------- |
| --------- | ---------------------------------------- | ---- | ---------------------------------------- |
| eventType | string | 是 | 监听的事件类型，&nbsp;可选值为："push"&nbsp;、"request"。<br/>"push”：指组件提供者向使用者主动推送数据。<br/>"request”：指组件使用者向提供者主动请求数据。 |
| callback | OnPushEventCallback&nbsp;\|&nbsp;OnRequestEventCallback | 是 | 见callback事件说明。 |
- callback事件说明
| 参数名 | 类型 | 说明 |
| -------- | -------- | -------- |
| ---------------------- | ---------------------------------------- | ---------------------------------------- |
| OnRequestEventCallback | (source:&nbsp;Want,<br/>name:&nbsp;string,<br/>data:&nbsp;KVObject&nbsp;)&nbsp;=>RequestEventResult | 数据请求事件的回调。<br/>source:&nbsp;组件请求方Ability信息。<br/>name:&nbsp;请求组件名称。<br/>data:&nbsp;附加数据。<br/>返回值：&nbsp;请求数据结果。 |
| OnPushEventCallback | (source:&nbsp;Want,<br/>template:&nbsp;PluginComponentTemplate,<br/>data:&nbsp;KVObject,<br/>extraData:&nbsp;KVObject<br/>)&nbsp;=&gt;&nbsp;void | 接收提供者主动推送的数据。<br/>source:&nbsp;组件提供者Ability信息。<br/>template:&nbsp;组件模板。<br/>data:&nbsp;组件更新数据。<br/>extraData:&nbsp;附加数据。 |
- RequestEventResult类型说明
| 参数 | 类型 | 说明 |
| -------- | -------- | -------- |
| --------- | -------- | ----- |
| template | string | 组件名称。 |
| data | KVObject | 组件数据。 |
| extraData | KVObjec | 附加数据。 |
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-progress.md
浏览文件 @ 8aeebccc
......@@ -52,7 +52,8 @@ Progress(value: {value: number, total?: number, type?: ProgressType})
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct ProgressExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-qrcode.md
浏览文件 @ 8aeebccc
......@@ -41,7 +41,8 @@ QRCode(value: string)
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct QRCodeExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-radio.md
浏览文件 @ 8aeebccc
......@@ -44,7 +44,8 @@ Radio(options: {value: string, group: string})
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct RadioExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-rating.md
浏览文件 @ 8aeebccc
......@@ -46,7 +46,8 @@ Rating(options?: { rating: number, indicator?: boolean })
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct RatingExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-richtext.md
浏览文件 @ 8aeebccc
......@@ -49,7 +49,8 @@ RichText\(content:string\)
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct RichTextExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-scrollbar.md
浏览文件 @ 8aeebccc
......@@ -49,7 +49,8 @@ ScrollBar(value: ScrollBarOptions)
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct ScrollBarExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-search.md
浏览文件 @ 8aeebccc
......@@ -69,7 +69,8 @@ creatPosition(value: number): void
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct SearchExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-select.md
浏览文件 @ 8aeebccc
......@@ -46,7 +46,8 @@ Select(options: Array\<SelectOption\>)
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct SelectExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-slider.md
浏览文件 @ 8aeebccc
......@@ -70,7 +70,8 @@ Slider(value:{value?: number, min?: number, max?: number, step?: number, style?:
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct SliderExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-span.md
浏览文件 @ 8aeebccc
......@@ -47,7 +47,8 @@ Span(content: string)
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct SpanExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-stepper.md
浏览文件 @ 8aeebccc
......@@ -45,7 +45,8 @@ Stepper(value?: { index?: number })
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct StepperExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-text.md
浏览文件 @ 8aeebccc
......@@ -84,7 +84,8 @@ Text(content?: string)
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct TextExample1 {
......@@ -122,7 +123,8 @@ struct TextExample1 {
![zh-cn_image_0000001219864155](figures/zh-cn_image_0000001219864155.gif)
```
```ts
// xxx.ets
@Entry
@Component
struct TextExample2 {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-textarea.md
浏览文件 @ 8aeebccc
......@@ -85,7 +85,8 @@ caretPosition(value: number): void
### 多行文本输入
```
```ts
// xxx.ets
@Entry
@Component
struct TextAreaExample1 {
......@@ -120,7 +121,8 @@ struct TextAreaExample1 {
### 设置光标
```
```ts
// xxx.ets
@Entry
@Component
struct TextAreaExample2 {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-textinput.md
浏览文件 @ 8aeebccc
......@@ -97,7 +97,8 @@ caretPosition(value:&nbsp;number): void
### 单行文本输入
```
```ts
// xxx.ets
@Entry
@Component
struct TextInputExample1 {
......@@ -131,7 +132,8 @@ struct TextInputExample1 {
### 设置光标
```
```ts
// xxx.ets
@Entry
@Component
struct TextInputExample2 {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-textpicker.md
浏览文件 @ 8aeebccc
......@@ -46,7 +46,8 @@ TextPicker(value: {range: string[], selected?: number})
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct TextPickerExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-texttimer.md
浏览文件 @ 8aeebccc
......@@ -74,7 +74,8 @@ reset()
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct TextTimerExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-timepicker.md
浏览文件 @ 8aeebccc
......@@ -54,7 +54,8 @@ TimePicker(options?: TimePickerOptions)
### 时间选择器
```
```ts
// xxx.ets
@Entry
@Component
struct TimePickerExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-toggle.md
浏览文件 @ 8aeebccc
......@@ -50,7 +50,8 @@ Toggle(options: { type: ToggleType, isOn?: boolean })
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct ToggleExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-web.md
浏览文件 @ 8aeebccc
......@@ -32,7 +32,7 @@
## 属性
| 名称 | 参数类型 | 默认值 | 描述 |
| ----------------- | ---------------------------------------- | -------------- | ---------------------------------------- |
| ------------------ | ---------------------------------------- | ----------------- | ---------------------------------------- |
| domStorageAccess | boolean | false | 设置是否开启文档对象模型存储接口（DOM Storage API）权限，默认未开启。 |
| fileAccess | boolean | false | 设置是否开启通过[$rawfile(filepath/filename)](../../ui/ts-application-resource-access.md#资源引用)访问应用中rawfile路径的文件， 默认启用。 |
| fileFromUrlAccess | boolean | true | 设置是否允许通过网页中的JavaScript脚本访问[$rawfile(filepath/filename)](../../ui/ts-application-resource-access.md#资源引用)的内容，默认未启用。 |
......@@ -41,10 +41,10 @@
| javaScriptAccess | boolean | true | 设置是否允许执行JavaScript脚本，默认允许执行。 |
| mixedMode | [MixedMode](#mixedmode枚举说明) | MixedMode.None | 设置是否允许加载超文本传输协议（HTTP）和超文本传输安全协议（HTTPS）混合内容，默认不允许加载HTTP和HTTPS混合内容。 |
| onlineImageAccess | boolean | true | 设置是否允许从网络加载图片资源（通过HTTP和HTTPS访问的资源），默认允许访问。 |
| zoomAccess | boolean | true | 设置是否支持手势进行缩放，默认允许执行缩放。|
| overviewModeAccess | boolean | true | 设置是否使用概览模式加载网页，默认使用该方式。|
| databaseAccess| boolean | false | 设置是否开启数据库存储API权限，默认不开启。|
| cacheMode | [CacheMode](#cachemode枚举说明) | CacheMode.Default| 设置缓存模式。|
| zoomAccess | boolean | true | 设置是否支持手势进行缩放，默认允许执行缩放。 |
| overviewModeAccess | boolean | true | 设置是否使用概览模式加载网页，默认使用该方式。 |
| databaseAccess | boolean | false | 设置是否开启数据库存储API权限，默认不开启。 |
| cacheMode | [CacheMode](#cachemode枚举说明) | CacheMode.Default | 设置缓存模式。 |
| textZoomAtio | number | 100 | 设置页面的文本缩放百分比，默认为100%。 |
| userAgent | string | - | 设置用户代理。 |
......@@ -57,7 +57,7 @@
不支持通用事件。
| 名称 | 功能描述 |
| ------------------------------------------------------------ | ------------------------------------------------------------ |
| ---------------------------------------- | ---------------------------------------- |
| onAlert(callback: (event?: { url: string; message: string; result: [JsResult](#jsresult对象说明) }) => boolean) | <p>网页触发alert()告警弹窗时触发回调。<br />当回调返回false时，触发默认弹窗。当回调返回true时，系统应用可以调用系统弹窗能力（只有确认场景），并且根据用户的确认操作调用JsResult通知Web组件。<br />url：当前显示弹窗所在网页的URL。<br />message：弹窗中显示的信息。<br />JsResult：通知Web组件用户操作行为。</p> |
| onBeforeUnload(callback: (event?: { url: string; message: string; result: [JsResult](#jsresult对象说明) }) => boolean) | <p>刷新或关闭场景下，在即将离开当前页面时触发此回调。<br />当回调返回false时，触发默认弹窗。当回调返回true时，系统应用可以调用系统弹窗能力（包括确认和取消），并且需要根据用户的确认或取消操作调用JsResult通知Web组件最终是否离开当前页面。<br />url：当前显示弹窗所在网页的URL。<br />message：弹窗中显示的信息。<br />JsResult：通知Web组件用户操作行为。</p> |
| onConfirm(callback: (event?: { url: string; message: string; result: [JsResult](#jsresult对象说明) }) => boolean) | <p>网页调用confirm()告警时触发此回调。<br />当回调返回false时，触发默认弹窗。当回调返回true时，系统应用可以调用系统弹窗能力（包括确认和取消），并且需要根据用户的确认或取消操作调用JsResult通知Web组件。<br />url：当前显示弹窗所在网页的URL。<br />message：弹窗中显示的信息。<br />JsResult：通知Web组件用户操作行为。</p> |
......@@ -157,7 +157,7 @@ Web组件返回的请求/响应头对象。
onRenderExited接口返回的渲染进程退出的具体原因。
| 名称 | 描述 |
| ---------------------------- | ------------------------------ |
| -------------------------- | ----------------- |
| ProcessAbnormalTermination | 渲染进程异常退出。 |
| ProcessWasKilled | 收到SIGKILL，或被手动终止。 |
| ProcessCrashed | 渲染进程崩溃退出，如段错误。 |
......@@ -166,19 +166,19 @@ onRenderExited接口返回的渲染进程退出的具体原因。
### MixedMode枚举说明
| 名称 | 描述 |
| ---------- | ---------------------------------- |
| All | 允许加载HTTP和HTTPS混合内容。所有不安全的内容都可以被加载。 |
| Compatible | 混合内容兼容性模式，部分不安全的内容可能被加载。 |
| None | 不允许加载HTTP和HTTPS混合内容。 |
| 名称 | 描述 |
| ---------- | ---------------------------------- |
| All | 允许加载HTTP和HTTPS混合内容。所有不安全的内容都可以被加载。 |
| Compatible | 混合内容兼容性模式，部分不安全的内容可能被加载。 |
| None | 不允许加载HTTP和HTTPS混合内容。 |
### CacheMode枚举说明
| 名称 | 描述 |
| ---------- | ---------------------------------- |
| Default | 使用未过期的cache加载资源，如果cache中无该资源则从网络中获取。 |
| None | 加载资源使用cache，如果cache中无该资源则从网络中获取。 |
| Online | 加载资源不使用cache，全部从网络中获取。 |
| Only | 只从cache中加载资源。 |
| 名称 | 描述 |
| ------- | ------------------------------------ |
| Default | 使用未过期的cache加载资源，如果cache中无该资源则从网络中获取。 |
| None | 加载资源使用cache，如果cache中无该资源则从网络中获取。 |
| Online | 加载资源不使用cache，全部从网络中获取。 |
| Only | 只从cache中加载资源。 |
### FileSelectorResult对象说明
通知Web组件的文件选择结果。
......@@ -186,14 +186,14 @@ onRenderExited接口返回的渲染进程退出的具体原因。
- 接口
| 接口名称 | 功能描述 |
| ---------------------------------------------- | ------------------------------------------------------------ |
| ---------------------------------------- | -------------------------------------- |
| handleFileList(fileList: Array\<string>): void | 通知Web组件进行文件选择操作。fileList: 需要进行操作的文件列表。 |
### FileSelectorParam对象说明
- 接口
| 接口名称 | 功能描述 |
| ---------------------------------------- | ------------------ |
| -------------------------------- | ------------ |
| getTitle(): string | 获取文件选择器标题。 |
| getMode(): FileSelectorMode | 获取文件选择器的模式。 |
| getAcceptType(): Array\<string\> | 获取文件过滤类型。 |
......@@ -201,7 +201,7 @@ onRenderExited接口返回的渲染进程退出的具体原因。
### FileSelectorMode枚举说明
| 名称 | 描述 |
| ---------------------------- | ------------------------------ |
| -------------------- | ---------- |
| FileOpenMode | 打开上传单个文件。 |
| FileOpenMultipleMode | 打开上传多个文件。 |
| FileOpenFolderMode | 打开上传文件夹模式。 |
......@@ -390,7 +390,7 @@ getCookieManager(): WebCookie
获取web组件cookie管理对象。
- 返回值
| 参数类型 | 说明 |
| ------- | --------- |
| --------- | ---------------------------------------- |
| WebCookie | web组件cookie管理对象，参考[WebCookie](#webcookie)定义。 |
## WebCookie
通过WebCookie可以控制Web组件中的cookie的各种行为，其中每个应用中的所有web组件共享一个WebCookie。通过controller方法中的getCookieManager方法可以获取WebCookie对象，进行后续的cookie管理操作。
......@@ -402,12 +402,12 @@ setCookie(url: string, value: string): boolean
- 参数说明
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| -------- | ------------------------ | ---- | ---- | ---------------------------------------- |
| ----- | ------ | ---- | ---- | ----------------- |
| url | string | 是 | - | 要设置的cookie所属的url。 |
| value | string | 是 | - | cookie的值。 |
- 返回值
| 参数类型 | 说明 |
| ------- | --------- |
| ------- | ------------- |
| boolean | 设置cookie是否成功。 |
### saveCookieSync
......@@ -416,11 +416,11 @@ saveCookieSync(): boolean
将当前存在内存中的cookie同步到磁盘中，该方法为同步方法。
- 返回值
| 参数类型 | 说明 |
| ------- | --------- |
| ------- | -------------------- |
| boolean | 同步内存cookie到磁盘操作是否成功。 |
## 示例
```
```ts
// webComponent.ets
@Entry
@Component
......@@ -442,7 +442,7 @@ struct WebComponent {
}
}
```
```
```html
<!-- index.html -->
<!DOCTYPE html>
<html>
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-xcomponent.md
浏览文件 @ 8aeebccc
......@@ -20,9 +20,9 @@
- 参数
| 名称 | 参数类型 | 必填 | 描述 |
| ----------- | --------------------------------------------- | ---- | ------------------------------------------------------------ |
| ----------- | ---------------------------------------- | ---- | ---------------------------------------- |
| id | string | 是 | 组件的唯一标识，支持最大的字符串长度128。 |
| type | string | 是 | 用于指定XComponent组件类型，可选值为：<br/>-surface：组件内容单独送显，直接合成到屏幕。<br/>-component：组件内容与其他组件合成后统一送显。|
| type | string | 是 | 用于指定XComponent组件类型，可选值为：<br/>-surface：组件内容单独送显，直接合成到屏幕。<br/>-component：组件内容与其他组件合成后统一送显。 |
| libraryname | string | 否 | 应用Native层编译输出动态库名称。 |
| controller | [XComponentController](#XComponentController) | 否 | 给组件绑定一个控制器，通过控制器调用组件方法。 |
......@@ -30,7 +30,7 @@
## 事件
| 名称 | 功能描述 |
| ------------------------------- | ------------------------ |
| -------------------------------- | ------------ |
| onLoad(context?: object) => void | 插件加载完成时回调事件。 |
| onDestroy() => void | 插件卸载完成时回调事件。 |
......@@ -53,7 +53,7 @@ getXComponentSurfaceId(): string
- 返回值
| 类型 | 描述 |
| ------ | --------------------------- |
| ------ | ----------------------- |
| string | XComponent持有Surface的ID。 |
### setXComponentSurfaceSize
......@@ -65,7 +65,7 @@ setXComponentSurfaceSize(value: {surfaceWidth: number, surfaceHeight: number}):
- 参数
| 参数名 | 参数类型 | 必填 | 默认值 | 描述 |
| ------------- | -------- | ---- | ------ | ----------------------------- |
| ------------- | ------ | ---- | ---- | ----------------------- |
| surfaceWidth | number | 是 | - | XComponent持有Surface的宽度。 |
| surfaceHeight | number | 是 | - | XComponent持有Surface的高度。 |
......@@ -78,14 +78,15 @@ getXComponentContext(): Object
- 返回值
| 类型 | 描述 |
| ------ | ------------------------------------------------------------ |
| ------ | ---------------------------------------- |
| Object | 获取XComponent实例对象的context，context包含的具体接口方法由开发者自定义。 |
## 示例
提供surface类型XComponent，支持相机预览等能力。
```
```ts
// xxx.ets
import camera from '@ohos.multimedia.camera';
@Entry
@Component
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-longpressgesture.md
浏览文件 @ 8aeebccc
......@@ -37,7 +37,8 @@ LongPressGesture(options?: { fingers?: number, repeat?: boolean, duration?: numb
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct LongPressGestureExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-pangesture.md
浏览文件 @ 8aeebccc
......@@ -68,7 +68,8 @@ PanGestureOptions(options?: { fingers?: number, direction?: PanDirection, distan
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct PanGestureExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-pinchgesture.md
浏览文件 @ 8aeebccc
......@@ -39,7 +39,8 @@ PinchGesture(options?: { fingers?: number, distance?: number })
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct PinchGestureExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-rotationgesture.md
浏览文件 @ 8aeebccc
......@@ -37,7 +37,8 @@ RotationGesture(options?: { fingers?: number, angle?: number })
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct RotationGestureExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-swipegesture.md
浏览文件 @ 8aeebccc
......@@ -44,7 +44,8 @@ SwipeGesture(value?: { fingers?: number; direction?: SwipeDirection; speed?: num
![zh-cn_image_0000001231374559](figures/zh-cn_image_0000001231374661.png)
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct SwipeGestureExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-gestures-tapgesture.md
浏览文件 @ 8aeebccc
......@@ -29,7 +29,8 @@ TapGesture(options?: { count?: number, fingers?: number })
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct TapGestureExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-combined-gestures.md
浏览文件 @ 8aeebccc
......@@ -36,7 +36,8 @@ GestureGroup(mode: GestureMode, ...gesture: GestureType[])
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct GestureGroupExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvas.md
浏览文件 @ 8aeebccc
......@@ -36,7 +36,8 @@ Canvas(context: CanvasRenderingContext2D)
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct CanvasExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-canvasgradient.md
浏览文件 @ 8aeebccc
......@@ -20,8 +20,9 @@ addColorStop(offset: number, color: string): void
| color | string | 是 | 'ffffff' | 设置渐变的颜色。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct Page45 {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......
zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-lottie.md
浏览文件 @ 8aeebccc
......@@ -51,7 +51,8 @@ destroy(name: string): void
| name | string | 是 | 被指定的动画名，同loadAnimation接口参数name,&nbsp;缺省时销毁所有动画。 |
- 示例
```
```ts
// xxx.ets
import lottie from '@ohos/lottieETS'
@Entry
......@@ -130,7 +131,7 @@ play(name: string): void
| name | string | 是 | 被指定的动画名,&nbsp;同loadAnimation接口参数name，缺省时播放所有动画。 |
- 示例
```
```ts
lottie.play(this.animateName)
```
......@@ -147,7 +148,7 @@ pause(name: string): void
| name | string | 是 | 被指定的动画名，同loadAnimation接口入参name，缺省时暂停所有动画。 |
- 示例
```
```ts
lottie.pause(this.animateName)
```
......@@ -164,7 +165,7 @@ togglePause(name: string): void
| name | string | 是 | 被指定的动画名，同loadAnimation接口参数name，缺省时停止所有动画。 |
- 示例
```
```ts
lottie.togglePause(this.animateName)
```
......@@ -181,7 +182,7 @@ stop(name: string): void
| name | string | 是 | 被指定的动画名，同loadAnimation接口参数name，缺省时停止所有动画。 |
- 示例
```
```ts
lottie.stop(this.animateName)
```
......@@ -199,7 +200,7 @@ setSpeed(speed: number, name: string): void
| name | string | 是 | 被指定的动画，同loadAnimation接口参数name，缺省时停止所有动画。 |
- 示例
```
```ts
lottie.setSpeed(5, this.animateName)
```
......@@ -217,7 +218,7 @@ setDirection(direction: AnimationDirection, name: string): void
| name | string | 是 | 被指定的动画名，同loadAnimation接口参数name，缺省时设置所有动画方向。 |
- 示例
```
```ts
lottie.setDirection(-1, this.animateName)
```
......@@ -262,7 +263,7 @@ play(name?: string): void
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
- 示例
```
```ts
this.animateItem.play()
```
......@@ -279,7 +280,7 @@ destroy(name?: string): void
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
- 示例
```
```ts
this.animateItem.destroy()
```
......@@ -296,7 +297,7 @@ pause(name?: string): void
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
- 示例
```
```ts
this.animateItem.pause()
```
......@@ -313,7 +314,7 @@ togglePause(name?: string): void
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
- 示例
```
```ts
this.animateItem.togglePause()
```
......@@ -330,7 +331,7 @@ stop(name?: string): void
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
- 示例
```
```ts
this.animateItem.stop()
```
......@@ -347,7 +348,7 @@ setSpeed(speed: number): void
| speed | number | 是 | 值为浮点类型,&nbsp;speed&gt;0正向播放,&nbsp;speed&lt;0反向播放,&nbsp;speed=0暂停播放,&nbsp;speed=1.0&nbsp;\|&nbsp;-1.0正常速度播放。 |
- 示例
```
```ts
this.animateItem.setSpeed(5);
```
......@@ -364,7 +365,7 @@ setDirection(direction: AnimationDirection): void
| direction | AnimationDirection | 是 | 1为正向，-1为反向;&nbsp;当设置为反向时，从当前播放进度开始回播直到首帧，loop值为true时可无限倒放；speed&lt;0叠加时也是倒放。<br/>AnimationDirection：1&nbsp;\|&nbsp;-1。 |
- 示例
```
```ts
this.animateItem.setDirection(-1)
```
......@@ -383,7 +384,7 @@ goToAndStop(value: number, isFrame?: boolean): void
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
- 示例
```
```ts
// 按帧号控制
this.animateItem.goToAndStop(25, true)
// 按时间进度控制
......@@ -405,7 +406,7 @@ goToAndPlay(value: number, isFrame: boolean, name?: string): void
| name | string | 否 | 被指定的动画名，缺省默认为空。 |
- 示例
```
```ts
// 按帧号控制
this.animateItem.goToAndPlay(25, true)
// 按时间进度控制
......@@ -426,7 +427,7 @@ playSegments(segments: AnimationSegment | AnimationSegment[], forceFlag: boolean
| forceFlag | boolean | 是 | true：即时生效播放，false：延迟到下轮循环播放再生效 |
- 示例
```
```ts
// 指定播放片段
this.animateItem.playSegments([10, 20], false)
// 指定播放片段列表
......@@ -446,7 +447,7 @@ resetSegments(forceFlag: boolean): void
| forceFlag | boolean | 是 | true：即时生效播放，false：延迟到下轮循环播放再生效 |
- 示例
```
```ts
this.animateItem.resetSegments(true)
```
......@@ -458,7 +459,7 @@ resize(): void
刷新动画布局。
- 示例
```
```ts
this.animateItem.resize()
```
......@@ -475,7 +476,7 @@ setSubframe(useSubFrame: boolean): void
| useSubFrames | boolean | 是 | currentFrame属性默认显示浮点数，该接口参数将影响currentFrame属性的精度。<br/>true：属性currentFrame显示浮点。<br/>false：属性currentFrame去浮点数显示整数。 |
- 示例
```
```ts
this.animateItem.setSubframe(false)
```
......@@ -492,7 +493,7 @@ getDuration(inFrames?: boolean): void
| inFrames | boolean | 否 | true：获取帧数，&nbsp;false：获取时间(单位ms)，缺省默认false。 |
- 示例
```
```ts
this.animateItem.getDuration(true)
```
......@@ -510,7 +511,7 @@ addEventListener&lt;T = any&gt;(name: AnimationEventName, callback: AnimationEve
| callback | AnimationEventCallback&lt;T&gt; | 是 | 用户自定义回调函数 |
- 示例
```
```ts
private callbackItem: any = function() {
console.log("grunt loopComplete")
}
......@@ -534,7 +535,7 @@ removeEventListener&lt;T = any&gt;(name: AnimationEventName, callback?: Animatio
| callback | AnimationEventCallback&lt;T&gt; | 否 | 用户自定义回调函数；缺省为空时，删除此事件的所有回调函数。 |
- 示例
```
```ts
this.animateItem.removeEventListener('loopComplete', this.animateName)
```
......@@ -552,7 +553,7 @@ triggerEvent&lt;T = any&gt;(name: AnimationEventName, args: T): void
| args | any | 是 | 用户自定义回调参数 |
- 示例
```
```ts
private triggerCallBack: any = function(item) {
console.log("trigger loopComplete, name:" + item.name)
}
......
zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-path2d.md
浏览文件 @ 8aeebccc
......@@ -19,8 +19,9 @@ addPath(path: Object): void
| path | Object | 是 | null | 需要添加到当前路径的路径对象 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct AddPath {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -56,8 +57,9 @@ closePath(): void
将路径的当前点移回到路径的起点，当前点到起点间画一条直线。如果形状已经闭合或只有一个点，则此功能不执行任何操作。
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct ClosePath {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -100,8 +102,9 @@ moveTo(x: number, y: number): void
| y | number | 是 | 0 | 目标点Y轴坐标 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct MoveTo {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -144,8 +147,9 @@ lineTo(x: number, y: number): void
| y | number | 是 | 0 | 目标点Y轴坐标 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct LineTo {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -193,8 +197,9 @@ bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number,
| y | number | 是 | 0 | 路径结束时的y坐标值。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct BezierCurveTo {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -236,8 +241,9 @@ quadraticCurveTo(cpx: number, cpy: number, x: number ,y: number): void
| y | number | 是 | 0 | 路径结束时的y坐标值。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct QuadraticCurveTo {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -282,8 +288,9 @@ arc(x: number, y: number, radius: number, startAngle: number, endAngle: number,
| anticlockwise | boolean | 否 | false | 是否逆时针绘制圆弧。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct Arc {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -325,8 +332,9 @@ arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void
| radius | number | 是 | 0 | 圆弧的圆半径值。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct ArcTo {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -372,8 +380,9 @@ ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number
| anticlockwise | number | 否 | 0 | 是否以逆时针方向绘制椭圆，0为顺时针，1为逆时针。(可选参数，默认为0) |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct CanvasExample {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -415,8 +424,9 @@ rect(x: number, y: number, width: number, height: number): void
| height | number | 是 | 0 | 指定矩形的高度。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct CanvasExample {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......
zh-cn/application-dev/reference/arkui-ts/ts-container-alphabet-indexer.md
浏览文件 @ 8aeebccc
......@@ -63,7 +63,8 @@ AlphabetIndexer(value: {arrayValue : Array&lt;string&gt;, selected : number})
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct AlphabetIndexerSample {
......
zh-cn/application-dev/reference/arkui-ts/ts-container-badge.md
浏览文件 @ 8aeebccc
......@@ -58,7 +58,8 @@ Badge(value: {value: string, position?: BadgePosition, style?: BadgeStyle})
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct BadgeExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-container-column.md
浏览文件 @ 8aeebccc
......@@ -46,7 +46,8 @@ Column(value:{space?: Length})
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct ColumnExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-container-columnsplit.md
浏览文件 @ 8aeebccc
......@@ -34,7 +34,8 @@ ColumnSplit()
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct ColumnSplitExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-container-counter.md
浏览文件 @ 8aeebccc
......@@ -34,7 +34,8 @@ Counter()
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct CounterExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-container-flex.md
浏览文件 @ 8aeebccc
......@@ -25,7 +25,7 @@ Flex(options?: { direction?: FlexDirection, wrap?: FlexWrap, justifyContent?: F
- 参数
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| -------- | -------- | -------- | -------- | -------- |
| -------------- | ---------------------------------------- | ---- | ----------------- | ---------------------------------------- |
| direction | FlexDirection | 否 | FlexDirection.Row | 子组件在Flex容器上排列的方向，即主轴的方向。 |
| wrap | FlexWrap | 否 | FlexWrap.NoWrap | Flex容器是单行/列还是多行/列排列。 |
| justifyContent | FlexAlign | 否 | FlexAlign.Start | 子组件在Flex容器主轴上的对齐格式。 |
......@@ -34,7 +34,7 @@ Flex(options?: { direction?: FlexDirection, wrap?: FlexWrap, justifyContent?: F
- FlexDirection枚举说明
| 名称 | 描述 |
| -------- | -------- |
| ------------- | ---------------- |
| Row | 主轴与行方向一致作为布局模式。 |
| RowReverse | 与Row方向相反方向进行布局。 |
| Column | 主轴与列方向一致作为布局模式。 |
......@@ -42,14 +42,14 @@ Flex(options?: { direction?: FlexDirection, wrap?: FlexWrap, justifyContent?: F
- FlexWrap枚举说明
| 名称 | 描述 |
| -------- | -------- |
| ----------- | --------------------------- |
| NoWrap | Flex容器的元素单行/列布局，子项允许超出容器。 |
| Wrap | Flex容器的元素多行/列排布，子项允许超出容器。 |
| WrapReverse | Flex容器的元素反向多行/列排布，子项允许超出容器。 |
- FlexAlign枚举说明
| 名称 | 描述 |
| -------- | -------- |
| ------------ | ---------------------------------------- |
| Start | 元素在主轴方向首端对齐,&nbsp;第一个元素与行首对齐，同时后续的元素与前一个对齐。 |
| Center | 元素在主轴方向中心对齐，第一个元素与行首的距离与最后一个元素与行尾距离相同。 |
| End | 元素在主轴方向尾部对齐,&nbsp;&nbsp;最后一个元素与行尾对齐，其他元素与后一个对齐。 |
......@@ -60,8 +60,8 @@ Flex(options?: { direction?: FlexDirection, wrap?: FlexWrap, justifyContent?: F
## 示例
```
// Example 01
```ts
// xxx.ets
@Entry
@Component
struct FlexExample1 {
......@@ -123,8 +123,8 @@ struct FlexExample1 {
![zh-cn_image_0000001219744189](figures/zh-cn_image_0000001219744189.gif)
```
// Example 02
```ts
// xxx.ets
@Entry
@Component
struct FlexExample2 {
......@@ -169,8 +169,8 @@ struct FlexExample2 {
![zh-cn_image_0000001174264366](figures/zh-cn_image_0000001174264366.png)
```
// Example 03
```ts
// xxx.ets
@Component
struct JustifyContentFlex {
@Prop justifyContent : number
......@@ -218,8 +218,8 @@ struct FlexExample3 {
![zh-cn_image_0000001174582854](figures/zh-cn_image_0000001174582854.gif)
```
// Example 04
```ts
// xxx.ets
@Component
struct AlignItemsFlex {
@Prop alignItems : number
......@@ -269,8 +269,8 @@ struct FlexExample4 {
![zh-cn_image_0000001219662653](figures/zh-cn_image_0000001219662653.gif)
```
// Example 05
```ts
// xxx.ets
@Component
struct AlignContentFlex {
@Prop alignContent: number
......
zh-cn/application-dev/reference/arkui-ts/ts-container-grid.md
浏览文件 @ 8aeebccc
......@@ -56,7 +56,8 @@ Grid()
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct GridExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-container-gridcontainer.md
浏览文件 @ 8aeebccc
......@@ -51,7 +51,8 @@ GridContainer(options?: { columns?: number | 'auto', sizeType?: SizeType, gutter
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct GridContainerExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-container-griditem.md
浏览文件 @ 8aeebccc
......@@ -43,7 +43,8 @@ GridItem()
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct GridItemExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-container-list.md
浏览文件 @ 8aeebccc
......@@ -72,7 +72,8 @@ List(value:{space?: number, initialIndex?: number})
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct ListExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-container-listitem.md
浏览文件 @ 8aeebccc
......@@ -46,7 +46,8 @@ ListItem()
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct ListItemExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-container-navigator.md
浏览文件 @ 8aeebccc
......@@ -25,13 +25,13 @@ Navigator(value?: {target: string, type?: NavigationType})
- 参数
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| -------- | -------- | -------- | -------- | -------- |
| ------ | -------------- | ---- | ------------------- | ------------ |
| target | string | 是 | - | 指定跳转目标页面的路径。 |
| type | NavigationType | 否 | NavigationType.Push | 指定路由方式。 |
- NavigationType枚举说明
| 名称 | 描述 |
| -------- | -------- |
| ------- | -------------------------- |
| Push | 跳转到应用内的指定页面。 |
| Replace | 用应用内的某个页面替换当前页面，并销毁被替换的页面。 |
| Back | 返回上一页面或指定的页面。 |
......@@ -40,15 +40,15 @@ Navigator(value?: {target: string, type?: NavigationType})
## 属性
| 名称 | 参数 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- |
| ------ | ------- | --------- | ---------------------------------------- |
| active | boolean | - | 当前路由组件是否处于激活状态，处于激活状态时，会生效相应的路由操作。 |
| params | Object | undefined | 跳转时要同时传递到目标页面的数据，可在目标页面使用router.getParams()获得。 |
## 示例
```
// Navigator Page
```ts
// Navigator.ets
@Entry
@Component
struct NavigatorExample {
......@@ -72,8 +72,8 @@ struct NavigatorExample {
}
```
```
// Detail Page
```ts
// Detail.ets
import router from '@system.router'
@Entry
......@@ -95,8 +95,8 @@ struct DetailExample {
```
```
// Back Page
```ts
// Back.ets
@Entry
@Component
struct BackExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-container-panel.md
浏览文件 @ 8aeebccc
......@@ -62,7 +62,8 @@ Panel(value:{show：boolean})
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct PanelExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-container-refresh.md
浏览文件 @ 8aeebccc
......@@ -48,7 +48,8 @@ Refresh\(value: \{refreshing: boolean, offset?: Length, friction?: number\}\)
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct RefreshExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-container-row.md
浏览文件 @ 8aeebccc
......@@ -44,7 +44,8 @@ Row(value:{space?: Length})
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct RowExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-container-rowsplit.md
浏览文件 @ 8aeebccc
......@@ -34,7 +34,8 @@ RowSplit()
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct RowSplitExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-container-scroll.md
浏览文件 @ 8aeebccc
......@@ -135,7 +135,8 @@ scroller.scrollToIndex(value: number): void
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct ScrollExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-container-sidebarcontainer.md
浏览文件 @ 8aeebccc
......@@ -65,7 +65,8 @@ SideBarContainer( type?: SideBarContainerType )
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct SideBarContainerExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-container-stack.md
浏览文件 @ 8aeebccc
......@@ -29,7 +29,8 @@ Stack(value:{alignContent?: Alignment})
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct StackExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-container-swiper.md
浏览文件 @ 8aeebccc
......@@ -23,14 +23,14 @@ Swiper(value:{controller?: SwiperController})
- 参数
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| -------- | -------- | -------- | -------- | -------- |
| ---------- | ------------------------------------- | ---- | ---- | -------------------- |
| controller | [SwiperController](#swipercontroller) | 否 | null | 给组件绑定一个控制器，用来控制组件翻页。 |
## 属性
| 名称 | 参数类型 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- |
| --------------------------- | ---------------------------------------- | ---------- | ---------------------------------------- |
| index | number | 0 | 设置当前在容器中显示的子组件的索引值。 |
| autoPlay | boolean | false | 子组件是否自动播放，自动播放状态下，导航点不可操作。 |
| interval | number | 3000 | 使用自动播放时播放的时间间隔，单位为毫秒。 |
......@@ -42,7 +42,7 @@ Swiper(value:{controller?: SwiperController})
| cachedCount<sup>8+</sup> | number | 1 | 设置预加载子组件个数。 |
| disableSwipe<sup>8+</sup> | boolean | false | 禁用组件滑动切换功能。 |
| curve<sup>8+</sup> | [Curve](ts-animatorproperty.md#Curve枚举说明) \| Curves | Curve.Ease | 设置Swiper的动画曲线，默认为淡入淡出曲线，常用曲线参考[Curve枚举说明](ts-animatorproperty.md#Curve枚举说明)，也可以通过插值计算模块提供的接口创建自定义的Curves([插值曲线对象](ts-interpolation-calculation.md))。 |
| 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/>} | - |设置indicator样式：<br/>-&nbsp;left:&nbsp;设置导航点距离Swiper组件左边的距离。<br/>-&nbsp;top:&nbsp;设置导航点距离Swiper组件顶部的距离。<br/>-&nbsp;right:&nbsp;设置导航点距离Swiper组件右边的距离。<br/>-&nbsp;bottom:&nbsp;设置导航点距离Swiper组件底部的距离。<br/>-&nbsp;size:&nbsp;设置导航点的直径。<br/>-&nbsp;color:&nbsp;设置导航点的颜色。<br/>-&nbsp;selectedColor:&nbsp;设置选中的导航点的颜色。 |
| 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/>} | - | 设置indicator样式：<br/>-&nbsp;left:&nbsp;设置导航点距离Swiper组件左边的距离。<br/>-&nbsp;top:&nbsp;设置导航点距离Swiper组件顶部的距离。<br/>-&nbsp;right:&nbsp;设置导航点距离Swiper组件右边的距离。<br/>-&nbsp;bottom:&nbsp;设置导航点距离Swiper组件底部的距离。<br/>-&nbsp;size:&nbsp;设置导航点的直径。<br/>-&nbsp;color:&nbsp;设置导航点的颜色。<br/>-&nbsp;selectedColor:&nbsp;设置选中的导航点的颜色。 |
### SwiperController
......@@ -50,7 +50,7 @@ Swiper(value:{controller?: SwiperController})
Swiper容器组件的控制器，可以将此对象绑定至Swiper组件，然后通过它控制翻页。
| 接口名称 | 功能描述 |
| -------- | -------- |
| ------------------- | ------ |
| showNext():void | 翻至下一页。 |
| showPrevious():void | 翻至上一页。 |
......@@ -58,13 +58,14 @@ Swiper容器组件的控制器，可以将此对象绑定至Swiper组件，然
## 事件
| 名称 | 功能描述 |
| -------- | -------- |
| ---------------------------------------- | ------------------ |
| onChange(&nbsp;index:&nbsp;number)&nbsp;=&gt;&nbsp;void | 当前显示的组件索引变化时触发该事件。 |
## 示例
```
```ts
// xxx.ets
class MyDataSource implements IDataSource {
private list: number[] = []
private listener: DataChangeListener
......
zh-cn/application-dev/reference/arkui-ts/ts-container-tabcontent.md
浏览文件 @ 8aeebccc
......@@ -38,7 +38,8 @@ TabContent()
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct TabContentExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-container-tabs.md
浏览文件 @ 8aeebccc
......@@ -86,7 +86,8 @@ changeIndex(value: number): void
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct TabsExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-circle.md
浏览文件 @ 8aeebccc
......@@ -43,7 +43,8 @@ Circle(options?: {width: Length, height: Length})
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct CircleExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-ellipse.md
浏览文件 @ 8aeebccc
......@@ -43,7 +43,8 @@ ellipse(options?: {width: Length, height: Length})
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct EllipseExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-line.md
浏览文件 @ 8aeebccc
......@@ -45,7 +45,8 @@ Line(options?: {width: Length, height: Length})
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct LineExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-path.md
浏览文件 @ 8aeebccc
......@@ -20,7 +20,7 @@
除支持[通用属性](ts-universal-attributes-size.md)外，还支持以下属性：
| 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 |
| -------- | --------------------------------------- | ------ | ---- | ------------------------------------------------------------ |
| -------- | ----------------------------------- | ---- | ---- | ---------------------------------------- |
| width | [Length](../../ui/ts-types.md#长度类型) | 0 | 否 | 路径所在矩形画布的宽度。 |
| height | [Length](../../ui/ts-types.md#长度类型) | 0 | 否 | 路径所在矩形画布的高度。 |
| commands | string | '' | 是 | 路径绘制的命令字符串，单位为px。像素单位转换方法请参考[像素单位转换](../../ui/ts-pixel-units.md)。 |
......@@ -28,7 +28,7 @@
commands支持的绘制命令如下：
| 命令 | 名称 | 参数 | 说明 |
| ---- | -------------------------------- | ----------------------------------------------------- | ------------------------------------------------------------ |
| ---- | -------------------------------- | ---------------------------------------- | ---------------------------------------- |
| M | moveto | （x y） | 在给定的 (x, y) 坐标处开始一个新的子路径。例如，`M 0 0` 表示将（0, 0）点作为新子路径的起始点。 |
| L | lineto | （x y） | 从当前点到给定的 (x, y) 坐标画一条线，该坐标成为新的当前点。例如，`L 50 50` 表示绘制当前点到（50, 50）点的直线，并将（50, 50）点作为新子路径的起始点。 |
| H | horizontal lineto | x | 从当前点绘制一条水平线，等效于将y坐标指定为0的L命令。例如，`H 50 ` 表示绘制当前点到（50, 0）点的直线，并将（50, 0）点作为新子路径的起始点。 |
......@@ -45,6 +45,7 @@ commands支持的绘制命令如下：
## 示例
```ts
// xxx.ets
@Entry
@Component
struct PathExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-polygon.md
浏览文件 @ 8aeebccc
......@@ -44,7 +44,8 @@ Polygon(value:{options?: {width: Length, height: Length}})
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct PolygonExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-polyline.md
浏览文件 @ 8aeebccc
......@@ -44,7 +44,8 @@ Polyline(options?: {width: Length, height: Length})
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct PolylineExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-rect.md
浏览文件 @ 8aeebccc
......@@ -49,7 +49,8 @@ Rect(value:{options?: {width: Length,height: Length,radius?: Length | Array&lt;L
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct RectExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-drawing-components-shape.md
浏览文件 @ 8aeebccc
......@@ -59,7 +59,8 @@ Shape(value:{target?: PixelMap})
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct ShapeExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-explicit-animation.md
浏览文件 @ 8aeebccc
......@@ -30,7 +30,8 @@
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct AnimateToExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-gesture-settings.md
浏览文件 @ 8aeebccc
......@@ -58,7 +58,8 @@
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct GestureSettingsExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-interpolation-calculation.md
浏览文件 @ 8aeebccc
......@@ -26,7 +26,7 @@ init(curve?: Curve): Object
- 参数
| 参数名 | 类型 | 必填 | 默认值 | 说明 |
| -------- | -------- | -------- | -------- | -------- |
| ----- | ----- | ---- | ------ | ----- |
| curve | Curve | 否 | Linear | 曲线对象。 |
- 返回值<br>
......@@ -43,7 +43,7 @@ steps(count: number, end: boolean): Object
- 参数
| 参数名 | 类型 | 必填 | 默认值 | 说明 |
| -------- | -------- | -------- | -------- | -------- |
| ----- | ------- | ---- | ---- | ---------------------------------------- |
| count | number | 是 | - | 阶梯的数量，需要为正整数。 |
| end | boolean | 否 | true | 在每个间隔的起点或是终点发生阶跃变化&nbsp;，默认值为true，即在终点发生阶跃变化。 |
......@@ -61,7 +61,7 @@ cubicBezier(x1: number, y1: number, x2: number, y2: number): Object
- 参数
| 参数名 | 类型 | 必填 | 说明 |
| -------- | -------- | -------- | -------- |
| ---- | ------ | ---- | -------------- |
| x1 | number | 是 | 确定贝塞尔曲线第一点横坐标。 |
| y1 | number | 是 | 确定贝塞尔曲线第一点纵坐标。 |
| x2 | number | 是 | 确定贝塞尔曲线第二点横坐标。 |
......@@ -81,7 +81,7 @@ spring(velocity: number, mass: number, stiffness: number, damping: number): Obje
- 参数
| 参数名 | 类型 | 必填 | 说明 |
| -------- | -------- | -------- | -------- |
| --------- | ------ | ---- | ----- |
| velocity | number | 是 | 初始速度。 |
| mass | number | 是 | 质量。 |
| stiffness | number | 是 | 刚度。 |
......@@ -93,7 +93,7 @@ spring(velocity: number, mass: number, stiffness: number, damping: number): Obje
## 示例
```
```ts
import Curves from '@ohos.curves'
let curve1 = Curves.init() // 创建一个默认线性插值曲线
let curve2 = Curves.init(Curve.EaseIn) // 创建一个默认先慢后快插值曲线
......@@ -104,12 +104,12 @@ let curve3 = Curves.cubicBezier(0.1, 0.0, 0.1, 1.0) // 创建一个三阶贝塞
曲线对象只能通过上面的接口创建。
| 接口名称 | 功能描述 |
| -------- | -------- |
| ---------------------------------------- | ---------------------------------------- |
| interpolate(time:&nbsp;number):&nbsp;number | 插值曲线的插值计算函数，可以通过传入的归一化时间参数返回当前的插值。<br/>time:&nbsp;当前的归一化时间参数，有效值范围0到1。<br/>返回归一化time时间点对应的曲线插值。 |
- 示例
```
```ts
import Curves from '@ohos.curves'
let curve = Curves.init(Curve.EaseIn) // 创建一个默认先慢后快插值曲线
let value: number = curve.interpolate(0.5) // 计算得到时间到一半时的插值
......@@ -118,7 +118,8 @@ let curve3 = Curves.cubicBezier(0.1, 0.0, 0.1, 1.0) // 创建一个三阶贝塞
## 整体示例
```
```ts
// xxx.ets
import Curves from '@ohos.curves'
@Entry
@Component
......
zh-cn/application-dev/reference/arkui-ts/ts-matrix-transformation.md
浏览文件 @ 8aeebccc
......@@ -26,17 +26,17 @@ Matrix的构造函数，可以通过传入的参数创建一个四阶矩阵，
- 参数
| 参数名 | 类型 | 必填 | 默认值 | 说明 |
| -------- | -------- | -------- | -------- | -------- |
| ----- | ------------------- | ---- | ---------------------------------------- | -------------------------------------- |
| array | Array&lt;number&gt; | 是 | [1,&nbsp;0,&nbsp;0,&nbsp;0,<br/>0,&nbsp;1,&nbsp;0,&nbsp;0,<br/>0,&nbsp;0,&nbsp;1,&nbsp;0,<br/>0,&nbsp;0,&nbsp;0,&nbsp;1] | 参数为长度为16（4\*4）的number数组,&nbsp;详情见参数描述。 |
- 返回值
| 类型 | 说明 |
| -------- | -------- |
| ------ | -------------- |
| Object | 根据入参创建的四阶矩阵对象。 |
- 参数描述
| 参数名 | 类型 | 必填 | 说明 |
| -------- | -------- | -------- | -------- |
| ---- | ------ | ---- | -------------------- |
| m00 | number | 是 | x轴缩放值，单位矩阵默认为1。 |
| m01 | number | 是 | 第2个值，xyz轴旋转会影响这个值。 |
| m02 | number | 是 | 第3个值，xyz轴旋转会影响这个值。 |
......@@ -55,7 +55,7 @@ Matrix的构造函数，可以通过传入的参数创建一个四阶矩阵，
| m33 | number | 是 | 齐次坐标下生效，产生透视投影效果。 |
- 示例
```
```ts
import Matrix4 from '@ohos.matrix4'
// 创建一个四阶矩阵
let matrix = Matrix4.init([1.0, 0.0, 0.0, 0.0,
......@@ -75,11 +75,11 @@ Matrix的初始化函数，可以返回一个单位矩阵对象。
- 返回值
| 类型 | 说明 |
| -------- | -------- |
| ------ | ------- |
| Object | 单位矩阵对象。 |
- 示例
```
```ts
// matrix1 和 matrix2 效果一致
import Matrix4 from '@ohos.matrix4'
let matrix = Matrix4.init([1.0, 0.0, 0.0, 0.0,
......@@ -100,11 +100,12 @@ Matrix的拷贝函数，可以拷贝一份当前的矩阵对象。
- 返回值
| 类型 | 说明 |
| -------- | -------- |
| ------ | ---------- |
| Object | 当前矩阵的拷贝对象。 |
- 示例
```
```ts
// xxx.ets
import Matrix4 from '@ohos.matrix4'
@Entry
@Component
......@@ -143,16 +144,17 @@ Matrix的叠加函数，可以将两个矩阵的效果叠加起来生成一个
- 参数
| 参数名 | 类型 | 必填 | 默认值 | 说明 |
| -------- | -------- | -------- | -------- | -------- |
| ------ | ------- | ---- | ---- | --------- |
| matrix | Matrix4 | 是 | - | 待叠加的矩阵对象。 |
- 返回值
| 类型 | 说明 |
| -------- | -------- |
| ------ | --------- |
| Object | 矩阵叠加后的对象。 |
- 示例
```
```ts
// xxx.ets
import Matrix4 from '@ohos.matrix4'
@Entry
@Component
......@@ -184,11 +186,11 @@ Matrix的逆函数，可以返回一个当前矩阵对象的逆矩阵，即效
- 返回值
| 类型 | 说明 |
| -------- | -------- |
| ------ | ----------- |
| Object | 当前矩阵的逆矩阵对象。 |
- 示例
```
```ts
import Matrix4 from '@ohos.matrix4'
// matrix1(宽放大2倍) 和 matrix2(宽缩小2倍) 效果相反
let matrix1 = Matrix4.identity().scale({x:2})
......@@ -206,7 +208,7 @@ Matrix的平移函数，可以为当前矩阵增加x轴/Y轴/Z轴平移效果。
- 参数
| 参数名 | 类型 | 必填 | 默认值 | 说明 |
| -------- | -------- | -------- | -------- | -------- |
| ---- | ------ | ---- | ---- | ------------- |
| x | number | 否 | 0 | x轴的平移距离，单位px。 |
| y | number | 否 | 0 | y轴的平移距离，单位px。 |
| z | number | 否 | 0 | z轴的平移距离，单位px。 |
......@@ -214,11 +216,12 @@ Matrix的平移函数，可以为当前矩阵增加x轴/Y轴/Z轴平移效果。
- 返回值
| 类型 | 说明 |
| -------- | -------- |
| ------ | -------------- |
| Object | 增加好平移效果后的矩阵对象。 |
- 示例
```
```ts
// xxx.ets
import Matrix4 from '@ohos.matrix4'
@Entry
@Component
......@@ -247,7 +250,7 @@ Matrix的缩放函数，可以为当前矩阵增加x轴/Y轴/Z轴缩放效果。
- 参数
| 参数名 | 类型 | 必填 | 默认值 | 说明 |
| -------- | -------- | -------- | -------- | -------- |
| ------- | ------ | ---- | ---- | ---------- |
| x | number | 否 | 1 | x轴的缩放倍数。 |
| y | number | 否 | 1 | y轴的缩放倍数。 |
| z | number | 否 | 1 | z轴的缩放倍数。 |
......@@ -257,11 +260,12 @@ Matrix的缩放函数，可以为当前矩阵增加x轴/Y轴/Z轴缩放效果。
- 返回值
| 类型 | 说明 |
| -------- | -------- |
| ------ | -------------- |
| Object | 增加好缩放效果后的矩阵对象。 |
- 示例
```
```ts
// xxx.ets
import Matrix4 from '@ohos.matrix4'
@Entry
@Component
......@@ -290,7 +294,7 @@ Matrix的旋转函数，可以为当前矩阵增加x轴/Y轴/Z轴旋转效果。
- 参数
| 参数名 | 类型 | 必填 | 默认值 | 说明 |
| -------- | -------- | -------- | -------- | -------- |
| ------- | ------ | ---- | ---- | ---------- |
| x | number | 否 | 1 | 旋转轴向量x坐标。 |
| y | number | 否 | 1 | 旋转轴向量y坐标。 |
| z | number | 否 | 1 | 旋转轴向量z坐标。 |
......@@ -301,11 +305,12 @@ Matrix的旋转函数，可以为当前矩阵增加x轴/Y轴/Z轴旋转效果。
- 返回值
| 类型 | 说明 |
| -------- | -------- |
| ------ | -------------- |
| Object | 增加好旋转效果后的矩阵对象。 |
- 示例
```
```ts
// xxx.ets
import Matrix4 from '@ohos.matrix4'
@Entry
@Component
......@@ -334,17 +339,18 @@ Matrix的坐标点转换函数，可以将当前的变换效果作用到一个
- 参数
| 参数名 | 类型 | 必填 | 默认值 | 说明 |
| -------- | -------- | -------- | -------- | -------- |
| ----- | ----- | ---- | ---- | --------- |
| point | Point | 是 | - | 需要转换的坐标点。 |
- 返回值
| 类型 | 说明 |
| -------- | -------- |
| ----- | ---------------- |
| Point | 返回矩阵变换后的Point对象。 |
- 示例
```
```ts
// xxx.ets
import Matrix4 from '@ohos.matrix4'
import prompt from '@system.prompt'
......
zh-cn/application-dev/reference/arkui-ts/ts-media-components-video.md
浏览文件 @ 8aeebccc
......@@ -155,7 +155,8 @@ setCurrentTime(value: number, seekMode: SeekMode)
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct VideoCreateComponent {
......
zh-cn/application-dev/reference/arkui-ts/ts-methods-action-sheet.md
浏览文件 @ 8aeebccc
......@@ -42,7 +42,8 @@ show(options: {&nbsp;paramObject1})
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct ActionSheetExapmle {
......
zh-cn/application-dev/reference/arkui-ts/ts-methods-alert-dialog-box.md
浏览文件 @ 8aeebccc
......@@ -41,7 +41,8 @@
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct AlertDialogExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-methods-custom-dialog-box.md
浏览文件 @ 8aeebccc
......@@ -14,7 +14,7 @@ CustomDialogController(value:{builder: CustomDialog, cancel?: () =&gt; void, aut
- 参数
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| -------- | -------- | -------- | -------- | -------- |
| ---------------------- | ---------------------------------------- | ---- | ----------------------- | ---------------------- |
| builder | [CustomDialog](../../ui/ts-component-based-customdialog.md) | 是 | - | 自定义弹窗内容构造器。 |
| cancel | ()&nbsp;=&gt;&nbsp;void | 否 | - | 点击遮障层退出时的回调。 |
| autoCancel | boolean | 否 | true | 是否允许点击遮障层退出。 |
......@@ -25,7 +25,7 @@ CustomDialogController(value:{builder: CustomDialog, cancel?: () =&gt; void, aut
- DialogAlignment枚举说明
| 名称 | 描述 |
| -------- | -------- |
| ------------------------ | ------- |
| Top | 垂直顶部对齐。 |
| Center | 垂直居中对齐。 |
| Bottom | 垂直底部对齐。 |
......@@ -62,7 +62,8 @@ close(): void
## 示例
```
```ts
// xxx.ets
@CustomDialog
struct CustomDialogExample {
controller: CustomDialogController
......
zh-cn/application-dev/reference/arkui-ts/ts-methods-datepicker-dialog.md
浏览文件 @ 8aeebccc
......@@ -29,7 +29,8 @@ show(options?: DatePickerDialogOptions)
## 示例
### 日期滑动选择器（显示农历）示例
```
```ts
// xxx.ets
@Entry
@Component
struct DatePickerDialogExample01 {
......@@ -62,7 +63,8 @@ struct DatePickerDialogExample01 {
}
```
### 日期滑动选择器（不显示农历）示例
```
```ts
// xxx.ets
@Entry
@Component
struct DatePickerDialogExample02 {
......
zh-cn/application-dev/reference/arkui-ts/ts-methods-menu.md
浏览文件 @ 8aeebccc
......@@ -10,8 +10,9 @@ close(): void
可以通过该方法在页面范围内关闭通过[bindContextMenu](./ts-universal-attributes-menu.md#属性)给组件绑定的菜单。
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct Index {
@Builder MenuBuilder(){
......
zh-cn/application-dev/reference/arkui-ts/ts-methods-textpicker-dialog.md
浏览文件 @ 8aeebccc
......@@ -33,7 +33,8 @@ show(options: TextPickerDialogOptions)
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct TextPickerDialogExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-methods-timepicker-dialog.md
浏览文件 @ 8aeebccc
......@@ -27,7 +27,8 @@ show(options?: TimePickerDialogOptions)
## 示例
### 时间滑动选择器（24小时制）示例
```
```ts
// xxx.ets
@Entry
@Component
struct TimePickerDialogExample01 {
......@@ -55,7 +56,8 @@ struct TimePickerDialogExample01 {
}
```
### 时间滑动选择器（12小时制）示例
```
```ts
// xxx.ets
@Entry
@Component
struct TimePickerDialogExample02 {
......
zh-cn/application-dev/reference/arkui-ts/ts-motion-path-animation.md
浏览文件 @ 8aeebccc
......@@ -16,7 +16,8 @@
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct MotionPathExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-offscreencanvasrenderingcontext2d.md
浏览文件 @ 8aeebccc
......@@ -48,7 +48,8 @@ OffscreenCanvasRenderingContext2D(width: number, height: number, setting: Render
### fillStyle
```
```ts
// xxx.ets
@Entry
@Component
struct FillStyleExample {
......@@ -80,7 +81,8 @@ struct FillStyleExample {
### lineWidth
```
```ts
// xxx.ets
@Entry
@Component
struct LineWidthExample {
......@@ -112,7 +114,8 @@ struct LineWidthExample {
### strokeStyle
```
```ts
// xxx.ets
@Entry
@Component
struct StrokeStyleExample {
......@@ -146,7 +149,8 @@ struct StrokeStyleExample {
### lineCap
```
```ts
// xxx.ets
@Entry
@Component
struct LineCapExample {
......@@ -182,7 +186,8 @@ struct LineCapExample {
### lineJoin
```
```ts
// xxx.ets
@Entry
@Component
struct LineJoinExample {
......@@ -219,7 +224,8 @@ struct LineJoinExample {
### miterLimit
```
```ts
// xxx.ets
@Entry
@Component
struct MiterLimit {
......@@ -256,7 +262,8 @@ struct MiterLimit {
### font
```
```ts
// xxx.ets
@Entry
@Component
struct Font {
......@@ -288,7 +295,8 @@ struct Font {
### textAlign
```
```ts
// xxx.ets
@Entry
@Component
struct CanvasExample {
......@@ -335,7 +343,8 @@ struct CanvasExample {
### textBaseline
```
```ts
// xxx.ets
@Entry
@Component
struct TextBaseline {
......@@ -382,7 +391,8 @@ struct TextBaseline {
### globalAlpha
```
```ts
// xxx.ets
@Entry
@Component
struct GlobalAlpha {
......@@ -417,7 +427,8 @@ struct GlobalAlpha {
### lineDashOffset
```
```ts
// xxx.ets
@Entry
@Component
struct LineDashOffset {
......@@ -464,7 +475,8 @@ struct LineDashOffset {
| copy | 显示新绘制内容而忽略现有绘制内容。 |
| xor | 使用异或操作对新绘制内容与现有绘制内容进行融合。 |
```
```ts
// xxx.ets
@Entry
@Component
struct GlobalCompositeOperation {
......@@ -504,7 +516,8 @@ struct GlobalCompositeOperation {
### shadowBlur
```
```ts
// xxx.ets
@Entry
@Component
struct ShadowBlur {
......@@ -538,7 +551,8 @@ struct ShadowBlur {
### shadowColor
```
```ts
// xxx.ets
@Entry
@Component
struct ShadowColor {
......@@ -573,7 +587,8 @@ struct ShadowColor {
### shadowOffsetX
```
```ts
// xxx.ets
@Entry
@Component
struct ShadowOffsetX {
......@@ -608,7 +623,8 @@ struct ShadowOffsetX {
### shadowOffsetY
```
```ts
// xxx.ets
@Entry
@Component
struct ShadowOffsetY {
......@@ -643,7 +659,8 @@ struct ShadowOffsetY {
### imageSmoothingEnabled
```
```ts
// xxx.ets
@Entry
@Component
struct ImageSmoothingEnabled {
......@@ -692,8 +709,9 @@ fillRect(x: number, y: number, w: number, h: number): void
| height | number | 是 | 0 | 指定矩形的高度。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct FillRect {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -736,8 +754,9 @@ strokeRect(x: number, y: number, w: number, h: number): void
| height | number | 是 | 0 | 指定矩形的高度。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct StrokeRect {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -779,8 +798,9 @@ clearRect(x: number, y: number, w: number, h: number): void
| height | number | 是 | 0 | 指定矩形的高度。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct ClearRect {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -823,8 +843,9 @@ fillText(text: string, x: number, y: number): void
| y | number | 是 | 0 | 需要绘制的文本的左下角y坐标。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct FillText {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -866,8 +887,9 @@ strokeText(text: string, x: number, y: number): void
| y | number | 是 | 0 | 需要绘制的文本的左下角y坐标。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct StrokeText {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -917,8 +939,9 @@ measureText(text: string): TextMetrics
| width | number | 字符串的宽度。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct MeasureText {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -959,8 +982,9 @@ stroke(path?: Path2D): void
| path | [Path2D](ts-components-canvas-path2d.md) | 否 | null | 需要绘制的Path2D。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct Stroke {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -997,8 +1021,9 @@ beginPath(): void
创建一个新的绘制路径。
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct BeginPath {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1043,8 +1068,9 @@ moveTo(x: number, y: number): void
| y | number | 是 | 0 | 指定位置的y坐标。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct MoveTo {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1087,8 +1113,9 @@ lineTo(x: number, y: number): void
| y | number | 是 | 0 | 指定位置的y坐标。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct LineTo {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1125,8 +1152,9 @@ closePath(): void
结束当前路径形成一个封闭路径。
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct ClosePath {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1171,8 +1199,9 @@ createPattern(image: ImageBitmap, repetition: string): CanvasPattern
| repetition | string | 是 | “” | 设置图像重复的方式，取值为：'repeat'、'repeat-x'、&nbsp;'repeat-y'、'no-repeat'。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct CreatePattern {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1219,8 +1248,9 @@ bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number,
| y | number | 是 | 0 | 路径结束时的y坐标值。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct BezierCurveTo {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1265,8 +1295,9 @@ quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): void
| y | number | 是 | 0 | 路径结束时的y坐标值。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct QuadraticCurveTo {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1313,8 +1344,9 @@ arc(x: number, y: number, radius: number, startAngle: number, endAngle: number,
| anticlockwise | boolean | 否 | false | 是否逆时针绘制圆弧。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct Arc {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1359,8 +1391,9 @@ arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void
| radius | number | 是 | 0 | 圆弧的圆半径值。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct ArcTo {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1409,8 +1442,9 @@ ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct CanvasExample {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1454,8 +1488,9 @@ rect(x: number, y: number, width: number, height: number): void
| height | number | 是 | 0 | 指定矩形的高度。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct CanvasExample {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1490,8 +1525,9 @@ fill(): void
对封闭路径进行填充。
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct Fill {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1526,8 +1562,9 @@ clip(): void
设置当前路径为剪切路径。
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct Clip {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1570,8 +1607,9 @@ rotate(rotate: number): void
| rotate | number | 是 | 0 | 设置顺时针旋转的弧度值，可以通过Math.PI&nbsp;/&nbsp;180将角度转换为弧度值。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct Rotate {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1612,8 +1650,9 @@ scale(x: number, y: number): void
| y | number | 是 | 0 | 设置垂直方向的缩放值。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct Scale {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1666,8 +1705,9 @@ transform方法对应一个变换矩阵，想对一个图形进行变化的时
| translateY | number | 是 | 0 | 指定垂直移动值。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct Transform {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1718,8 +1758,9 @@ setTransfrom方法使用的参数和transform()方法相同，但setTransform()
| translateY | number | 是 | 0 | 指定垂直移动值。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct SetTransform {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1763,8 +1804,9 @@ translate(x: number, y: number): void
| y | number | 是 | 0 | 设置竖直平移量。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct Translate {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1818,8 +1860,9 @@ drawImage(image: ImageBitmap | PixelMap, sx: number, sy: number, sWidth: number,
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct Index {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1917,8 +1960,9 @@ putImageData(imageData: Object, dx: number, dy: number, dirtyX?: number, dirtyY?
| dirtyHeight | number | 否 | imagedata的高度 | 源图像数据矩形裁切范围的高度。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct PutImageData {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1959,8 +2003,9 @@ restore(): void
对保存的绘图上下文进行恢复。
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct CanvasExample {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -1992,8 +2037,9 @@ save(): void
对当前的绘图上下文进行保存。
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct CanvasExample {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -2033,8 +2079,9 @@ createLinearGradient(x0: number, y0: number, x1: number, y1: number): void
| y1 | number | 是 | 0 | 终点的y轴坐标。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct CreateLinearGradient {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......@@ -2084,8 +2131,9 @@ createRadialGradient(x0: number, y0: number, r0: number, x1: number, y1: number,
| r1 | number | 是 | 0 | 终点圆的半径。必须为非负且有限的。 |
- 示例
```
@Entry
```ts
// xxx.ets
@Entry
@Component
struct CreateRadialGradient {
private settings: RenderingContextSettings = new RenderingContextSettings(true)
......
zh-cn/application-dev/reference/arkui-ts/ts-page-transition-animation.md
浏览文件 @ 8aeebccc
......@@ -8,14 +8,14 @@
| 名称 | 参数 | 参数描述 |
| -------- | -------- | -------- |
| ------------------- | ------ | ------------------------------- |
| PageTransitionEnter | Object | 页面入场组件，用于自定义当前页面的入场效果，详见动效参数说明。 |
| PageTransitionExit | Object | 页面退场组件，用于自定义当前页面的退场效果，详见动效参数说明。 |
- 动效参数说明
| 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 |
| -------- | -------- | -------- | -------- | -------- |
| -------- | ------------------------- | ------ | ---- | ---------------------------------------- |
| type | RouteType | - | 否 | 不配置时表明pop为push时效果的逆播。 |
| duration | number | 1000 | 否 | 动画时长，单位为毫秒。 |
| curve | Curve&nbsp;\|&nbsp;Curves | Linear | 否 | 动画曲线，有效值参见[Curve](ts-animatorproperty.md)&nbsp;说明。 |
......@@ -24,7 +24,7 @@
- RouteType枚举说明
| 名称 | 描述 |
| -------- | -------- |
| ---- | ---------------------------------------- |
| Pop | PageA跳转到PageB时，PageA为Exit+Push，PageB为Enter+Push。 |
| Push | PageB返回至PageA时，PageA为Enter+Pop，PageB为Exit+Pop。 |
......@@ -34,7 +34,7 @@
PageTransitionEnter和PageTransitionExit组件支持的属性：
| 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 |
| -------- | -------- | -------- | -------- | -------- |
| --------- | ---------------------------------------- | ----------------- | ---- | ---------------------------------------- |
| slide | SlideEffect | SlideEffect.Right | 否 | 设置转场的滑入效果，有效值参见SlideEffect枚举说明。 |
| translate | {<br/>x?&nbsp;:&nbsp;number,<br/>y?&nbsp;:&nbsp;number,<br/>z?&nbsp;:&nbsp;number<br/>} | - | 否 | 设置页面转场时的平移效果，为入场时起点和退场时终点的值，和slide同时设置时默认生效slide。 |
| scale | {<br/>x?&nbsp;:&nbsp;number,<br/>y?&nbsp;:&nbsp;number,<br/>z?&nbsp;:&nbsp;number,<br/>centerX?&nbsp;:&nbsp;number,<br/>centerY?&nbsp;:&nbsp;number<br/>} | - | 否 | 设置页面转场时的缩放效果，为入场时起点和退场时终点的值。 |
......@@ -42,7 +42,7 @@ PageTransitionEnter和PageTransitionExit组件支持的属性：
- SlideEffect枚举说明
| 名称 | 描述 |
| -------- | -------- |
| ------ | ------------------------- |
| Left | 设置到入场时表示从左边滑入，出场时表示滑出到左边。 |
| Right | 设置到入场时表示从右边滑入，出场时表示滑出到右边。 |
| Top | 设置到入场时表示从上边滑入，出场时表示滑出到上边。 |
......@@ -54,7 +54,7 @@ PageTransitionEnter和PageTransitionExit组件支持的属性：
PageTransitionEnter和PageTransitionExit组件支持的事件：
| 事件 | 功能描述 |
| -------- | -------- |
| ---------------------------------------- | ----------------------------------- |
| onEnter(type:&nbsp;RouteType,&nbsp;progress:&nbsp;number)&nbsp;=&gt;&nbsp;void | 回调入参为当前入场动画的归一化进度[0&nbsp;-&nbsp;1]。 |
| onExit(type:&nbsp;RouteType,&nbsp;progress:&nbsp;number)&nbsp;=&gt;&nbsp;void | 回调入参为当前退场动画的归一化进度[0&nbsp;-&nbsp;1]。 |
......@@ -63,7 +63,7 @@ PageTransitionEnter和PageTransitionExit组件支持的事件：
自定义方式1：配置了当前页面的入场动画为淡入，退场动画为缩小。
```
```ts
// index.ets
@Entry
@Component
......@@ -97,7 +97,7 @@ struct PageTransitionExample1 {
}
```
```
```ts
// page1.ets
@Entry
@Component
......@@ -132,7 +132,7 @@ struct AExample {
自定义方式2：配置了当前页面的入场动画为从左侧滑入，退场为缩小加透明度变化。
```
```ts
// index.ets
@Entry
@Component
......@@ -163,7 +163,7 @@ struct PageTransitionExample {
}
```
```
```ts
// page1.ets
@Entry
@Component
......
zh-cn/application-dev/reference/arkui-ts/ts-transition-animation-component.md
浏览文件 @ 8aeebccc
......@@ -34,7 +34,8 @@
示例功能通过一个Button控制第二个Button的出现和消失，并通过transition配置第二个Button出现和消失的过场动画。
```
```ts
// xxx.ets
@Entry
@Component
struct TransitionExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-transition-animation-shared-elements.md
浏览文件 @ 8aeebccc
......@@ -10,12 +10,12 @@
## 属性
| 名称 | 参数 | 默认值 | 参数描述 |
| -------- | -------- | -------- | -------- |
| ---------------- | ---------------------------------------- | ---- | ---------------------------------------- |
| sharedTransition | id:&nbsp;string,<br/>options?:&nbsp;Object | - | 两个页面的组件配置为同一个id，则转场过程中会进行共享元素转场，配置为空字符串时不会有共享元素转场效果。 |
- options参数说明
| 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 |
| -------- | -------- | -------- | -------- | -------- |
| -------- | ------------------------- | ------ | ---- | --------------------- |
| duration | number | 1000 | 否 | 单位为毫秒，默认动画时长为1000毫秒。 |
| curve | Curve&nbsp;\|&nbsp;Curves | Linear | 否 | 默认曲线为线性，有效值参见Curve说明。 |
| delay | number | 0 | 否 | 单位为毫秒，默认不延时播放。 |
......@@ -25,7 +25,8 @@
示例功能为两个页面，共享元素转场页面图片点击后转场至页面B的图片。
```
```ts
// xxx.ets
@Entry
@Component
struct SharedTransitionExample {
......@@ -53,8 +54,8 @@ struct SharedTransitionExample {
}
```
```
// PageB
```ts
// PageB.ets
@Entry
@Component
struct BExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-background.md
浏览文件 @ 8aeebccc
......@@ -33,7 +33,8 @@
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct BackgroundExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-border.md
浏览文件 @ 8aeebccc
......@@ -34,7 +34,8 @@
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct BorderExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-click.md
浏览文件 @ 8aeebccc
......@@ -19,7 +19,8 @@
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct TouchAbleExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-component-id.md
浏览文件 @ 8aeebccc
......@@ -57,7 +57,8 @@ sendEventByKey(id: string, action: number, params: string): boolean
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct IdExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-enable.md
浏览文件 @ 8aeebccc
......@@ -19,7 +19,8 @@
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct EnabledExample {
......
zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-flex-layout.md
浏览文件 @ 8aeebccc
......@@ -24,7 +24,8 @@
## 示例
```
```ts
// xxx.ets
@Entry
@Component
struct FlexExample {
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或