提交 b8e1355b 编写于 作者: Y yaoyuchi

fix select docs, add ResourceStr, ResourceColor and Font typys

Signed-off-by: Nyaoyuchi <yaoyuchi@huawei.com>
上级 758b703f
# Slelect<a name="ZH-CN_TOPIC_0000001193075098"></a>
# Select<a name="ZH-CN_TOPIC_0000001193075098"></a>
>![](../../public_sys-resources/icon-note.gif) **说明:**
>该组件从API Version 8开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
提供下拉选择按钮,可以让用户在多个选项之间选择。
提供下拉选择菜单,可以让用户在多个选项之间选择。
## 权限列表<a name="section781125411508"></a>
......@@ -33,7 +33,7 @@ Select(options: Array&lt;SelectOption</a>&gt;)
</thead>
<tbody><tr><td class="cellrowborder" valign="top" width="16.11%" headers="mcps1.1.6.1.1 "><p>value</p>
</td>
<td class="cellrowborder" valign="top" width="14.01%" headers="mcps1.1.6.1.2 "><p>string | <a href="https://gitee.com/superFat/docs/blob/qiyi_select_docs_0122/zh-cn/application-dev/ui/ts-types.md">Resource</a></p>
<td class="cellrowborder" valign="top" width="14.01%" headers="mcps1.1.6.1.2 "><p><a href="https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/ts-types.md#ResourceStr">ResourceStr</a></p>
</td>
<td class="cellrowborder" valign="top" width="11.99%" headers="mcps1.1.6.1.3 "><p>是</p>
</td>
......@@ -42,10 +42,9 @@ Select(options: Array&lt;SelectOption</a>&gt;)
<td class="cellrowborder" valign="top" width="46.18%" headers="mcps1.1.6.1.5 "><p>下拉选项内容。</p>
</td>
</tr>
<tbody><tr><td class="cellrowborder" valign="top" width="16.11%"
headers="mcps1.1.6.1.1 "><p>icon</p>
<tbody><tr><td class="cellrowborder" valign="top" width="16.11%" headers="mcps1.1.6.1.1 "><p>icon</p>
</td>
<td class="cellrowborder" valign="top" width="14.01%" headers="mcps1.1.6.1.2 "><p>string | <a href="https://gitee.com/superFat/docs/blob/qiyi_select_docs_0122/zh-cn/application-dev/ui/ts-types.md">Resource</a></p>
<td class="cellrowborder" valign="top" width="14.01%" headers="mcps1.1.6.1.2 "><p><a href="https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/ts-types.md#ResourceStr">ResourceStr</a></p>
</td>
<td class="cellrowborder" valign="top" width="11.99%" headers="mcps1.1.6.1.3 "><p>否</p>
</td>
......@@ -76,7 +75,7 @@ Select(options: Array&lt;SelectOption</a>&gt;)
</td>
<td class="cellrowborder" valign="top" width="17.62%" headers="mcps1.1.5.1.3 "><p>-</p>
</td>
<td class="cellrowborder" valign="top" width="47.33%" headers="mcps1.1.5.1.4 "><p>设置下拉菜单选择项序号,从0开始</p>
<td class="cellrowborder" valign="top" width="47.33%" headers="mcps1.1.5.1.4 "><p>设置下拉菜单初始选择项的索引,第一项的索引为0</p>
</td>
</tr>
<tr><td class="cellrowborder" valign="top" width="18.72%" headers="mcps1.1.5.1.1 "><p>value</p>
......@@ -90,22 +89,16 @@ Select(options: Array&lt;SelectOption</a>&gt;)
</tr>
<tr><td class="cellrowborder" valign="top" width="18.72%" headers="mcps1.1.5.1.1 "><p>font</p>
</td>
<td class="cellrowborder" valign="top" width="27.500000000000004%" headers="mcps1.1.5.1.2 "><p>{</p>
<p>size?: Length,</p>
<p>weight?: number | <a href="ts-universal-attributes-text-style.md#li24391125115311">FontWeight</a>,</p>
<p>family?: string,</p>
<p>style?: <a href="ts-basic-components-textarea.md#table952mcpsimp">FontStyle</a></p>
<p>}</p>
<td class="cellrowborder" valign="top" width="27.500000000000004%" headers="mcps1.1.5.1.2 "><p><a href="https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/ts-types.md#Font">Font</a></p>
</td>
<td class="cellrowborder" valign="top" width="13.239999999999998%" headers="mcps1.1.5.1.3 "><p>-</p>
</td>
<td class="cellrowborder" valign="top" width="43.28%" headers="mcps1.1.5.1.4 "><p>设置select文本样式:</p>
<ul><li>size: 设置文本尺寸,Length为number类型时,使用fp单位。</li><li>weight: 设置文本的字体粗细,number类型取值[100, 900],取值间隔为100,默认为400,取值越大,字体越粗。</li><li>family: 设置文本的字体列表。使用多个字体,使用','进行分割,优先级按顺序生效。例如:'Arial, sans-serif'。</li><li>style: 设置文本的字体样式。</li></ul>
<td class="cellrowborder" valign="top" width="43.28%" headers="mcps1.1.5.1.4 "><p>设置下拉按钮本身的文本样式:</p>
</td>
</tr>
<tr><td class="cellrowborder" valign="top" width="18.72%" headers="mcps1.1.5.1.1 "><p>fontColor</p>
</td>
<td class="cellrowborder" valign="top" width="16.33%" headers="mcps1.1.5.1.2 "><p>Color | <a href="https://gitee.com/superFat/docs/blob/qiyi_select_docs_0122/zh-cn/application-dev/ui/ts-types.md">Resource</a></p>
<td class="cellrowborder" valign="top" width="16.33%" headers="mcps1.1.5.1.2 "><p><a href="https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/ts-types.md#ResourceColor">ResourceColor</a></p>
</td>
<td class="cellrowborder" valign="top" width="17.62%" headers="mcps1.1.5.1.3 "><p>-</p>
</td>
......@@ -114,7 +107,7 @@ Select(options: Array&lt;SelectOption</a>&gt;)
</tr>
<tr><td class="cellrowborder" valign="top" width="18.72%" headers="mcps1.1.5.1.1 "><p>selectedOptionBgColor</p>
</td>
<td class="cellrowborder" valign="top" width="16.33%" headers="mcps1.1.5.1.2 "><p>Color | <a href="https://gitee.com/superFat/docs/blob/qiyi_select_docs_0122/zh-cn/application-dev/ui/ts-types.md">Resource</a></p>
<td class="cellrowborder" valign="top" width="16.33%" headers="mcps1.1.5.1.2 "><p><a href="https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/ts-types.md#ResourceColor">ResourceColor</a></p>
</td>
<td class="cellrowborder" valign="top" width="17.62%" headers="mcps1.1.5.1.3 "><p>-</p>
</td>
......@@ -123,22 +116,16 @@ Select(options: Array&lt;SelectOption</a>&gt;)
</tr>
<tr><td class="cellrowborder" valign="top" width="18.72%" headers="mcps1.1.5.1.1 "><p>selectedOptionFont</p>
</td>
<td class="cellrowborder" valign="top" width="27.500000000000004%" headers="mcps1.1.5.1.2 "><p>{</p>
<p>size?: Length,</p>
<p>weight?: number | <a href="ts-universal-attributes-text-style.md#li24391125115311">FontWeight</a>,</p>
<p>family?: string,</p>
<p>style?: <a href="ts-basic-components-textarea.md#table952mcpsimp">FontStyle</a></p>
<p>}</p>
<td class="cellrowborder" valign="top" width="27.500000000000004%" headers="mcps1.1.5.1.2 "><p><a href="https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/ts-types.md#Font">Font</a></p>
</td>
<td class="cellrowborder" valign="top" width="13.239999999999998%" headers="mcps1.1.5.1.3 "><p>-</p>
</td>
<td class="cellrowborder" valign="top" width="43.28%" headers="mcps1.1.5.1.4 "><p>设置已选中option的文本样式:</p>
<ul><li>size: 设置文本尺寸,Length为number类型时,使用fp单位。</li><li>weight: 设置文本的字体粗细,number类型取值[100, 900],取值间隔为100,默认为400,取值越大,字体越粗。</li><li>family: 设置文本的字体列表。使用多个字体,使用','进行分割,优先级按顺序生效。例如:'Arial, sans-serif'。</li><li>style: 设置文本的字体样式。</li></ul>
<td class="cellrowborder" valign="top" width="43.28%" headers="mcps1.1.5.1.4 "><p>设置下拉菜单选中项的文本样式:</p>
</td>
</tr>
<tr><td class="cellrowborder" valign="top" width="18.72%" headers="mcps1.1.5.1.1 "><p>selectedOptionFontColor</p>
</td>
<td class="cellrowborder" valign="top" width="16.33%" headers="mcps1.1.5.1.2 "><p>Color | <a href="https://gitee.com/superFat/docs/blob/qiyi_select_docs_0122/zh-cn/application-dev/ui/ts-types.md">Resource</a></p>
<td class="cellrowborder" valign="top" width="16.33%" headers="mcps1.1.5.1.2 "><p><a href="https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/ts-types.md#ResourceColor">ResourceColor</a></p>
</td>
<td class="cellrowborder" valign="top" width="17.62%" headers="mcps1.1.5.1.3 "><p>-</p>
</td>
......@@ -147,7 +134,7 @@ Select(options: Array&lt;SelectOption</a>&gt;)
</tr>
<tr><td class="cellrowborder" valign="top" width="18.72%" headers="mcps1.1.5.1.1 "><p>optionBgColor</p>
</td>
<td class="cellrowborder" valign="top" width="16.33%" headers="mcps1.1.5.1.2 "><p>Color | <a href="https://gitee.com/superFat/docs/blob/qiyi_select_docs_0122/zh-cn/application-dev/ui/ts-types.md">Resource</a></p>
<td class="cellrowborder" valign="top" width="16.33%" headers="mcps1.1.5.1.2 "><p><a href="https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/ts-types.md#ResourceColor">ResourceColor</a></p>
</td>
<td class="cellrowborder" valign="top" width="17.62%" headers="mcps1.1.5.1.3 "><p>-</p>
</td>
......@@ -156,22 +143,16 @@ Select(options: Array&lt;SelectOption</a>&gt;)
</tr>
<tr><td class="cellrowborder" valign="top" width="18.72%" headers="mcps1.1.5.1.1 "><p>optionFont</p>
</td>
<td class="cellrowborder" valign="top" width="27.500000000000004%" headers="mcps1.1.5.1.2 "><p>{</p>
<p>size?: Length,</p>
<p>weight?: number | <a href="ts-universal-attributes-text-style.md#li24391125115311">FontWeight</a>,</p>
<p>family?: string,</p>
<p>style?: <a href="ts-basic-components-textarea.md#table952mcpsimp">FontStyle</a></p>
<p>}</p>
<td class="cellrowborder" valign="top" width="27.500000000000004%" headers="mcps1.1.5.1.2 "><p><a href="https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/ts-types.md#Font">Font</a></p>
</td>
<td class="cellrowborder" valign="top" width="13.239999999999998%" headers="mcps1.1.5.1.3 "><p>-</p>
</td>
<td class="cellrowborder" valign="top" width="43.28%" headers="mcps1.1.5.1.4 "><p>设置option文本样式:</p>
<ul><li>size: 设置文本尺寸,Length为number类型时,使用fp单位。</li><li>weight: 设置文本的字体粗细,number类型取值[100, 900],取值间隔为100,默认为400,取值越大,字体越粗。</li><li>family: 设置文本的字体列表。使用多个字体,使用','进行分割,优先级按顺序生效。例如:'Arial, sans-serif'。</li><li>style: 设置文本的字体样式。</li></ul>
<td class="cellrowborder" valign="top" width="43.28%" headers="mcps1.1.5.1.4 "><p>设置下拉菜单项的文本样式:</p>
</td>
</tr>
<tr><td class="cellrowborder" valign="top" width="18.72%" headers="mcps1.1.5.1.1 "><p>optionFontColor</p>
</td>
<td class="cellrowborder" valign="top" width="16.33%" headers="mcps1.1.5.1.2 "><p>Color | <a href="https://gitee.com/superFat/docs/blob/qiyi_select_docs_0122/zh-cn/application-dev/ui/ts-types.md">Resource</a></p>
<td class="cellrowborder" valign="top" width="16.33%" headers="mcps1.1.5.1.2 "><p><a href="https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/ts-types.md#ResourceColor">ResourceColor</a></p>
</td>
<td class="cellrowborder" valign="top" width="17.62%" headers="mcps1.1.5.1.3 "><p>-</p>
</td>
......@@ -203,10 +184,10 @@ Select(options: Array&lt;SelectOption</a>&gt;)
## 示例<a name="section13800193662114"></a>
```
@Entry
@Component
struct SliderExample {
@State index: number = 0
build() {
Column() {
Select([{value:'aaa',icon: "/common/1.png"},
......@@ -215,9 +196,9 @@ struct SliderExample {
{value:'ddd',icon: "/common/4.png"}])
.selected(2)
.value('TTT')
.font({size: 30, weight:900, family: 'serif', style: FontStyle.Normal })
.selectedOptionFont({size: 30, weight: 900, family: 'serif', style: FontStyle.Normal })
.optionFont({size: 30, weight: 900, family: 'serif', style: FontStyle.Normal })
.font({size: 30, weight:400, family: 'serif', style: FontStyle.Normal })
.selectedOptionFont({size: 40, weight: 500, family: 'serif', style: FontStyle.Normal })
.optionFont({size: 30, weight: 400, family: 'serif', style: FontStyle.Normal })
.onSelected((index:number)=>{
console.info("Select:" + index)
})
......
......@@ -56,6 +56,27 @@
| ColorStop | [Color,&nbsp;number] | 描述渐进色颜色断点类型,第一个参数为颜色值,第二个参数为0~1之间的比例值。 |
## ResourceStr类型<a name="ResourceStr"></a>
| 名称 | 类型定义 | 描述 |
| -------- | -------- | -------- |
| ResourceStr | string&nbsp;\| <a href="ts-types.md#Resource">Resource</a> | 用于描述资源字符串的类型。 |
## ResourceColor类型<a name="ResourceColor"></a>
| 名称 | 类型定义 | 描述 |
| -------- | -------- | -------- |
| ResourceColor | Color&nbsp;\| number&nbsp;\| string&nbsp;\| <a href="ts-types.md#Resource">Resource</a> | 用于描述资源颜色类型。 |
## Font类型<a name="Font"></a>
| 名称 | 类型定义 | 描述 |
| -------- | -------- | -------- |
| Font | {<br/>size?: Length;<br/>weight?: <a href="https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-text-style.md#li24391125115311">FontWeight</a> &nbsp;\| number &nbsp;\| string;<br/>family?: string &nbsp;\| <a href="ts-types.md#Resource">Resource</a>;<br/>style?: <a href="https://gitee.com/superFat/docs/blob/master/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-text-style.md#li6906111945316">FontStyle</a>;<br/>} | 设置文本样式:<br/><ul><li>size: 设置文本尺寸,Length为number类型时,使用fp单位。<br/></li><li>weight: 设置文本的字体粗细,number类型取值[100, 900],取值间隔为100,默认为400,取值越大,字体越粗。<br/></li><li>family: 设置文本的字体列表。使用多个字体,使用','进行分割,优先级按顺序生效。例如:'Arial, sans-serif'。<br/></li><li>style: 设置文本的字体样式。</li></ul>|
## 示例
```
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册