未验证 提交 b6a428de 编写于 作者: O openharmony_ci 提交者: Gitee

!8601 文档对应

Merge pull request !8601 from 田雨/OpenHarmony-3.1-Release
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
## Color ## Color
| 颜色名称 | 颜色值 | 颜色示意 | | 颜色名称 | 颜色值 | 颜色示意 |
| ------------------------ | -------- | ------------------------------------------------------------ | | -------- | -------- | ------------------------------------------------------------ |
| Black | 0x000000 | ![zh-cn_image_0000001219864153](figures/zh-cn_image_0000001219864153.png) | | Black | 0x000000 | ![zh-cn_image_0000001219864153](figures/zh-cn_image_0000001219864153.png) |
| Blue | 0x0000ff | ![zh-cn_image_0000001174104404](figures/zh-cn_image_0000001174104404.png) | | Blue | 0x0000ff | ![zh-cn_image_0000001174104404](figures/zh-cn_image_0000001174104404.png) |
| Brown | 0xa52a2a | ![zh-cn_image_0000001219744201](figures/zh-cn_image_0000001219744201.png) | | Brown | 0xa52a2a | ![zh-cn_image_0000001219744201](figures/zh-cn_image_0000001219744201.png) |
...@@ -14,6 +14,7 @@ ...@@ -14,6 +14,7 @@
| Red | 0xff0000 | ![zh-cn_image_0000001219662665](figures/zh-cn_image_0000001219662665.png) | | Red | 0xff0000 | ![zh-cn_image_0000001219662665](figures/zh-cn_image_0000001219662665.png) |
| White | 0xffffff | ![zh-cn_image_0000001174582866](figures/zh-cn_image_0000001174582866.png) | | White | 0xffffff | ![zh-cn_image_0000001174582866](figures/zh-cn_image_0000001174582866.png) |
| Yellow | 0xffff00 | ![zh-cn_image_0000001174582864](figures/zh-cn_image_0000001174582864.png) | | Yellow | 0xffff00 | ![zh-cn_image_0000001174582864](figures/zh-cn_image_0000001174582864.png) |
| Grey | 0x808080 | ![zh-cn_image_0000001174264376](figures/zh-cn_image_0000001174264376.png) |
## ImageFit ## ImageFit
...@@ -69,6 +70,7 @@ ...@@ -69,6 +70,7 @@
| Press | 鼠标按键按下。 | | Press | 鼠标按键按下。 |
| Release | 鼠标按键松开。 | | Release | 鼠标按键松开。 |
| Move | 鼠标移动。 | | Move | 鼠标移动。 |
| Hover | 鼠标悬停。 |
## Curve ## Curve
...@@ -100,9 +102,11 @@ ...@@ -100,9 +102,11 @@
## FillMode ## FillMode
| 名称 | 描述 | | 名称 | 描述 |
| -------- | -------------------------------- | | --------- | -------------------------------------------------------- |
| None | 播放完成后恢复初始状态。 | | None | 播放完成后恢复初始状态。 |
| Forwards | 播放完成后保持动画结束时的状态。 | | Forwards | 播放完成后保持动画结束时的状态。 |
| Backwards | 在显示动画之前,为动画延迟指定的时间段应用“开始”属性值。 |
| Both | 应用正向和反向填充模式。 |
## PlayMode ## PlayMode
......
...@@ -19,13 +19,13 @@ ...@@ -19,13 +19,13 @@
## 接口 ## 接口
Blank(min?: Length) Blank(min?: number | string)
**参数:** **参数:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| ------ | ---------------------------- | ---- | ------ | ------------------------------------ | | ------ | ---------------- | ---- | ------ | ------------------------------------ |
| min | [Length](ts-types.md#length) | 否 | 0 | 空白填充组件在容器主轴上的最小大小。 | | min | number \| string | 否 | 0 | 空白填充组件在容器主轴上的最小大小。 |
## 属性 ## 属性
......
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
## 接口 ## 接口
Checkbox( name?: string, group?: string ) Checkbox( options?: {name?: string, group?: string} )
**参数:** **参数:**
......
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
## 接口 ## 接口
CheckboxGroup( group?: string ) CheckboxGroup( option?: {group?: string} )
创建多选框群组,可以控制群组内的Checkbox全选或者不全选,相同group的Checkbox和CheckboxGroup为同一群组。 创建多选框群组,可以控制群组内的Checkbox全选或者不全选,相同group的Checkbox和CheckboxGroup为同一群组。
...@@ -35,9 +35,22 @@ CheckboxGroup( group?: string ) ...@@ -35,9 +35,22 @@ CheckboxGroup( group?: string )
## 事件 ## 事件
| 名称 | 功能描述 | ## onChange
| ---------------------------------------- | ---------------------------------------- |
| onChange (callback: (names: Array&lt;string&gt;, status: SelectStatus) => void ) | CheckboxGroup的选中状态或群组内的Checkbox的选中状态发生变化时,触发回调。<br>- names:群组内所有被选中的多选框名称。<br>- status:选中状态。 | onChange (callback: (event: CheckboxGroupResult ) => void )
CheckboxGroup的选中状态或群组内的Checkbox的选中状态发生变化时,触发回调。
| 名称 | 参数类型 | 必填 | 描述 |
| ----- | ------------------- | ---- | -------------------- |
| event | CheckboxGroupResult | 是 | 选中状态的回调结果。 |
## CheckboxGroupResult
| 名称 | 参数类型 | 描述 |
| ------ | ------------------- | -------------- |
| name | Array&lt;string&gt; | checkBox名称。 |
| status | selectStatus | 选中状态。 |
## SelectStatus枚举说明 ## SelectStatus枚举说明
......
...@@ -22,6 +22,14 @@ DataPanel(options:{values: number[], max?: number, type?: DataPanelType}) ...@@ -22,6 +22,14 @@ DataPanel(options:{values: number[], max?: number, type?: DataPanelType})
| max | number | 否 | 100 | -&nbsp;max大于0,表示数据的最大值。<br/>-&nbsp;max小于等于0,max等于value数组各项的和,按比例显示。 | | max | number | 否 | 100 | -&nbsp;max大于0,表示数据的最大值。<br/>-&nbsp;max小于等于0,max等于value数组各项的和,按比例显示。 |
| type<sup>8+</sup> | DataPanelType | 否 | DataPanelType.Circle | 数据面板的类型。 | | type<sup>8+</sup> | DataPanelType | 否 | DataPanelType.Circle | 数据面板的类型。 |
## 属性
| 名称 | 参数类型 | 默认值 | 描述 |
| ----------- | -------- | ------ | ------------------------------------ |
| closeEffect | boolean | true | 设置是否禁用数据比率图表的特殊效果。 |
## DataPanelType枚举说明 ## DataPanelType枚举说明
| 名称 | 描述 | | 名称 | 描述 |
......
...@@ -24,7 +24,7 @@ Divider() ...@@ -24,7 +24,7 @@ Divider()
| ----------- | --------------------------------------------------------- | ----------------- | ------------------------------------------------------------ | | ----------- | --------------------------------------------------------- | ----------------- | ------------------------------------------------------------ |
| vertical | boolean | false | 使用水平分割线还是垂直分割线,false:&nbsp;水平分割线,&nbsp;true:垂直分割线。 | | vertical | boolean | false | 使用水平分割线还是垂直分割线,false:&nbsp;水平分割线,&nbsp;true:垂直分割线。 |
| color | [ResourceColor](ts-types.md#resourcecolor8) | - | 设置分割线颜色。 | | color | [ResourceColor](ts-types.md#resourcecolor8) | - | 设置分割线颜色。 |
| strokeWidth | [Length](ts-types.md#length) | 1 | 设置分割线宽度。 | | strokeWidth | number \| string | 1 | 设置分割线宽度。 |
| lineCap | [LineCapStyle](ts-appendix-enums.md#linecapstyle枚举说明) | LineCapStyle.Butt | 设置分割线条的端点样式。 | | lineCap | [LineCapStyle](ts-appendix-enums.md#linecapstyle枚举说明) | LineCapStyle.Butt | 设置分割线条的端点样式。 |
......
...@@ -33,8 +33,8 @@ Gauge(options:{value: number, min?: number, max?: number}) ...@@ -33,8 +33,8 @@ Gauge(options:{value: number, min?: number, max?: number})
| value | number | 0 | 设置当前数据图表的值。 | | value | number | 0 | 设置当前数据图表的值。 |
| startAngle | number | -150 | 设置起始角度位置,时钟0点为0度,顺时针方向为正角度。 | | startAngle | number | -150 | 设置起始角度位置,时钟0点为0度,顺时针方向为正角度。 |
| endAngle | number | 150 | 设置终止角度位置,时钟0点为0度,顺时针方向为正角度。 | | endAngle | number | 150 | 设置终止角度位置,时钟0点为0度,顺时针方向为正角度。 |
| colors | Array&lt;ColorStop&gt; | - | 设置图表的颜色,支持分段颜色设置。 | | colors | Array&lt;any&gt; | - | 设置图表的颜色,支持分段颜色设置。 |
| strokeWidth | Length | - | 设置环形图表的环形厚度。 | | strokeWidth | [Length](ts-types.md#length) | - | 设置环形图表的环形厚度。 |
## 示例 ## 示例
......
...@@ -25,10 +25,10 @@ ImageAnimator() ...@@ -25,10 +25,10 @@ ImageAnimator()
## 属性 ## 属性
| 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 | | 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 |
| ---------- | ---------------------------------------- | -------- | ---- | ---------------------------------------- | | ---------- | ------------------------------------------------------------ | -------- | ---- | ------------------------------------------------------------ |
| images | Array&lt;{<br/>src:string,<br/>width?:Length,<br/>height?:Length,<br/>top?:Length,<br/>left?:Length,<br/>duration?:number<br/>}&gt; | [] | 是 | 设置图片帧信息集合。每一帧的帧信息包含图片路径、图片大小、图片位置和图片播放时长信息。详细说明如下:<br/>src:图片路径,图片格式为svg,png和jpg。<br/>width:图片宽度。<br/>height:图片高度。<br/>top:图片相对于组件左上角的纵向坐标。<br/>left:图片相对于组件左上角的横向坐标。<br/>duration:每一帧图片的播放时长,单位毫秒。 | | images | Array&lt;{<br/>src: string,<br/>width?: number \| string,<br/>height?: number \| string,<br/>top?: number \| string,<br/>left?: number \| string,<br/>duration?: number<br/>}&gt; | [] | 是 | 设置图片帧信息集合。每一帧的帧信息包含图片路径、图片大小、图片位置和图片播放时长信息。详细说明:<br/>- src:图片路径,图片格式为svg,png和jpg。<br/>- width:图片宽度。<br/>- height:图片高度。<br/>- top:图片相对于组件左上角的纵向坐标。<br/>- left:图片相对于组件左上角的横向坐标。<br/>- duration:每一帧图片的播放时长,单位毫秒。 |
| state | [AnimationStatus](ts-appendix-enums.md#animationstatus) | Initial | 否 | 默认为初始状态,用于控制播放状态。 | | state | [AnimationStatus](ts-appendix-enums.md#animationstatus) | Initial | 否 | 默认为初始状态,用于控制播放状态。 |
| duration | number | 1000 | 否 | 单位为毫秒,默认时长为1000ms;duration为0时,不播放图片;值的改变只会在下一次循环开始时生效;当images中设置了单独的duration后,该属性设置无效。 | | duration | number | 1000 | 否 | 单位为毫秒,默认时长为1000ms。<br/>duration为0时,不播放图片。<br/>值的改变只会在下一次循环开始时生效。<br/>当images中设置了单独的duration后,该属性设置无效。 |
| reverse | boolean | false | 否 | 设置播放顺序。false表示从第1张图片播放到最后1张图片;&nbsp;true表示从最后1张图片播放到第1张图片。 | | reverse | boolean | false | 否 | 设置播放顺序。false表示从第1张图片播放到最后1张图片;&nbsp;true表示从最后1张图片播放到第1张图片。 |
| fixedSize | boolean | true | 否 | 设置图片大小是否固定为组件大小。&nbsp;true表示图片大小与组件大小一致,此时设置图片的width&nbsp;、height&nbsp;、top&nbsp;和left属性是无效的。false表示每一张图片的&nbsp;width&nbsp;、height&nbsp;、top和left属性都要单独设置。 | | fixedSize | boolean | true | 否 | 设置图片大小是否固定为组件大小。&nbsp;true表示图片大小与组件大小一致,此时设置图片的width&nbsp;、height&nbsp;、top&nbsp;和left属性是无效的。false表示每一张图片的&nbsp;width&nbsp;、height&nbsp;、top和left属性都要单独设置。 |
| preDecode | number | 0 | 否 | 是否启用预解码,默认值为0,即不启用预解码,如该值设为2,则播放当前页时会提前加载后面两张图片至缓存以提升性能。 | | preDecode | number | 0 | 否 | 是否启用预解码,默认值为0,即不启用预解码,如该值设为2,则播放当前页时会提前加载后面两张图片至缓存以提升性能。 |
......
...@@ -32,7 +32,7 @@ Navigation() ...@@ -32,7 +32,7 @@ Navigation()
| subtitle | string | - | 页面副标题。 | | subtitle | string | - | 页面副标题。 |
| menus | Array<NavigationMenuItem&gt;&nbsp;\|&nbsp;[CustomBuilder](ts-types.md#custombuilder8)<sup>8+</sup> | - | 页面右上角菜单。 | | menus | Array<NavigationMenuItem&gt;&nbsp;\|&nbsp;[CustomBuilder](ts-types.md#custombuilder8)<sup>8+</sup> | - | 页面右上角菜单。 |
| titleMode | NavigationTitleMode | NavigationTitleMode.Free | 页面标题栏显示模式。 | | titleMode | NavigationTitleMode | NavigationTitleMode.Free | 页面标题栏显示模式。 |
| toolBar | {<br/>items:Array&lt;Object&gt;&nbsp;}<br/>\|&nbsp;[CustomBuilder](ts-types.md#custombuilder8)<sup>8+</sup> | - | 设置工具栏内容。<br/>items:&nbsp;工具栏所有项。 | | toolBar | object\|&nbsp;[CustomBuilder](ts-types.md#custombuilder8)<sup>8+</sup> | - | 设置工具栏内容。<br/>items:&nbsp;工具栏所有项。 |
| hideToolBar | boolean | false | 设置隐藏/显示工具栏:<br/>true:&nbsp;隐藏工具栏。<br/>false:&nbsp;显示工具栏。 | | hideToolBar | boolean | false | 设置隐藏/显示工具栏:<br/>true:&nbsp;隐藏工具栏。<br/>false:&nbsp;显示工具栏。 |
| hideTitleBar | boolean | false | 隐藏标题栏。 | | hideTitleBar | boolean | false | 隐藏标题栏。 |
| hideBackButton | boolean | false | 隐藏返回键。 | | hideBackButton | boolean | false | 隐藏返回键。 |
......
...@@ -19,17 +19,18 @@ ...@@ -19,17 +19,18 @@
## 接口 ## 接口
Progress(options: {value: number, total?: number, type?: ProgressType}) Progress(options: {value: number, total?: number, style?: ProgressStyle, type?: ProgressType})
创建进度组件,用于显示内容加载或操作处理进度。 创建进度组件,用于显示内容加载或操作处理进度。
**参数:** **参数:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| ----- | ------------ | ---- | ------------------- | -------- | | ------ | ------------- | ---- | -------------------- | ---------------- |
| value | number | 是 | - | 指定当前进度值。 | | value | number | 是 | - | 指定当前进度值。 |
| total | number | 否 | 100 | 指定进度总长。 | | total | number | 否 | 100 | 指定进度总长。 |
| type | ProgressType | 否 | ProgressType.Linear | 指定进度条样式。 | | type | ProgressType | 否 | ProgressType.Linear | 指定进度条样式。 |
| style | ProgressStyle | 否 | ProgressStyle.Linear | 指定进度条样式。 |
## ProgressType枚举说明 ## ProgressType枚举说明
...@@ -41,13 +42,23 @@ Progress(options: {value: number, total?: number, type?: ProgressType}) ...@@ -41,13 +42,23 @@ Progress(options: {value: number, total?: number, type?: ProgressType})
| ScaleRing<sup>8+</sup> | 环形有刻度样式,类似时钟刻度形式加载进度。 | | ScaleRing<sup>8+</sup> | 环形有刻度样式,类似时钟刻度形式加载进度。 |
| Capsule<sup>8+</sup> | 胶囊样式,头尾两端处,进度条由弧形变成直线和直线变成弧形的过程;中段处,进度条正常往右走的过程。 | | Capsule<sup>8+</sup> | 胶囊样式,头尾两端处,进度条由弧形变成直线和直线变成弧形的过程;中段处,进度条正常往右走的过程。 |
## ProgressStyle枚举说明
| 名称 | 描述 |
| ---------------------- | ------------------------------------------------------------ |
| Linear | 线性样式。 |
| Ring<sup>8+</sup> | 环形无刻度样式,环形圆环逐渐填充完成过程。 |
| Eclipse | 圆形样式,展现类似月圆月缺的进度展示效果,从月牙逐渐到满月的这个过程代表了下载的进度。 |
| ScaleRing<sup>8+</sup> | 环形有刻度样式,类似时钟刻度形式加载进度。 |
| Capsule<sup>8+</sup> | 胶囊样式,头尾两端处,进度条由弧形变成直线和直线变成弧形的过程;中段处,进度条正常往右走的过程。 |
## 属性 ## 属性
| 名称 | 参数类型 | 默认值 | 描述 | | 名称 | 参数类型 | 默认值 | 描述 |
| ------------------ | ------------------------------------------------------------ | ------ | ------------------------------------------------------------ | | ------------------ | ------------------------------------------------------------ | ------ | ------------------------------------------------------------ |
| value | number | - | 设置当前进度值。 | | value | number | - | 设置当前进度值。 |
| color | [ResourceColor](ts-types.md#resourcecolor8) | - | 设置进度条前景色。 | | color | [ResourceColor](ts-types.md#resourcecolor8) | - | 设置进度条前景色。 |
| style<sup>8+</sup> | {<br/>strokeWidth?:&nbsp;Length,<br/>scaleCount?:&nbsp;number,<br/>scaleWidth?:&nbsp;Length<br/>} | - | 定义组件的样式。<br/>strokeWidth:&nbsp;设置进度条宽度。<br/>scaleCount:&nbsp;设置环形进度条总刻度数。<br/>scaleWidth:&nbsp;设置环形进度条刻度粗细。<br/>刻度粗细大于进度条宽度时,刻度粗细为系统默认粗细。 | | style<sup>8+</sup> | {<br/>strokeWidth?:&nbsp;[Length](ts-types.md#length),<br/>scaleCount?:&nbsp;number,<br/>scaleWidth?:&nbsp;[Length](ts-types.md#length)<br/>} | - | 定义组件的样式。<br/>strokeWidth:&nbsp;设置进度条宽度。<br/>scaleCount:&nbsp;设置环形进度条总刻度数。<br/>scaleWidth:&nbsp;设置环形进度条刻度粗细。<br/>刻度粗细大于进度条宽度时,刻度粗细为系统默认粗细。 |
## 示例 ## 示例
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
## 接口 ## 接口
Slider(options:{value?: number, min?: number, max?: number, step?: number, style?: SliderStyle, direction?: Axis, reverse?: boolean}) Slider(options?: {value?: number, min?: number, max?: number, step?: number, style?: SliderStyle, direction?: Axis, reverse?: boolean})
**参数:** **参数:**
......
...@@ -19,13 +19,13 @@ ...@@ -19,13 +19,13 @@
## 接口 ## 接口
Span(content: ResourceStr) Span(content: string | Resource)
**参数:** **参数:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| ------- | ------ | ---- | ---- | ----- | | ------- | ---------------------------------------- | ---- | ------ | ---------- |
| content | [ResourceStr](ts-types.md#resourcestr8) | 是 | - | 文本内容。 | | content | string\|[Resource](ts-types.md#resource) | 是 | - | 文本内容。 |
## 属性 ## 属性
...@@ -34,7 +34,7 @@ Span(content: ResourceStr) ...@@ -34,7 +34,7 @@ Span(content: ResourceStr)
| 名称 | 参数类型 | 默认值 | 描述 | | 名称 | 参数类型 | 默认值 | 描述 |
| ---------- | ---------------------------------------- | ---------------------------------------- | -------------- | | ---------- | ---------------------------------------- | ---------------------------------------- | -------------- |
| decoration | {<br/>type:&nbsp;[TextDecorationType](ts-appendix-enums.md#textdecorationtype枚举说明),<br/>color?:&nbsp;[ResourceColor](ts-types.md#resourcecolor8)<br/>} | {<br/>type:&nbsp;TextDecorationType.None<br/>color:Color.Black<br/>} | 设置文本装饰线样式及其颜色。 | | decoration | {<br/>type:&nbsp;[TextDecorationType](ts-appendix-enums.md#textdecorationtype枚举说明),<br/>color?:&nbsp;[ResourceColor](ts-types.md#resourcecolor8)<br/>} | {<br/>type:&nbsp;TextDecorationType.None<br/>color:Color.Black<br/>} | 设置文本装饰线样式及其颜色。 |
| letterSpacing | [Length](ts-types.md#length) | - | 设置文本字符间距。 | | letterSpacing | number\|string | - | 设置文本字符间距。 |
| textCase | [TextCase](ts-appendix-enums.md#textcase枚举说明) | Normal | 设置文本大小写。 | | textCase | [TextCase](ts-appendix-enums.md#textcase枚举说明) | Normal | 设置文本大小写。 |
......
...@@ -19,13 +19,13 @@ ...@@ -19,13 +19,13 @@
## 接口 ## 接口
Text(content?: ResourceStr) Text(content?: string | Resource)
**参数:** **参数:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| ------- | ------ | ---- | ---- | ---------------------------------------- | | ------- | ------------------------------------------ | ---- | ------ | ------------------------------------------------------------ |
| content | [ResourceStr](ts-types.md#resourcestr8) | 否 | '' | 文本内容。包含子组件Span时不生效,显示Span内容,并且此时text组件的样式不生效。 | | content | string \| [Resource](ts-types.md#resource) | 否 | '' | 文本内容。包含子组件Span时不生效,显示Span内容,并且此时text组件的样式不生效。 |
## 属性 ## 属性
...@@ -36,8 +36,8 @@ Text(content?: ResourceStr) ...@@ -36,8 +36,8 @@ Text(content?: ResourceStr)
| maxLines | number | Infinity | 设置文本的最大行数。 | | maxLines | number | Infinity | 设置文本的最大行数。 |
| lineHeight | string&nbsp;\|&nbsp;number&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | - | 设置文本的文本行高,设置值不大于0时,不限制文本行高,自适应字体大小,Length为number类型时单位为fp。 | | lineHeight | string&nbsp;\|&nbsp;number&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | - | 设置文本的文本行高,设置值不大于0时,不限制文本行高,自适应字体大小,Length为number类型时单位为fp。 |
| decoration | {<br/>type:&nbsp;[TextDecorationType](ts-appendix-enums.md#textdecorationtype),<br/>color?:&nbsp;[ResourceColor](ts-types.md#resourcecolor8)<br/>} | {<br/>type:&nbsp;TextDecorationType.None,<br/>color:Color.Black<br/>} | 设置文本装饰线样式及其颜色。 | | decoration | {<br/>type:&nbsp;[TextDecorationType](ts-appendix-enums.md#textdecorationtype),<br/>color?:&nbsp;[ResourceColor](ts-types.md#resourcecolor8)<br/>} | {<br/>type:&nbsp;TextDecorationType.None,<br/>color:Color.Black<br/>} | 设置文本装饰线样式及其颜色。 |
| baselineOffset | [Length](ts-types.md#length) | - | 设置文本基线的偏移量。 | | baselineOffset | number \| string | - | 设置文本基线的偏移量。 |
| letterSpacing | [Length](ts-types.md#length) | - | 设置文本字符间距。 | | letterSpacing | number \| string | - | 设置文本字符间距。 |
| minFontSize | number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | - | 设置文本最小显示字号。 | | minFontSize | number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | - | 设置文本最小显示字号。 |
| maxFontSize | number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | - | 设置文本最大显示字号。 | | maxFontSize | number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | - | 设置文本最大显示字号。 |
| textCase | [TextCase](ts-appendix-enums.md#textcase) | TextCase.Normal | 设置文本大小写。 | | textCase | [TextCase](ts-appendix-enums.md#textcase) | TextCase.Normal | 设置文本大小写。 |
......
...@@ -36,7 +36,7 @@ TextArea(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: Tex ...@@ -36,7 +36,7 @@ TextArea(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: Tex
| 名称 | 参数类型 | 默认值 | 描述 | | 名称 | 参数类型 | 默认值 | 描述 |
| ------------------------ | ------------------------------------------------------------ | ------ | ------------------------------------------------------------ | | ------------------------ | ------------------------------------------------------------ | ------ | ------------------------------------------------------------ |
| placeholderColor | [ResourceColor](ts-types.md#resourcecolor8) | - | 设置placeholder文本颜色。 | | placeholderColor | [ResourceColor](ts-types.md#resourcecolor8) | - | 设置placeholder文本颜色。 |
| placeholderFont | {<br/>size?:&nbsp;number,<br/>weight?:number&nbsp;\|&nbsp;[FontWeight](ts-universal-attributes-text-style.md),<br/>family?:&nbsp;string,<br/>style?:&nbsp;[FontStyle](ts-universal-attributes-text-style.md)<br/>} | - | 设置placeholder文本样式:<br/>-&nbsp;size:&nbsp;设置文本尺寸,Length为number类型时,使用fp单位。<br/>-&nbsp;weight:&nbsp;设置文本的字体粗细,number类型取值[100,&nbsp;900],取值间隔为100,默认为400,取值越大,字体越粗。<br/>-&nbsp;family:&nbsp;设置文本的字体列表。使用多个字体,使用','进行分割,优先级按顺序生效,例如:'Arial,&nbsp;sans-serif'。<br/>-&nbsp;style:&nbsp;设置文本的字体样式。 | | placeholderFont | [Font](ts-types.md#font) | - | 设置placeholder文本样式:<br/>-&nbsp;size:&nbsp;设置文本尺寸,Length为number类型时,使用fp单位。<br/>-&nbsp;weight:&nbsp;设置文本的字体粗细,number类型取值[100,&nbsp;900],取值间隔为100,默认为400,取值越大,字体越粗。<br/>-&nbsp;family:&nbsp;设置文本的字体列表。使用多个字体,使用','进行分割,优先级按顺序生效,例如:'Arial,&nbsp;sans-serif'。<br/>-&nbsp;style:&nbsp;设置文本的字体样式。 |
| textAlign | [TextAlign](ts-appendix-enums.md#textalign) | Start | 设置文本水平对齐方式。 | | textAlign | [TextAlign](ts-appendix-enums.md#textalign) | Start | 设置文本水平对齐方式。 |
| caretColor | [ResourceColor](ts-types.md#resourcecolor8) | - | 设置输入框光标颜色。 | | caretColor | [ResourceColor](ts-types.md#resourcecolor8) | - | 设置输入框光标颜色。 |
| inputFilter<sup>8+</sup> | {<br/>value:&nbsp;[ResourceStr](ts-types.md#resourcestr8)<sup>8+</sup>,<br/>error?:&nbsp;(value:&nbsp;string)&nbsp;=&gt;&nbsp;void<br/>} | - | 通过正则表达式设置输入过滤器。满足表达式的输入允许显示,不满足的输入被忽略。仅支持单个字符匹配,不支持字符串匹配。例如:^(?=.\*\d)(?=.\*[a-z])(?=.\*[A-Z]).{8,10}$,不支持过滤8到10位的强密码。<br/>-&nbsp;value:设置正则表达式。<br/>-&nbsp;error:正则匹配失败时,返回被忽略的内容。 | | inputFilter<sup>8+</sup> | {<br/>value:&nbsp;[ResourceStr](ts-types.md#resourcestr8)<sup>8+</sup>,<br/>error?:&nbsp;(value:&nbsp;string)&nbsp;=&gt;&nbsp;void<br/>} | - | 通过正则表达式设置输入过滤器。满足表达式的输入允许显示,不满足的输入被忽略。仅支持单个字符匹配,不支持字符串匹配。例如:^(?=.\*\d)(?=.\*[a-z])(?=.\*[A-Z]).{8,10}$,不支持过滤8到10位的强密码。<br/>-&nbsp;value:设置正则表达式。<br/>-&nbsp;error:正则匹配失败时,返回被忽略的内容。 |
......
...@@ -37,12 +37,11 @@ TextInput(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: Te ...@@ -37,12 +37,11 @@ TextInput(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: Te
| ----------------------------- | ------------------------------------------------------------ | ----------------- | ------------------------------------------------------------ | | ----------------------------- | ------------------------------------------------------------ | ----------------- | ------------------------------------------------------------ |
| type | InputType | InputType.Normal | 设置输入框类型。 | | type | InputType | InputType.Normal | 设置输入框类型。 |
| placeholderColor | [ResourceColor](ts-types.md#resourcecolor8) | - | 设置placeholder颜色。 | | placeholderColor | [ResourceColor](ts-types.md#resourcecolor8) | - | 设置placeholder颜色。 |
| placeholderFont | {<br/>size?:&nbsp;Length,<br/>weight?:&nbsp;number\|[FontWeight](ts-universal-attributes-text-style.md),<br/>family?:&nbsp;string,<br/>style?:&nbsp;[FontStyle](ts-universal-attributes-text-style.md)<br/>} | - | 设置placeholder文本样式:<br/>-&nbsp;size:&nbsp;设置文本尺寸,Length为number类型时,使用fp单位。<br/>-&nbsp;weight:&nbsp;设置文本的字体粗细,number类型取值[100,&nbsp;900],取值间隔为100,默认为400,取值越大,字体越粗。<br/>-&nbsp;family:&nbsp;设置文本的字体列表。使用多个字体,使用','进行分割,优先级按顺序生效。例如:'Arial,&nbsp;sans-serif'。<br/>-&nbsp;style:&nbsp;设置文本的字体样式。 | | placeholderFont | [Font](ts-types.md#font) | - | 设置placeholder文本样式:<br/>-&nbsp;size:&nbsp;设置文本尺寸,Length为number类型时,使用fp单位。<br/>-&nbsp;weight:&nbsp;设置文本的字体粗细,number类型取值[100,&nbsp;900],取值间隔为100,默认为400,取值越大,字体越粗。<br/>-&nbsp;family:&nbsp;设置文本的字体列表。使用多个字体,使用','进行分割,优先级按顺序生效。例如:'Arial,&nbsp;sans-serif'。<br/>-&nbsp;style:&nbsp;设置文本的字体样式。 |
| enterKeyType | EnterKeyType | EnterKeyType.Done | 设置输入法回车键类型。 | | enterKeyType | EnterKeyType | EnterKeyType.Done | 设置输入法回车键类型。 |
| caretColor | [ResourceColor](ts-types.md#resourcecolor8) | - | 设置输入框光标颜色。 | | caretColor | [ResourceColor](ts-types.md#resourcecolor8) | - | 设置输入框光标颜色。 |
| maxLength | number | - | 设置文本的最大输入字符数。 | | maxLength | number | - | 设置文本的最大输入字符数。 |
| inputFilter<sup>8+</sup> | {<br/>value:&nbsp;[ResourceStr](ts-types.md#resourcestr8)<sup>8+</sup>,<br/>error?:&nbsp;(value:&nbsp;string)&nbsp;=&gt;&nbsp;void<br/>} | - | 正则表达式,满足表达式的输入允许显示,不满足正则表达式的输入被忽略。仅支持单个字符匹配,不支持字符串匹配。例如:^(?=.\*\d)(?=.\*[a-z])(?=.\*[A-Z]).{8,10}$,8到10位的强密码不支持过滤。<br/>-&nbsp;value:设置正则表达式。<br/>-&nbsp;error:正则匹配失败时,返回被忽略的内容。 | | inputFilter<sup>8+</sup> | {<br/>value:&nbsp;[ResourceStr](ts-types.md#resourcestr8)<sup>8+</sup>,<br/>error?:&nbsp;(value:&nbsp;string)&nbsp;=&gt;&nbsp;void<br/>} | - | 正则表达式,满足表达式的输入允许显示,不满足正则表达式的输入被忽略。仅支持单个字符匹配,不支持字符串匹配。例如:^(?=.\*\d)(?=.\*[a-z])(?=.\*[A-Z]).{8,10}$,8到10位的强密码不支持过滤。<br/>-&nbsp;value:设置正则表达式。<br/>-&nbsp;error:正则匹配失败时,返回被忽略的内容。 |
| showPasswordIcon<sup>9+</sup> | boolean | true | 密码输入模式时,密码框末尾的图标是否显示。 |
## EnterKeyType枚举说明 ## EnterKeyType枚举说明
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
## 接口 ## 接口
TextPicker(options: {range: string[]|Resource, selected?: number, value?: string}) TextPicker(options?: {range: string[]|Resource, selected?: number, value?: string})
根据range指定的选择范围创建文本选择器。 根据range指定的选择范围创建文本选择器。
...@@ -34,8 +34,8 @@ TextPicker(options: {range: string[]|Resource, selected?: number, value?: string ...@@ -34,8 +34,8 @@ TextPicker(options: {range: string[]|Resource, selected?: number, value?: string
## 属性 ## 属性
| 名称 | 参数类型 | 默认值 | 描述 | | 名称 | 参数类型 | 默认值 | 描述 |
| ----------------------- | ------ | ---- | ---------------- | | ----------------------- | -------------- | ------ | -------------------------- |
| defaultPickerItemHeight | Length | - | 默认Picker内容项元素高度。 | | defaultPickerItemHeight | number\|string | - | 默认Picker内容项元素高度。 |
## 事件 ## 事件
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
## 接口 ## 接口
TextTimer(options: { isCountDown?: boolean, count?: number, controller?: TextTimerController }) TextTimer(options?: { isCountDown?: boolean, count?: number, controller?: TextTimerController })
**参数:** **参数:**
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
## 接口 ## 接口
TimePicker(options?: TimePickerOptions) TimePicker( options?: { selected?: Data })
默认以00:00至23:59的时间区间创建滑动选择器。 默认以00:00至23:59的时间区间创建滑动选择器。
......
...@@ -85,7 +85,7 @@ destroy(name: string): void ...@@ -85,7 +85,7 @@ destroy(name: string): void
path: this.animatePath, path: this.animatePath,
}) })
}) })
// @ts-ignore
Animator('__lottie_ets') // declare Animator('__lottie_ets') when use lottie Animator('__lottie_ets') // declare Animator('__lottie_ets') when use lottie
Button('load animation') Button('load animation')
.onClick(() => { .onClick(() => {
......
...@@ -40,8 +40,10 @@ AlphabetIndexer(value: {arrayValue: Array&lt;string&gt;, selected: number}) ...@@ -40,8 +40,10 @@ AlphabetIndexer(value: {arrayValue: Array&lt;string&gt;, selected: number})
| selectedFont | [Font](ts-types.md#font) | 设置选中项文字样式。 | | selectedFont | [Font](ts-types.md#font) | 设置选中项文字样式。 |
| popupFont | [Font](ts-types.md#font) | 设置提示弹窗字体样式。 | | popupFont | [Font](ts-types.md#font) | 设置提示弹窗字体样式。 |
| font | [Font](ts-types.md#font) | 设置字母索引条默认字体样式。 | | font | [Font](ts-types.md#font) | 设置字母索引条默认字体样式。 |
| itemSize | Length | 设置字母索引条字母区域大小,字母区域为正方形,即正方形边长。 | | itemSize | string \| number | 设置字母索引条字母区域大小,字母区域为正方形,即正方形边长。 |
| alignStyle | IndexerAlign | 设置提示弹窗的弹出位置。 | | alignStyle | IndexerAlign | 设置提示弹窗的弹出位置。 |
| selected | number | 设置选中项索引值。 |
| popupPosition | {<br/>x?:[Length](ts-types.md#length)<br/>y?:[Length](ts-types.md#length)<br/>} | 设置弹出窗口相对于索引器条上边框中点的位置。 |
## IndexerAlign枚举说明 ## IndexerAlign枚举说明
......
...@@ -19,13 +19,13 @@ ...@@ -19,13 +19,13 @@
## 接口 ## 接口
Column(value?:{space?: Length}) Column(value?:{space?: string | number})
**参数:** **参数:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| ----- | ------ | ---- | ---- | --------- | | ------ | -------------- | ---- | ------ | ------------------ |
| space | Length | 否 | 0 | 纵向布局元素间距。 | | space | string\|number | 否 | 0 | 纵向布局元素间距。 |
## 属性 ## 属性
......
...@@ -37,8 +37,8 @@ Grid(scroller?: Scroller) ...@@ -37,8 +37,8 @@ Grid(scroller?: Scroller)
| columnsGap | Length | 0 | 用于设置列与列的间距。 | | columnsGap | Length | 0 | 用于设置列与列的间距。 |
| rowsGap | Length | 0 | 用于设置行与行的间距。 | | rowsGap | Length | 0 | 用于设置行与行的间距。 |
| scrollBar | [BarState](ts-appendix-enums.md#barstate) | BarState.Off | 设置滚动条状态。 | | scrollBar | [BarState](ts-appendix-enums.md#barstate) | BarState.Off | 设置滚动条状态。 |
| scrollBarColor | string&nbsp;\|&nbsp;number&nbsp;\|&nbsp;Color | - | 设置滚动条的颜色。 | | scrollBarColor | string&nbsp;\|&nbsp;number&nbsp;\|&nbsp;[Color](ts-appendix-enums.md#color) | - | 设置滚动条的颜色。 |
| scrollBarWidth | Length | - | 设置滚动条的宽度。 | | scrollBarWidth | string&nbsp;\|&nbsp;number | - | 设置滚动条的宽度。 |
| cachedCount | number | 1 | 设置预加载的GridItem的数量。 | | cachedCount | number | 1 | 设置预加载的GridItem的数量。 |
| editMode <sup>8+</sup> | boolean | flase | 是否进入编辑模式,进入编辑模式可以拖拽Grid组件内部[GridItem](ts-container-griditem.md)。 | | editMode <sup>8+</sup> | boolean | flase | 是否进入编辑模式,进入编辑模式可以拖拽Grid组件内部[GridItem](ts-container-griditem.md)。 |
| layoutDirection<sup>8+</sup> | GridDirection | GridDirection.Row | 设置布局的主轴方向。 | | layoutDirection<sup>8+</sup> | GridDirection | GridDirection.Row | 设置布局的主轴方向。 |
......
...@@ -19,13 +19,13 @@ ...@@ -19,13 +19,13 @@
## 接口 ## 接口
GridContainer(options?: { columns?: number | 'auto', sizeType?: SizeType, gutter?: Length, margin?: Length}) GridContainer(options?: { columns?: number | auto, sizeType?: SizeType, gutter?: string|number, margin?: string|number})
**参数:** **参数:**
| 参数名 | 类型 | 必填 | 默认值 | 说明 | | 参数名 | 类型 | 必填 | 默认值 | 说明 |
| -------- | -------------------------- | ---- | ------------- | ---------- | | -------- | ------------------------ | ---- | ------------- | -------------------- |
| columns | number&nbsp;\|&nbsp;'auto' | 否 | 'auto' | 设置当前布局总列数。 | | columns | number&nbsp;\|&nbsp;auto | 否 | auto | 设置当前布局总列数。 |
| sizeType | SizeType | 否 | SizeType.Auto | 选用设备宽度类型。 | | sizeType | SizeType | 否 | SizeType.Auto | 选用设备宽度类型。 |
| gutter | Length | 否 | - | 栅格布局列间距。 | | gutter | Length | 否 | - | 栅格布局列间距。 |
| margin | Length | 否 | - | 栅格布局两侧间距。 | | margin | Length | 否 | - | 栅格布局两侧间距。 |
......
...@@ -21,13 +21,13 @@ ...@@ -21,13 +21,13 @@
## 接口 ## 接口
List(value:{space?: number | string, initialIndex?: number, scroller?: Scroller}) List(value?:{space?: number | string, initialIndex?: number, scroller?: Scroller})
**参数:** **参数:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| ------------ | ------ | ---- | ---- | ---------------------------------------- | | ------------ | ------ | ---- | ---- | ---------------------------------------- |
| space | Length | 否 | 0 | 列表项间距。 | | space | number&nbsp;\|&nbsp;string | 否 | 0 | 列表项间距。 |
| initialIndex | number | 否 | 0 | 设置当前List初次加载时视口起始位置显示的item,即显示第一个item,如设置的序号超过了最后一个item的序号,则设置不生效。 | | initialIndex | number | 否 | 0 | 设置当前List初次加载时视口起始位置显示的item,即显示第一个item,如设置的序号超过了最后一个item的序号,则设置不生效。 |
| scroller | [Scroller](ts-container-scroll.md#scroller) | 否 | - | 可滚动组件的控制器。用于与可滚动组件进行绑定。 | | scroller | [Scroller](ts-container-scroll.md#scroller) | 否 | - | 可滚动组件的控制器。用于与可滚动组件进行绑定。 |
...@@ -36,14 +36,13 @@ List(value:{space?: number | string, initialIndex?: number, scroller?: Scroller} ...@@ -36,14 +36,13 @@ List(value:{space?: number | string, initialIndex?: number, scroller?: Scroller}
| 名称 | 参数类型 | 默认值 | 描述 | | 名称 | 参数类型 | 默认值 | 描述 |
| ---------------------------- | ---------------------------------------- | ----------------- | ---------------------------------------- | | ---------------------------- | ---------------------------------------- | ----------------- | ---------------------------------------- |
| listDirection | [Axis](ts-appendix-enums.md#axis) | Vertical | 设置List组件排列方向参照Axis枚举说明。 | | listDirection | [Axis](ts-appendix-enums.md#axis) | Vertical | 设置List组件排列方向参照Axis枚举说明。 |
| divider | {<br/>strokeWidth:&nbsp;Length,<br/>color?:[ResourceColor](ts-types.md#resourcecolor8),<br/>startMargin?:&nbsp;Length,<br/>endMargin?:&nbsp;Length<br/>} | - | 用于设置ListItem分割线样式,默认无分割线。<br/>strokeWidth:&nbsp;分割线的线宽。<br/>color:&nbsp;分割线的颜色。<br/>startMargin:&nbsp;分割线距离列表侧边起始端的距离。<br/>endMargin:&nbsp;分割线距离列表侧边结束端的距离。 | | divider | {<br/>strokeWidth:&nbsp;[Length](ts-types.md#length),<br/>color?: [ResourceColor](ts-types.md#resourcecolor8),<br/>startMargin?:&nbsp;[Length](ts-types.md#length),<br/>endMargin?:&nbsp;[Length](ts-types.md#length)<br/>}&nbsp;\|&nbsp;null | - | 用于设置ListItem分割线样式,默认无分割线。<br/>strokeWidth:&nbsp;分割线的线宽。<br/>color:&nbsp;分割线的颜色。<br/>startMargin:&nbsp;分割线距离列表侧边起始端的距离。<br/>endMargin:&nbsp;分割线距离列表侧边结束端的距离。 |
| scrollBar | [BarState](ts-appendix-enums.md#barstate) | BarState.Off | 设置滚动条状态。 | | scrollBar | [BarState](ts-appendix-enums.md#barstate) | BarState.Off | 设置滚动条状态。 |
| cachedCount | number | 1 | 设置预加载的ListItem的数量。 | | cachedCount | number | 1 | 设置预加载的ListItem的数量。 |
| editMode | boolean | false | 声明当前List组件是否处于可编辑模式。 | | editMode | boolean | false | 声明当前List组件是否处于可编辑模式。 |
| edgeEffect | [EdgeEffect](ts-appendix-enums.md#edgeeffect) | EdgeEffect.Spring | 滑动效果,目前支持的滑动效果参见EdgeEffect的枚举说明。 | | edgeEffect | [EdgeEffect](ts-appendix-enums.md#edgeeffect) | EdgeEffect.Spring | 滑动效果,目前支持的滑动效果参见EdgeEffect的枚举说明。 |
| chainAnimation | boolean | false | 用于设置当前list是否启用链式联动动效,开启后列表滑动以及顶部和底部拖拽时会有链式联动的效果。链式联动效果:list内的list-item间隔一定距离,在基本的滑动交互行为下,主动对象驱动从动对象进行联动,驱动效果遵循弹簧物理动效。<br/>-&nbsp;false:不启用链式联动。<br/>-&nbsp;true:启用链式联动。 | | chainAnimation | boolean | false | 用于设置当前list是否启用链式联动动效,开启后列表滑动以及顶部和底部拖拽时会有链式联动的效果。链式联动效果:list内的list-item间隔一定距离,在基本的滑动交互行为下,主动对象驱动从动对象进行联动,驱动效果遵循弹簧物理动效。<br/>-&nbsp;false:不启用链式联动。<br/>-&nbsp;true:启用链式联动。 |
| multiSelectable<sup>8+</sup> | boolean | false | 是否开启鼠标框选。<br/>-&nbsp;false:关闭框选。<br/>-&nbsp;true:开启框选。 | | multiSelectable<sup>8+</sup> | boolean | false | 是否开启鼠标框选。<br/>-&nbsp;false:关闭框选。<br/>-&nbsp;true:开启框选。 |
| restoreId<sup>8+</sup> | number | - | 组件迁移标识符,标识后的组件在应用迁移时,组件状态会被迁移到被拉起方的同标识组件。<br/>列表组件状态,包括起始位置显示的item序号。 |
## 事件 ## 事件
...@@ -57,7 +56,7 @@ List(value:{space?: number | string, initialIndex?: number, scroller?: Scroller} ...@@ -57,7 +56,7 @@ List(value:{space?: number | string, initialIndex?: number, scroller?: Scroller}
| onReachEnd(event: () => void) | 列表到底末尾位置时触发。 | | onReachEnd(event: () => void) | 列表到底末尾位置时触发。 |
| onScrollStop(event: () => void) | 列表滑动停止时触发。 | | onScrollStop(event: () => void) | 列表滑动停止时触发。 |
| onItemMove(event: (from: number, to: number) => boolean) | 列表元素发生移动时触发,返回值from、to分别为移动前索引值与移动后索引值。 | | onItemMove(event: (from: number, to: number) => boolean) | 列表元素发生移动时触发,返回值from、to分别为移动前索引值与移动后索引值。 |
| onItemDragStart(event: (event: ItemDragInfo, itemIndex: number) => (() => any) \| void) | 开始拖拽列表元素时触发,返回值event见ItemDragInfo对象说明,itemIndex为被拖拽列表元素索引值。 | | onItemDragStart(event: (event: ItemDragInfo, itemIndex: number) => ((() => any) \| void)) | 开始拖拽列表元素时触发,返回值event见ItemDragInfo对象说明,itemIndex为被拖拽列表元素索引值。 |
| onItemDragEnter(event: (event: ItemDragInfo) => void) | 拖拽进入列表元素范围内时触发,返回值event见ItemDragInfo对象说明。 | | onItemDragEnter(event: (event: ItemDragInfo) => void) | 拖拽进入列表元素范围内时触发,返回值event见ItemDragInfo对象说明。 |
| onItemDragMove(event: (event: ItemDragInfo, itemIndex: number, insertIndex: number) => void) | 拖拽在列表元素范围内移动时触发,返回值event见ItemDragInfo对象说明,itemIndex为拖拽起始位置,insertIndex为拖拽插入位置。 | | onItemDragMove(event: (event: ItemDragInfo, itemIndex: number, insertIndex: number) => void) | 拖拽在列表元素范围内移动时触发,返回值event见ItemDragInfo对象说明,itemIndex为拖拽起始位置,insertIndex为拖拽插入位置。 |
| onItemDragLeave(event: (event: ItemDragInfo, itemIndex: number) => void) | 拖拽离开列表元素时触发,返回值event见ItemDragInfo对象说明,itemIndex为拖拽离开的列表元素索引值。 | | onItemDragLeave(event: (event: ItemDragInfo, itemIndex: number) => void) | 拖拽离开列表元素时触发,返回值event见ItemDragInfo对象说明,itemIndex为拖拽离开的列表元素索引值。 |
......
...@@ -41,9 +41,9 @@ Navigator(value?: {target: string, type?: NavigationType}) ...@@ -41,9 +41,9 @@ Navigator(value?: {target: string, type?: NavigationType})
## 属性 ## 属性
| 名称 | 参数 | 默认值 | 描述 | | 名称 | 参数 | 默认值 | 描述 |
| ------ | ------- | --------- | ---------------------------------------- | | ------ | ------- | --------- | ------------------------------------------------------------ |
| active | boolean | - | 当前路由组件是否处于激活状态,处于激活状态时,会生效相应的路由操作。 | | active | boolean | - | 当前路由组件是否处于激活状态,处于激活状态时,会生效相应的路由操作。 |
| params | Object | undefined | 跳转时要同时传递到目标页面的数据,可在目标页面使用router.getParams()获得。 | | params | object | undefined | 跳转时要同时传递到目标页面的数据,可在目标页面使用router.getParams()获得。 |
## 示例 ## 示例
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
## 接口 ## 接口
Panel(value:{show:boolean}) Panel(show:boolean)
**参数:** **参数:**
...@@ -30,13 +30,13 @@ Panel(value:{show:boolean}) ...@@ -30,13 +30,13 @@ Panel(value:{show:boolean})
## 属性 ## 属性
| 名称 | 参数类型 | 默认值 | 描述 | | 名称 | 参数类型 | 默认值 | 描述 |
| ---------- | --------- | ------------------ | ---------------------------------- | | ---------- | -------------- | ------------------ | ------------------------------------------------------ |
| type | PanelType | PanelType.Foldable | 设置可滑动面板的类型。 | | type | PanelType | PanelType.Foldable | 设置可滑动面板的类型。 |
| mode | PanelMode | - | 设置可滑动面板的初始状态。 | | mode | PanelMode | - | 设置可滑动面板的初始状态。 |
| dragBar | boolean | true | 设置是否存在dragbar,true表示存在,false表示不存在。 | | dragBar | boolean | true | 设置是否存在dragbar,true表示存在,false表示不存在。 |
| fullHeight | Length | - | 指定PanelMode.Full状态下的高度。 | | fullHeight | number\|string | - | 指定PanelMode.Full状态下的高度。 |
| halfHeight | Length | - | 指定PanelMode.Half状态下的高度,默认为屏幕尺寸的一半。 | | halfHeight | number\|string | - | 指定PanelMode.Half状态下的高度,默认为屏幕尺寸的一半。 |
| miniHeight | Length | - | 指定PanelMode.Mini状态下的高度。 | | miniHeight | number\|string | - | 指定PanelMode.Mini状态下的高度。 |
## PanelType枚举说明 ## PanelType枚举说明
...@@ -57,8 +57,8 @@ Panel(value:{show:boolean}) ...@@ -57,8 +57,8 @@ Panel(value:{show:boolean})
## 事件 ## 事件
| 名称 | 功能描述 | | 名称 | 功能描述 |
| ---------------------------------------- | ---------------------------------------- | | ------------------------------------------------------------ | ------------------------------------------------------------ |
| onChange(callback:&nbsp;(width:&nbsp;number,&nbsp;height:&nbsp;number,&nbsp;mode:&nbsp;PanelMode)&nbsp;=&gt;&nbsp;void) | 当可滑动面板发生状态变化时触发,&nbsp;返回的height值为内容区高度值,当dragbar属性为true时,panel本身的高度值为dragbar高度加上内容区高度。 | | onChange(event:&nbsp;(width:&nbsp;number,&nbsp;height:&nbsp;number,&nbsp;mode:&nbsp;PanelMode)&nbsp;=&gt;&nbsp;void) | 当可滑动面板发生状态变化时触发,&nbsp;返回的height值为内容区高度值,当dragbar属性为true时,panel本身的高度值为dragbar高度加上内容区高度。 |
## 示例 ## 示例
......
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
## 接口 ## 接口
Refresh\(value: \{refreshing: boolean, offset?: Length, friction?: number | string\}\) Refresh\(value: \{refreshing: boolean, offset?: number | string, friction?: number | string\}\)
**参数:** **参数:**
......
...@@ -19,13 +19,13 @@ ...@@ -19,13 +19,13 @@
## 接口 ## 接口
Row(value?:{space?: Length}) Row(value?:{space?: string&nbsp;|&nbsp;number })
**参数:** **参数:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| ----- | ------ | ---- | ---- | --------- | | ------ | -------------------------- | ---- | ------ | ------------------ |
| space | Length | 否 | 0 | 横向布局元素间距。 | | space | string&nbsp;\|&nbsp;number | 否 | 0 | 横向布局元素间距。 |
## 属性 ## 属性
......
...@@ -30,8 +30,8 @@ Scroll(scroller?: Scroller) ...@@ -30,8 +30,8 @@ Scroll(scroller?: Scroller)
| scrollable | ScrollDirection | ScrollDirection.Vertical | 设置滚动方法。 | | scrollable | ScrollDirection | ScrollDirection.Vertical | 设置滚动方法。 |
| scrollBar | [BarState](ts-appendix-enums.md#barstate) | BarState.Off | 设置滚动条状态。 | | scrollBar | [BarState](ts-appendix-enums.md#barstate) | BarState.Off | 设置滚动条状态。 |
| scrollBarColor | string&nbsp;\|&nbsp;number&nbsp;\|&nbsp;Color | - | 设置滚动条的颜色。 | | scrollBarColor | string&nbsp;\|&nbsp;number&nbsp;\|&nbsp;Color | - | 设置滚动条的颜色。 |
| scrollBarWidth | Length | - | 设置滚动条的宽度。 | | scrollBarWidth | string&nbsp;\|&nbsp;number | - | 设置滚动条的宽度。 |
| edgeEffect | EdgeEffect | EdgeEffect.Spring | 设置滑动效果,目前支持的滑动效果参见EdgeEffect的枚举说明。 | | edgeEffect | [EdgeEffect](ts-appendix-enums.md#edgeeffect) | EdgeEffect.Spring | 设置滑动效果,目前支持的滑动效果参见EdgeEffect的枚举说明。 |
## ScrollDirection枚举说明 ## ScrollDirection枚举说明
...@@ -41,14 +41,6 @@ Scroll(scroller?: Scroller) ...@@ -41,14 +41,6 @@ Scroll(scroller?: Scroller)
| Vertical | 仅支持竖直方向滚动。 | | Vertical | 仅支持竖直方向滚动。 |
| None | 不可滚动。 | | None | 不可滚动。 |
## EdgeEffect枚举说明
| 名称 | 描述 |
| ------ | ---------------------------------------- |
| Spring | 弹性物理动效,滑动到边缘后可以根据初始速度或通过触摸事件继续滑动一段距离,松手后回弹。 |
| Fade | 阴影效果,滑动到边缘后会有圆弧状的阴影。 |
| None | 滑动到边缘后无效果。 |
## 事件 ## 事件
| 名称 | 功能描述 | | 名称 | 功能描述 |
...@@ -79,30 +71,18 @@ scrollTo(value: { xOffset: number | string, yOffset: number | string, animation? ...@@ -79,30 +71,18 @@ scrollTo(value: { xOffset: number | string, yOffset: number | string, animation?
**参数:** **参数:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| --------- | ---------------------------------------- | ---- | ---- | ---------------------------------------- | | --------- | ------------------------------------------------------------ | ---- | ------ | ------------------------------------------------------------ |
| xOffset | Length | 是 | - | 水平滑动偏移。 | | xOffset | number&nbsp;\|&nbsp;string | 是 | - | 水平滑动偏移。 |
| yOffset | Length | 是 | - | 竖直滑动偏移。 | | yOffset | number&nbsp;\|&nbsp;string | 是 | - | 竖直滑动偏移。 |
| animation | {<br/>duration:&nbsp;number,<br/>curve:&nbsp;[Curve](ts-animatorproperty.md)&nbsp;\|<br/>CubicBezier&nbsp;\|<br/>SpringCurve<br/>} | 否 | | 动画配置:<br/>-&nbsp;duration:&nbsp;滚动时长设置。<br/>-&nbsp;curve:&nbsp;滚动曲线设置。 | | animation | {<br/>duration:&nbsp;number,<br/>curve:&nbsp;[Curve](ts-animatorproperty.md)&nbsp;<br/>} | 否 | | 动画配置:<br/>-&nbsp;duration:&nbsp;滚动时长设置。<br/>-&nbsp;curve:&nbsp;滚动曲线设置。 |
### scrollEdge ### scrollEdge
scrollEdge(value: Edge): void scrollEdge(value: [Edge](ts-appendix-enums.md#edge)): void
滚动到容器边缘。 滚动到容器边缘。
## Edge枚举说明
| 名称 | 描述 |
| ----- | ---- |
| Top | 竖直方向上边缘 |
| Center | 竖直方向居中位置 |
| Bottom | 竖直方向下边缘 |
| Baseline | 交叉轴方向文本基线位置 |
| Start | 水平方向起始位置 |
| Middle | 水平方向居中位置 |
| End | 水平方向末尾位置 |
### scrollPage ### scrollPage
scrollPage(value: { next: boolean, direction?: Axis }): void scrollPage(value: { next: boolean, direction?: Axis }): void
...@@ -118,17 +98,11 @@ scrollPage(value: { next: boolean, direction?: Axis }): void ...@@ -118,17 +98,11 @@ scrollPage(value: { next: boolean, direction?: Axis }): void
### currentOffset ### currentOffset
currentOffset(): Object currentOffset()
返回当前的滚动偏移量。 返回当前的滚动偏移量。
**返回值:**
| 类型 | 描述 |
| ---------------------------------------- | ---------------------------------------- |
| {<br/>xOffset:&nbsp;number,<br/>yOffset:&nbsp;number<br/>} | xOffset:&nbsp;水平滑动偏移;<br/>yOffset:&nbsp;竖直滑动偏移。 |
### scrollToIndex ### scrollToIndex
scrollToIndex(value: number): void scrollToIndex(value: number): void
......
...@@ -60,8 +60,8 @@ SideBarContainer( type?: SideBarContainerType ) ...@@ -60,8 +60,8 @@ SideBarContainer( type?: SideBarContainerType )
## 事件 ## 事件
| 名称 | 功能描述 | | 名称 | 功能描述 |
| ---------------------------------------- | ---------------------------------------- | | ------------------------------------- | ------------------------------------------------------------ |
| onChange(callback: (value: boolen) =&gt; void) | 当侧边栏的状态在显示和隐藏之间切换时触发回调。<p> value的true表示显示,false表示隐藏。 | | onChange(callback: boolen) =&gt; void | 当侧边栏的状态在显示和隐藏之间切换时触发回调。<p> true表示显示,false表示隐藏。 |
## 示例 ## 示例
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
## 接口 ## 接口
Stack(value:{alignContent?: Alignment}) Stack(value?: {alignContent?: Alignment})
**参数:** **参数:**
......
# Swiper # Swiper
滑动容器,提供切换子组件显示的能力。
> **说明:** > **说明:**
> >
> 该组件从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 > 该组件从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
滑动容器,提供切换子组件显示的能力。
## 权限列表 ## 权限列表
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
## 接口 ## 接口
Swiper(value:{controller?: SwiperController}) Swiper(value?:{controller?: SwiperController})
**参数:** **参数:**
...@@ -33,24 +33,23 @@ Swiper(value:{controller?: SwiperController}) ...@@ -33,24 +33,23 @@ Swiper(value:{controller?: SwiperController})
不支持[Menu控制](ts-universal-attributes-menu.md) 不支持[Menu控制](ts-universal-attributes-menu.md)
| 名称 | 参数类型 | 描述 | | 名称 | 参数类型 | 默认值 | 描述 |
| --------------------------- | ---------------------------------------- | ---------------------------------------- | | --------------------------- | ---------------------------------------- | ---------- | ---------------------------------------- |
| index | number | 设置当前在容器中显示的子组件的索引值。<br/>默认值:0 | | index | number | 0 | 设置当前在容器中显示的子组件的索引值。 |
| autoPlay | boolean | 子组件是否自动播放,自动播放状态下,导航点不可操作。<br/>默认值:false | | autoPlay | boolean | false | 子组件是否自动播放,自动播放状态下,导航点不可操作。 |
| interval | number | 使用自动播放时播放的时间间隔,单位为毫秒。<br/>默认值:3000 | | interval | number | 3000 | 使用自动播放时播放的时间间隔,单位为毫秒。 |
| indicator | boolean | 是否启用导航点指示器。<br/>默认值:true | | indicator | boolean | true | 是否启用导航点指示器。 |
| loop | boolean | 是否开启循环。<br>设置为true时表示开启循环,在LazyForEach懒循环加载模式下,加载的组件数量建议大于5个。<br/>默认值:true | | loop | boolean | true | 是否开启循环。<br> 设置为true时表示开启循环,在LazyForEach懒循环加载模式下,加载的组件数量建议大于5个。 |
| duration | number | 子组件切换的动画时长,单位为毫秒。<br/>默认值:400 | | duration | number | 400 | 子组件切换的动画时长,单位为毫秒。 |
| vertical | boolean | 是否为纵向滑动。<br/>默认值:false | | vertical | boolean | false | 是否为纵向滑动。 |
| itemSpace | Length | 设置子组件与子组件之间间隙。<br/>默认值:0 | | itemSpace | number&nbsp;\|&nbsp;string | 0 | 设置子组件与子组件之间间隙。 |
| displayMode | SwiperDisplayMode | 主轴方向上元素排列的模式,优先以displayCount设置的个数显示,displayCount未设置时本属性生效。<br/>默认值:SwiperDisplayMode.Stretch | | displayMode | SwiperDisplayMode | SwiperDisplayMode.Stretch | 设置子组件显示模式。 |
| cachedCount<sup>8+</sup> | number | 设置预加载子组件个数。<br/>默认值:1 | | cachedCount<sup>8+</sup> | number | 1 | 设置预加载子组件个数。 |
| disableSwipe<sup>8+</sup> | boolean | 禁用组件滑动切换功能。<br/>默认值:false | | disableSwipe<sup>8+</sup> | boolean | false | 禁用组件滑动切换功能。 |
| curve<sup>8+</sup> | [Curve](ts-animatorproperty.md#Curve枚举说明) \| string | 设置Swiper的动画曲线,默认为淡入淡出曲线,常用曲线参考[Curve枚举说明](ts-animatorproperty.md#Curve枚举说明),也可以通过插值计算模块提供的接口创建自定义的Curves([插值曲线对象](ts-interpolation-calculation.md))。<br/>默认值:Curve.Ease | | displayCount<sup>8+</sup> | number&nbsp;\|&nbsp;string | 1 | 设置一页中显示子组件的个数,设置为“auto”时等同于SwiperDisplayMode.AutoLinear的显示效果。 |
| 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;设置选中的导航点的颜色。 | | effectMode<sup>8+</sup> | EdgeEffect | EdgeEffect.Spring | 设置滑动到边缘时的显示效果。 |
| displayCount<sup>8+</sup> | number\|string | 设置元素显示个数。<br/>默认值:1 | | curve<sup>8+</sup> | [Curve](ts-appendix-enums.md#curve) \| string | Curve.Ease | 设置Swiper的动画曲线,默认为淡入淡出曲线,常用曲线参考[Curve枚举说明](ts-appendix-enums.md#curve),也可以通过插值计算模块提供的接口创建自定义的Curves([插值曲线对象](ts-interpolation-calculation.md))。 |
| effectMode<sup>8+</sup> | EdgeEffect | 滑动效果,目前支持的滑动效果参见EdgeEffect的枚举说明。<br/>默认值:EdgeEffect.Spring | | indicatorStyle<sup>8+</sup> | {<br/>left?:&nbsp;[Length](ts-types.md#length),<br/>top?:&nbsp;[Length](ts-types.md#length),<br/>right?:&nbsp;[Length](ts-types.md#length),<br/>bottom?:&nbsp;[Length](ts-types.md#length),<br/>size?:&nbsp;[Length](ts-types.md#length),<br/>mask?:&nbsp;boolean,<br/>color?:&nbsp;[ResourceColor](ts-types.md#resourcecolor8),<br/>selectedColor?:&nbsp;[ResourceColor](ts-types.md#resourcecolor8)<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;mask:&nbsp;设置是否显示导航点蒙层样式。<br/>-&nbsp;color:&nbsp;设置导航点的颜色。<br/>-&nbsp;selectedColor:&nbsp;设置选中的导航点的颜色。 |
## SwiperDisplayMode枚举说明 ## SwiperDisplayMode枚举说明
| 名称 | 描述 | | 名称 | 描述 |
......
...@@ -28,7 +28,7 @@ TabContent() ...@@ -28,7 +28,7 @@ TabContent()
| 名称 | 参数类型 | 默认值 | 描述 | | 名称 | 参数类型 | 默认值 | 描述 |
| ------ | ------------------------------------------------------------ | ------ | ------------------------------------------------------------ | | ------ | ------------------------------------------------------------ | ------ | ------------------------------------------------------------ |
| tabBar | string&nbsp;\|&nbsp;Resource&nbsp;\|&nbsp;{<br/>icon?:&nbsp;string&nbsp;\|&nbsp;Resource,<br/>text?:&nbsp;string&nbsp;\|&nbsp;Resource<br/>}<br/>\|&nbsp;[CustomBuilder](ts-types.md#custombuilder8)<sup>8+</sup> | - | 设置TabBar上显示内容。<br/>CustomBuilder:&nbsp;构造器,内部可以传入组件(API8版本以上适用)。<br/>>&nbsp;&nbsp;**说明:**<br/>>&nbsp;如果icon采用svg格式图源,则要求svg图源删除其自有宽高属性值。如采用带有自有宽高属性的svg图源,icon大小则是svg本身内置的宽高属性值大小。 | | tabBar | string&nbsp;\|&nbsp;[Resource](ts-types.md#resource)&nbsp;\|&nbsp;{<br/>icon?:&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>text?:&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource)<br/>}<br/>\|&nbsp;[CustomBuilder](ts-types.md#custombuilder8)<sup>8+</sup> | - | 设置TabBar上显示内容。<br/>CustomBuilder:&nbsp;构造器,内部可以传入组件(API8版本以上适用)。<br/>>&nbsp;&nbsp;**说明:**<br/>>&nbsp;如果icon采用svg格式图源,则要求svg图源删除其自有宽高属性值。如采用带有自有宽高属性的svg图源,icon大小则是svg本身内置的宽高属性值大小。 |
> **说明:** > **说明:**
> - TabContent组件不支持设置通用宽度属性,其宽度默认撑满Tabs父组件。 > - TabContent组件不支持设置通用宽度属性,其宽度默认撑满Tabs父组件。
......
...@@ -45,8 +45,8 @@ Tabs(value: {barPosition?: BarPosition, index?: number, controller?: [TabsContro ...@@ -45,8 +45,8 @@ Tabs(value: {barPosition?: BarPosition, index?: number, controller?: [TabsContro
| vertical | boolean | false | 设置为false是为横向Tabs,设置为true时为纵向Tabs。 | | vertical | boolean | false | 设置为false是为横向Tabs,设置为true时为纵向Tabs。 |
| scrollable | boolean | true | 设置为true时可以通过滑动页面进行页面切换,为false时不可滑动切换页面。 | | scrollable | boolean | true | 设置为true时可以通过滑动页面进行页面切换,为false时不可滑动切换页面。 |
| barMode | BarMode | BarMode.Fixed | TabBar布局模式,具体描述见BarMode枚举说明。 | | barMode | BarMode | BarMode.Fixed | TabBar布局模式,具体描述见BarMode枚举说明。 |
| barWidth | number&nbsp;\|&nbsp;string<sup>8+</sup> | - | TabBar的宽度值。 | | barWidth | [Length](ts-types.md#length) | - | TabBar的宽度值。 |
| barHeight | number&nbsp;\|&nbsp;string<sup>8+</sup> | - | TabBar的高度值。 | | barHeight | [Length](ts-types.md#length) | - | TabBar的高度值。 |
| animationDuration | number | 200 | TabContent滑动动画时长。 | | animationDuration | number | 200 | TabContent滑动动画时长。 |
## BarMode枚举说明 ## BarMode枚举说明
...@@ -59,8 +59,8 @@ Tabs(value: {barPosition?: BarPosition, index?: number, controller?: [TabsContro ...@@ -59,8 +59,8 @@ Tabs(value: {barPosition?: BarPosition, index?: number, controller?: [TabsContro
## 事件 ## 事件
| 名称 | 功能描述 | | 名称 | 功能描述 |
| ---------------------------------------- | -------------- | | ------------------------------------------------------------ | ------------------------- |
| onChange(callback:&nbsp;(index:&nbsp;number)&nbsp;=&gt;&nbsp;void) | Tab页签切换后触发的事件。 | | onChange(event:&nbsp;(index:&nbsp;number)&nbsp;=&gt;&nbsp;void) | Tab页签切换后触发的事件。 |
## TabsController ## TabsController
......
...@@ -19,19 +19,19 @@ ...@@ -19,19 +19,19 @@
## 接口 ## 接口
Circle(options?: {width: Length, height: Length}) Circle(value?: {width: string&nbsp;|&nbsp;number, height: string&nbsp;|&nbsp;number})
**options参数:** **参数:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| ------ | ------ | ---- | ---- | ---- | | ------ | -------------------------- | ---- | ------ | -------- |
| width | Length | 是 | - | 宽度。 | | width | string&nbsp;\|&nbsp;number | 是 | - | 宽度。 |
| height | Length | 是 | - | 高度。 | | height | string&nbsp;\|&nbsp;number | 是 | - | 高度。 |
## 属性 ## 属性
| 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 | | 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 |
| ------ | ------ | ---- | ---- | --------- | | -------- | -------- | ------ | ---- | ------------------ |
| width | Length | 0 | 否 | 圆所在矩形的宽度。 | | width | Length | 0 | 否 | 圆所在矩形的宽度。 |
| height | Length | 0 | 否 | 圆所在矩形的高度。 | | height | Length | 0 | 否 | 圆所在矩形的高度。 |
......
...@@ -20,19 +20,19 @@ ...@@ -20,19 +20,19 @@
## 接口 ## 接口
ellipse(options?: {width: Length, height: Length}) Ellipse(value?: {width: string&nbsp;|&nbsp;number, height: string&nbsp;|&nbsp;number})
**options参数说明:** **参数:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| ------ | ------ | ---- | ---- | ---- | | ------ | -------------------------- | ---- | ------ | -------- |
| width | Length | 是 | - | 宽度。 | | width | string&nbsp;\|&nbsp;number | 是 | - | 宽度。 |
| height | Length | 是 | - | 高度。 | | height | string&nbsp;\|&nbsp;number | 是 | - | 高度。 |
## 属性 ## 属性
| 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 | | 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 |
| ------ | ------ | ---- | ---- | ---------- | | -------- | -------- | ------ | ---- | -------------------- |
| width | Length | 0 | 否 | 椭圆所在矩形的宽度。 | | width | Length | 0 | 否 | 椭圆所在矩形的宽度。 |
| height | Length | 0 | 否 | 椭圆所在矩形的高度。 | | height | Length | 0 | 否 | 椭圆所在矩形的高度。 |
...@@ -46,7 +46,7 @@ ellipse(options?: {width: Length, height: Length}) ...@@ -46,7 +46,7 @@ ellipse(options?: {width: Length, height: Length})
struct EllipseExample { struct EllipseExample {
build() { build() {
Flex({ justifyContent: FlexAlign.SpaceAround }) { Flex({ justifyContent: FlexAlign.SpaceAround }) {
// 在一个 150 * 70 的矩形框中绘制一个椭圆 // 在一个 150 * 80 的矩形框中绘制一个椭圆
Ellipse({ width: 150, height: 80 }) Ellipse({ width: 150, height: 80 })
// 在一个 150 * 70 的矩形框中绘制一个椭圆 // 在一个 150 * 70 的矩形框中绘制一个椭圆
Ellipse().width(150).height(80) Ellipse().width(150).height(80)
......
...@@ -19,23 +19,23 @@ ...@@ -19,23 +19,23 @@
## 接口 ## 接口
Line(options?: {width: Length, height: Length}) Line(value?: {width: string&nbsp;|&nbsp;number, height: string&nbsp;|&nbsp;number})
**options参数说明:** **参数:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| ------ | ------ | ---- | ---- | ---- | | ------ | -------------------------- | ---- | ------ | -------- |
| width | Length | 是 | - | 宽度。 | | width | string&nbsp;\|&nbsp;number | 是 | - | 宽度。 |
| height | Length | 是 | - | 高度。 | | height | string&nbsp;\|&nbsp;number | 是 | - | 高度。 |
## 属性 ## 属性
| 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 | | 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 |
| ---------- | ------ | ----------- | ---- | ------------- | | ---------- | ------------- | ----------- | ---- | ------------------------ |
| width | Length | 0 | 否 | 直线所在矩形的宽度。 | | width | Length | 0 | 否 | 直线所在矩形的宽度。 |
| height | Length | 0 | 否 | 直线所在矩形的高度。 | | height | Length | 0 | 否 | 直线所在矩形的高度。 |
| startPoint | Point | [0,&nbsp;0] | 是 | 直线起点坐标(相对坐标)。 | | startPoint | Array<any&gt; | [0,&nbsp;0] | 是 | 直线起点坐标(相对坐标)。 |
| endPoint | Point | [0,&nbsp;0] | 是 | 直线终点坐标(相对坐标)。 | | endPoint | Array<any&gt; | [0,&nbsp;0] | 是 | 直线终点坐标(相对坐标)。 |
## 示例 ## 示例
......
...@@ -27,9 +27,9 @@ Path(value?: { width?: number | string, height?: number | string, commands?: str ...@@ -27,9 +27,9 @@ Path(value?: { width?: number | string, height?: number | string, commands?: str
## 属性 ## 属性
| 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 | | 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 |
| -------- | ---------------- | ---- | ---- | ----------- | | -------- | --------------------------------------- | ------ | ---- | ------------------------ |
| width | number \| string | 0 | 否 | 路径所在矩形的宽度。 | | width | [Length](../../ui/ts-types.md#长度类型) | 0 | 否 | 路径所在矩形画布的宽度。 |
| height | number \| string | 0 | 否 | 路径所在矩形的高度。 | | height | [Length](../../ui/ts-types.md#长度类型) | 0 | 否 | 路径所在矩形画布的高度。 |
| commands | string | '' | 否 | 路径绘制的命令字符串。 | | commands | string | '' | 否 | 路径绘制的命令字符串。 |
......
...@@ -19,22 +19,22 @@ ...@@ -19,22 +19,22 @@
## 接口 ## 接口
Polygon(value:{options?: {width: Length, height: Length}}) Polygon(value?:{width: string&nbsp;|&nbsp;number, height: string&nbsp;|&nbsp;number})
**options参数说明:** **参数:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| ------ | ------ | ---- | ---- | ---- | | ------ | -------------------------- | ---- | ------ | -------- |
| width | Length | 是 | - | 宽度。 | | width | string&nbsp;\|&nbsp;number | 是 | - | 宽度。 |
| height | Length | 是 | - | 高度。 | | height | string&nbsp;\|&nbsp;number | 是 | - | 高度。 |
## 属性 ## 属性
| 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 | | 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 |
| ------ | ------------------ | ---- | ---- | ----------- | | -------- | ---------------- | ------ | ---- | ---------------------- |
| width | Length | 0 | 否 | 多边形所在矩形的宽度。 | | width | Length | 0 | 否 | 多边形所在矩形的宽度。 |
| height | Length | 0 | 否 | 多边形所在矩形的高度。 | | height | Length | 0 | 否 | 多边形所在矩形的高度。 |
| points | Array&lt;Point&gt; | - | 是 | 多边形的顶点坐标列表。 | | points | Array&lt;any&gt; | - | 是 | 多边形的顶点坐标列表。 |
## 示例 ## 示例
......
...@@ -20,22 +20,22 @@ ...@@ -20,22 +20,22 @@
## 接口 ## 接口
Polyline(options?: {width: Length, height: Length}) Polyline(value?: {width: string&nbsp;|&nbsp;number, height: string&nbsp;|&nbsp;number})
**options参数说明:** **参数:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| ------ | ------ | ---- | ---- | ---- | | ------ | -------------------------- | ---- | ------ | -------- |
| width | Length | 是 | - | 宽度。 | | width | string&nbsp;\|&nbsp;number | 是 | - | 宽度。 |
| height | Length | 是 | - | 高度。 | | height | string&nbsp;\|&nbsp;number | 是 | - | 高度。 |
## 属性 ## 属性
| 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 | | 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 |
| ------ | ------------------ | ---- | ---- | ---------- | | -------- | ---------------- | ------ | ---- | -------------------- |
| width | Length | 0 | 否 | 折线所在矩形的宽度。 | | width | Length | 0 | 否 | 折线所在矩形的宽度。 |
| height | Length | 0 | 否 | 折线所在矩形的高度。 | | height | Length | 0 | 否 | 折线所在矩形的高度。 |
| points | Array&lt;Point&gt; | - | 是 | 折线经过坐标点列表。 | | points | Array&lt;any&gt; | - | 是 | 折线经过坐标点列表。 |
## 示例 ## 示例
......
...@@ -20,27 +20,27 @@ ...@@ -20,27 +20,27 @@
## 接口 ## 接口
Rect(value:{options?: {width: Length,height: Length,radius?: Length | Array&lt;Length&gt;} | {width: Length,height: Length,radiusWidth?: Length,radiusHeight?: Length}}) Rect(value:{width: string&nbsp;|&nbsp;number,height: string&nbsp;|&nbsp;number,radius?: string&nbsp;|&nbsp;number | Array&lt;any&gt;} | {width: string&nbsp;|&nbsp;number,height: string&nbsp;|&nbsp;number,radiusWidth?: string&nbsp;|&nbsp;number,radiusHeight?: string&nbsp;|&nbsp;number})
**options参数说明:** **options参数说明:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| ------------ | --------------------------------------- | ---- | ---- | -------------------- | | ------------ | ------------------------------------ | ---- | ------ | ---------------------------------------- |
| width | Length | 是 | - | 宽度。 | | width | string&nbsp;\|&nbsp;number | 是 | - | 宽度。 |
| height | Length | 是 | - | 高度。 | | height | string&nbsp;\|&nbsp;number | 是 | - | 高度。 |
| radius | Length&nbsp;\|&nbsp;Array&lt;Length&gt; | 否 | 0 | 圆角半径,支持分别设置四个角的圆角度数。 | | radius | Length&nbsp;\|&nbsp;Array&lt;any&gt; | 否 | 0 | 圆角半径,支持分别设置四个角的圆角度数。 |
| radiusWidth | Length | 否 | 0 | 圆角宽度。 | | radiusWidth | string&nbsp;\|&nbsp;number | 否 | 0 | 圆角宽度。 |
| radiusHeight | Length | 否 | 0 | 圆角高度。 | | radiusHeight | string&nbsp;\|&nbsp;number | 否 | 0 | 圆角高度。 |
## 属性 ## 属性
| 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 | | 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 |
| ------------ | --------------------------------------- | ---- | ---- | ---------------- | | ------------ | ------------------------------------ | ------ | ---- | -------------------------------- |
| width | Length | 0 | 否 | 宽度。 | | width | Length | 0 | 否 | 宽度。 |
| height | Length | 0 | 否 | 高度。 | | height | Length | 0 | 否 | 高度。 |
| radiusWidth | Length | 0 | 否 | 圆角的宽度,仅设置宽时宽高一致。 | | radiusWidth | string&nbsp;\|&nbsp;number | 0 | 否 | 圆角的宽度,仅设置宽时宽高一致。 |
| radiusHeight | Length | 0 | 否 | 圆角的高度,仅设置高时宽高一致。 | | radiusHeight | string&nbsp;\|&nbsp;number | 0 | 否 | 圆角的高度,仅设置高时宽高一致。 |
| radius | Length&nbsp;\|&nbsp;Array&lt;Length&gt; | 0 | 否 | 圆角大小。 | | radius | Length&nbsp;\|&nbsp;Array&lt;any&gt; | 0 | 否 | 圆角大小。 |
## 示例 ## 示例
......
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
## 接口 ## 接口
Shape(value:{target?: PixelMap}) Shape(value?: {target?: PixelMap})
**参数:** **参数:**
...@@ -34,17 +34,17 @@ Shape(value:{target?: PixelMap}) ...@@ -34,17 +34,17 @@ Shape(value:{target?: PixelMap})
## 属性 ## 属性
| 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 | | 参数名称 | 参数类型 | 默认值 | 必填 | 参数描述 |
| ---------------- | ---------------------------------------- | ------------------- | ---- | ------------ | | ---------------- | ------------------------------------------------------------ | ------------------- | ---- | ------------------------ |
| viewPort | {<br/>x:&nbsp;Length,<br/>y:&nbsp;Length,<br/>width:&nbsp;Length,<br/>height:&nbsp;Length<br/>} | - | 是 | 形状的视口。 | | viewPort | {<br/>x:&nbsp;string&nbsp;\|&nbsp;number,<br/>y:&nbsp;string&nbsp;\|&nbsp;number,<br/>width:&nbsp;string&nbsp;\|&nbsp;number,<br/>height:&nbsp;string&nbsp;\|&nbsp;number<br/>} | - | 是 | 形状的视口。 |
| fill | Color | Black | 否 | 填充颜色。 | | fill | [ResourceColor](ts-types.md#resourcecolor8) | Black | 否 | 填充颜色。 |
| stroke | Color | - | 否 | 边框颜色。 | | stroke | [ResourceColor](ts-types.md#resourcecolor8) | - | 否 | 边框颜色。 |
| strokeDashArray | Array&lt;Length&gt; | [] | 否 | 设置边框的间隙。 | | strokeDashArray | Array&lt;any&gt; | [] | 否 | 设置边框的间隙。 |
| strokeDashOffset | Length | 0 | 否 | 边框绘制起点的偏移量。 | | strokeDashOffset | string&nbsp;\|&nbsp;number | 0 | 否 | 边框绘制起点的偏移量。 |
| strokeLineCap | [LineCapStyle](ts-appendix-enums.md#linecapstyle) | LineCapStyle.Butt | 否 | 路径端点绘制样式。 | | strokeLineCap | [LineCapStyle](ts-appendix-enums.md#linecapstyle) | LineCapStyle.Butt | 否 | 路径端点绘制样式。 |
| strokeLineJoin | [LineJoinStyle](ts-appendix-enums.md#linejoinstyle) | LineJoinStyle.Miter | 否 | 边框拐角绘制样式。 | | strokeLineJoin | [LineJoinStyle](ts-appendix-enums.md#linejoinstyle) | LineJoinStyle.Miter | 否 | 边框拐角绘制样式。 |
| strokeMiterLimit | number | 4 | 否 | 锐角绘制成斜角的极限值。 | | strokeMiterLimit | number | 4 | 否 | 锐角绘制成斜角的极限值。 |
| strokeOpacity | number | 1 | 否 | 设置边框的不透明度。 | | strokeOpacity | number&nbsp;\|&nbsp;string&nbsp;\|[Resource](ts-types.md#resource) | 1 | 否 | 设置边框的不透明度。 |
| strokeWidth | Length | 1 | 否 | 设置边框的宽度。 | | strokeWidth | string&nbsp;\|&nbsp;number | 1 | 否 | 设置边框的宽度。 |
| antiAlias | boolean | true | 否 | 是否开启抗锯齿。 | | antiAlias | boolean | true | 否 | 是否开启抗锯齿。 |
......
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
## 接口 ## 接口
Video(value: VideoOptions) Video(value: {src?: string | Resource, currentProgressRate?: number | string | PlaybackSpeed, previewUri?: string | PixelMap | Resource, controller?: VideoController})
- VideoOptions类型接口说明 - VideoOptions类型接口说明
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 | | 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
...@@ -62,15 +62,15 @@ Video(value: VideoOptions) ...@@ -62,15 +62,15 @@ Video(value: VideoOptions)
## 事件 ## 事件
| 名称 | 功能描述 | | 名称 | 功能描述 |
| ---------------------------------------- | ---------------------------------------- | | ------------------------------------------------------------ | ------------------------------------------------------------ |
| onStart()&nbsp;=&gt;&nbsp;void | 播放时触发该事件。 | | onStart(event:()&nbsp;=&gt;&nbsp;void) | 播放时触发该事件。 |
| onPause()&nbsp;=&gt;&nbsp;void | 暂停时触发该事件。 | | onPause(event:()&nbsp;=&gt;&nbsp;void) | 暂停时触发该事件。 |
| onFinish()&nbsp;=&gt;&nbsp;void | 播放结束时触发该事件。 | | onFinish(event:()&nbsp;=&gt;&nbsp;void) | 播放结束时触发该事件。 |
| onError()&nbsp;=&gt;&nbsp;void | 播放失败时触发该事件。 | | onError(event:()&nbsp;=&gt;&nbsp;void) | 播放失败时触发该事件。 |
| onPrepared(event?:&nbsp;{&nbsp;duration:&nbsp;number&nbsp;})&nbsp;=&gt;&nbsp;void | 视频准备完成时触发该事件,通过duration可以获取视频时长,单位为秒(s)。 | | onPrepared(callBack:(event?:&nbsp;{&nbsp;duration:&nbsp;number&nbsp;})&nbsp;=&gt;&nbsp;void) | 视频准备完成时触发该事件,通过duration可以获取视频时长,单位为s。<br/>- duration: 视频的时长。 |
| onSeeking(event?:&nbsp;{&nbsp;time:&nbsp;number&nbsp;})&nbsp;=&gt;&nbsp;void | 操作进度条过程时上报时间信息,单位为s。 | | onSeeking(callBack:(event?:&nbsp;{&nbsp;time:&nbsp;number&nbsp;})&nbsp;=&gt;&nbsp;void) | 操作进度条过程时上报时间信息,单位为s。 |
| onSeeked(event?:&nbsp;{&nbsp;time:&nbsp;number&nbsp;})&nbsp;=&gt;&nbsp;void | 操作进度条完成后,上报播放时间信息,单位为s。 | | onSeeked(callBack:(event?:&nbsp;{&nbsp;time:&nbsp;number&nbsp;})&nbsp;=&gt;&nbsp;void) | 操作进度条完成后,上报播放时间信息,单位为s。 |
| onUpdate(event?:&nbsp;{&nbsp;time:&nbsp;number&nbsp;})&nbsp;=&gt;&nbsp;void | 播放进度变化时触发该事件,单位为s,更新时间间隔为250ms。 | | onUpdate(callBack:(event?:&nbsp;{&nbsp;time:&nbsp;number&nbsp;})&nbsp;=&gt;&nbsp;void) | 播放进度变化时触发该事件,单位为s,更新时间间隔为250ms。 |
## VideoController ## VideoController
......
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
## ActionSheet.show ## ActionSheet.show
show(options: {&nbsp;paramObject1}) show(value?: {&nbsp; title?: string&nbsp;|&nbsp;Resource,message?: string&nbsp;|&nbsp;Resource,confirm?:{value: string&nbsp;|&nbsp;Resource,action:() => void},cancel?:()=>void,sheets?:Array<SheetInfo&gt;,autoCancel?:boolean, alignment?: DialogAlignment , offset?: { dx: number | string | Resource; dy: number | string | Resource } })
定义列表弹窗并弹出。 定义列表弹窗并弹出。
...@@ -27,7 +27,7 @@ show(options: {&nbsp;paramObject1}) ...@@ -27,7 +27,7 @@ show(options: {&nbsp;paramObject1})
| confirm | {<br/>value:&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>action:&nbsp;()&nbsp;=&gt;&nbsp;void<br/>} | 否 | - | 确认按钮的文本内容和点击回调。<br/>value:按钮文本内容。<br/>action:&nbsp;按钮选中时的回调。 | | confirm | {<br/>value:&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>action:&nbsp;()&nbsp;=&gt;&nbsp;void<br/>} | 否 | - | 确认按钮的文本内容和点击回调。<br/>value:按钮文本内容。<br/>action:&nbsp;按钮选中时的回调。 |
| cancel | ()&nbsp;=&gt;&nbsp;void | 否 | - | 点击遮障层关闭dialog时的回调。 | | cancel | ()&nbsp;=&gt;&nbsp;void | 否 | - | 点击遮障层关闭dialog时的回调。 |
| alignment | [DialogAlignment](ts-methods-custom-dialog-box.md) | 否 | DialogAlignment.Default | 弹窗在竖直方向上的对齐方式。 | | alignment | [DialogAlignment](ts-methods-custom-dialog-box.md) | 否 | DialogAlignment.Default | 弹窗在竖直方向上的对齐方式。 |
| offset | {<br/>dx:&nbsp;Length,<br/>dy:&nbsp;Length<br/>} | 否 | {<br/>dx:&nbsp;0,<br/>dy:&nbsp;0<br/>} | 弹窗相对alignment所在位置的偏移量。 | | offset | {<br/>dx:&nbsp;number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>dy:&nbsp;number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource)<br/>} | 否 | {<br/>dx:&nbsp;0,<br/>dy:&nbsp;0<br/>} | 弹窗相对alignment所在位置的偏移量。 |
| sheets | Array<SheetInfo&gt; | 是 | - | 设置选项内容,每个选择项支持设置图片、文本和选中的回调。 | | sheets | Array<SheetInfo&gt; | 是 | - | 设置选项内容,每个选择项支持设置图片、文本和选中的回调。 |
- SheetInfo接口说明 - SheetInfo接口说明
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册