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

!15693 Picker组件UX规格与特征动效整改

Merge pull request !15693 from chensi10/picker_docs_0308
......@@ -32,7 +32,16 @@ DatePicker(options?: {start?: Date, end?: Date, selected?: Date})
| 名称 | 参数类型 | 描述 |
| ------| -------------- | -------- |
| lunar | boolean | 日期是否显示农历。<br/>-&nbsp;true:展示农历。<br/>-&nbsp;false:不展示农历。<br/>默认值:false |
| disappearTextStyle<sup>10+</sup> | [PickerTextStyle](#pickertextstyle10类型说明) | 设置所有选项中最上和最下两个选项的文本颜色、字号、字体粗细。 |
| textStyle<sup>10+</sup> | [PickerTextStyle](#pickertextstyle10类型说明) | 设置所有选项中除了最上、最下及选中项以外的文本颜色、字号、字体粗细。 |
| selectedTextStyle<sup>10+</sup> | [PickerTextStyle](#pickertextstyle10类型说明) | 设置选中项的文本颜色、字号、字体粗细。 |
## PickerTextStyle<sup>10+</sup>类型说明
| 参数名 | 参数类型 | 必填 | 参数描述 |
| ------ | ------------------------------------------ | ---- | -------------------------------------------- |
| color | [ResourceColor](ts-types.md#resourcecolor) | 否 | 文本颜色。 |
| font | [Font](ts-types.md#font) | 否 | 文本样式,picker只支持字号、字体粗细的设置。 |
## 事件
......
......@@ -14,7 +14,7 @@
## 接口
TextPicker(options?: {range: string[]|Resource, selected?: number, value?: string})
TextPicker(options?: {range: string[]|Resource|TextPickerRangeContent[], selected?: number, value?: string})
根据range指定的选择范围创建文本选择器。
......@@ -22,15 +22,25 @@ TextPicker(options?: {range: string[]|Resource, selected?: number, value?: strin
| 参数名 | 参数类型 | 必填 | 参数描述 |
| -------- | -------- | -------- | -------- |
| range | string[]&nbsp;\|&nbsp;[Resource](ts-types.md#resource类型) | 是 | 选择器的数据选择列表。不可设置为空数组,若设置为空数组,则不显示;若动态变化为空数组,则保持当前正常值显示。 |
| range | string[]&nbsp;\|&nbsp;[Resource](ts-types.md#resource类型)\|[TextPickerRangeContent](#textpickerrangecontent10类型说明)[]<sup>10+</sup> | 是 | 选择器的数据选择列表。不可设置为空数组,若设置为空数组,则不显示;若动态变化为空数组,则保持当前正常值显示。 |
| selected | number | 否 | 设置默认选中项在数组中的索引值。<br/>默认值:0 |
| value | string | 否 | 设置默认选中项的值,优先级低于selected。<br/>默认值:第一个元素值 |
| value | string | 否 | 设置默认选中项的值,优先级低于selected。<br/>默认值:第一个元素值<br/>**说明**:只有显示文本列表时该值有效。显示图片或图片加文本的列表时,该值无效。 |
## TextPickerRangeContent<sup>10+</sup>类型说明
| 参数名 | 参数类型 | 必填 | 参数描述 |
| ------ | -------------------------------------------------------- | ---- | ---------- |
| icon | string&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | 是 | 图片资源。 |
| text | string&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | 否 | 文本信息。 |
## 属性
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| defaultPickerItemHeight | number \| string | 设置Picker各选择项的高度。 |
| disappearTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 设置所有选项中最上和最下两个选项的文本颜色、字号、字体粗细。 |
| textStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 设置所有选项中除了最上、最下及选中项以外的文本颜色、字号、字体粗细。 |
| selectedTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 设置选中项的文本颜色、字号、字体粗细。 |
## 事件
......@@ -38,7 +48,7 @@ TextPicker(options?: {range: string[]|Resource, selected?: number, value?: strin
| 名称 | 描述 |
| -------- | -------- |
| onChange(callback:&nbsp;(value:&nbsp;string,&nbsp;index:&nbsp;number)&nbsp;=&gt;&nbsp;void) | 滑动选中TextPicker文本内容后,触发该回调。<br/>-&nbsp;value:&nbsp;当前选中项的文本。<br/>-&nbsp;index:&nbsp;当前选中项的索引值。 |
| onChange(callback:&nbsp;(value:&nbsp;string,&nbsp;index:&nbsp;number)&nbsp;=&gt;&nbsp;void) | 滑动选中TextPicker文本内容后,触发该回调。<br/>-&nbsp;value:&nbsp;当前选中项的文本。<br/>**说明**:当显示文本或图片加文本列表时,value值为选中项中的文本值,当显示图片列表时,value值为空。<br/>-&nbsp;index:&nbsp;当前选中项的索引值。 |
## 示例
......
......@@ -30,6 +30,9 @@ TimePicker(options?: {selected?: Date})
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| useMilitaryTime | boolean | 展示时间是否为24小时制,不支持动态修改。<br/>默认值:false |
| disappearTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 设置所有选项中最上和最下两个选项的文本颜色、字号、字体粗细。 |
| textStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 设置所有选项中除了最上、最下及选中项以外的文本颜色、字号、字体粗细。 |
| selectedTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 设置选中项的文本颜色、字号、字体粗细。 |
## 事件
......
......@@ -21,6 +21,11 @@ show(options?: DatePickerDialogOptions)
| end | Date | 否 | Date('2100-12-31') | 设置选择器的结束日期。 |
| selected | Date | 否 | 当前系统日期 | 设置当前选中的日期。 |
| lunar | boolean | 否 | false | 日期是否显示为农历。 |
| showTime<sup>10+</sup> | boolean | 否 | false | 是否展示时间项。 |
| useMilitaryTime<sup>10+</sup> | boolean | 否 | false | 展示时间是否为24小时制。 |
| disappearTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 否 | - | 设置所有选项中最上和最下两个选项的文本颜色、字号、字体粗细。 |
| textStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 否 | - | 设置所有选项中除了最上、最下及选中项以外的文本颜色、字号、字体粗细。 |
| selectedTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 否 | - | 设置选中项的文本颜色、字号、字体粗细。 |
| onAccept | (value: [DatePickerResult](ts-basic-components-datepicker.md#DatePickerResult对象说明)) => void | 否 | - | 点击弹窗中的“确定”按钮时触发该回调。 |
| onCancel | () => void | 否 | - | 点击弹窗中的“取消”按钮时触发该回调。 |
| onChange | (value: [DatePickerResult](ts-basic-components-datepicker.md#DatePickerResult对象说明)) => void | 否 | - | 滑动弹窗中的滑动选择器使当前选中项改变时触发该回调。 |
......
......@@ -17,10 +17,13 @@ show(options?: TextPickerDialogOptions)
| 参数名 | 参数类型 | 必填 | 参数描述 |
| -------- | -------- | -------- | -------- |
| range | string[]&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | 是 | 设置文本选择器的选择范围。不可设置为空数组,若设置为空数组,则不弹出弹窗。 |
| range | string[]&nbsp;\|&nbsp;[Resource](ts-types.md#resource)\|[TextPickerRangeContent](ts-basic-components-textpicker.md#textpickerrangecontent10类型说明)[]<sup>10+</sup> | 是 | 设置文本选择器的选择范围。不可设置为空数组,若设置为空数组,则不弹出弹窗。 |
| selected | number | 否 | 设置选中项的索引值。<br>默认值:0 |
| value | string | 否 | 设置选中项的文本内容。当设置了selected参数时,该参数不生效。如果设置的value值不在range范围内,则默认取range第一个元素。|
| defaultPickerItemHeight | number \| string | 否 | 设置选择器中选项的高度。 |
| disappearTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 否 | 设置所有选项中最上和最下两个选项的文本颜色、字号、字体粗细。 |
| textStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 否 | 设置所有选项中除了最上、最下及选中项以外的文本颜色、字号、字体粗细。 |
| selectedTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 否 | 设置选中项的文本颜色、字号、字体粗细。 |
| onAccept | (value: [TextPickerResult](#textpickerresult对象说明)) => void | 否 | 点击弹窗中的“确定”按钮时触发该回调。 |
| onCancel | () => void | 否 | 点击弹窗中的“取消”按钮时触发该回调。 |
| onChange | (value: [TextPickerResult](#textpickerresult对象说明)) => void | 否 | 滑动弹窗中的选择器使当前选中项改变时触发该回调。 |
......@@ -29,7 +32,7 @@ show(options?: TextPickerDialogOptions)
| 名称 | 类型 | 描述 |
| -------- | -------- | -------- |
| value | string | 选中项的文本内容。 |
| value | string | 选中项的文本内容。<br/>**说明**:当显示文本或图片加文本列表时,value值为选中项中的文本值,<br/>当显示图片列表时,value值为空。 |
| index | number | 选中项在选择范围数组中的索引值。 |
## 示例
......
......@@ -19,6 +19,9 @@ show(options?: TimePickerDialogOptions)
| -------- | -------- | -------- | -------- |
| selected | Date | 否 | 设置当前选中的时间。<br/>默认值:当前系统时间 |
| useMilitaryTime | boolean | 否 | 展示时间是否为24小时制,默认为12小时制。<br/>默认值:false |
| disappearTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 否 | 设置所有选项中最上和最下两个选项的文本颜色、字号、字体粗细。 |
| textStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 否 | 设置所有选项中除了最上、最下及选中项以外的文本颜色、字号、字体粗细。 |
| selectedTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10类型说明) | 否 | 设置选中项的文本颜色、字号、字体粗细。 |
| onAccept | (value: [TimePickerResult](ts-basic-components-timepicker.md#TimePickerResult对象说明)) => void | 否 | 点击弹窗中的“确定”按钮时触发该回调。 |
| onCancel | () => void | 否 | 点击弹窗中的“取消”按钮时触发该回调。 |
| onChange | (value: [TimePickerResult](ts-basic-components-timepicker.md#TimePickerResult对象说明)) => void | 否 | 滑动弹窗中的选择器使当前选中时间改变时触发该回调。 |
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册