Skip to content

D
Docs

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

通知 159
Star 292
Fork 28
D
Docs
提交 834ce964 编写于 作者: Z zhangxiao150
浏览文件
操作

TextInput TextArea Search RN需求新增文档 

Signed-off-by: Nzhangxiao150 <zhangxiao150@huawei.com>
Change-Id: I82ea88b18603b6d8eddc28ea312bcc76dcafe279
上级 967968a0
隐藏空白更改
内联 并排
Showing with 45 addition and 18 deletion
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-search.md
浏览文件 @ 834ce964
...@@ -39,6 +39,7 @@ Search(options?: { value?: string; placeholder?: ResourceStr; icon?: string; con ...@@ -39,6 +39,7 @@ Search(options?: { value?: string; placeholder?: ResourceStr; icon?: string; con
| cancelButton<sup>10+</sup> | {<br/>style? : [CancelButtonStyle](#cancelbuttonstyle10枚举说明)<br/>icon?: [IconOptions](#iconoptions10对象说明) <br/>} | 设置右侧清除按钮样式。 | | cancelButton<sup>10+</sup> | {<br/>style? : [CancelButtonStyle](#cancelbuttonstyle10枚举说明)<br/>icon?: [IconOptions](#iconoptions10对象说明) <br/>} | 设置右侧清除按钮样式。 |
| fontColor<sup>10+</sup> | [ResourceColor](ts-types.md#resourcecolor) | 设置输入文本的字体颜色。 | | fontColor<sup>10+</sup> | [ResourceColor](ts-types.md#resourcecolor) | 设置输入文本的字体颜色。 |
| caretStyle<sup>10+</sup> | [CaretStyle](#caretstyle10对象说明) | 设置光标样式。 | | caretStyle<sup>10+</sup> | [CaretStyle](#caretstyle10对象说明) | 设置光标样式。 |
| selectionMenuHidden<sup>10+</sup> | boolean | 设置长按输入框或者右键输入框时，是否弹出文本选择菜单。<br />默认值：false |
## IconOptions<sup>10+</sup>对象说明 ## IconOptions<sup>10+</sup>对象说明
...@@ -74,13 +75,15 @@ Search(options?: { value?: string; placeholder?: ResourceStr; icon?: string; con ...@@ -74,13 +75,15 @@ Search(options?: { value?: string; placeholder?: ResourceStr; icon?: string; con
除支持[通用事件](ts-universal-events-click.md)外，还支持以下事件： 除支持[通用事件](ts-universal-events-click.md)外，还支持以下事件：
| 名称 | 功能描述 | | 名称 | 功能描述 |
| ---------------------------------------- | ---------------------------------------- | | ------------------------------------------------------------ | ------------------------------------------------------------ |
| onSubmit(callback: (value: string) => void) | 点击搜索图标、搜索按钮或者按下软键盘搜索按钮时触发该回调。<br> -value: 当前搜索框中输入的文本内容。 | | onSubmit(callback: (value: string) => void) | 点击搜索图标、搜索按钮或者按下软键盘搜索按钮时触发该回调。<br> -value: 当前搜索框中输入的文本内容。 |
| onChange(callback: (value: string) => void) | 输入内容发生变化时，触发该回调。<br> -value: 当前搜索框中输入的文本内容。 | | onChange(callback: (value: string) => void) | 输入内容发生变化时，触发该回调。<br> -value: 当前搜索框中输入的文本内容。 |
| onCopy(callback: (value: string) => void) | 长按搜索框弹出剪切板之后，点击剪切板的复制按钮触发该回调。<br> -value: 复制的文本内容。 | | onCopy(callback: (value: string) => void) | 长按搜索框弹出剪切板之后，点击剪切板的复制按钮触发该回调。<br> -value: 复制的文本内容。 |
| onCut(callback: (value: string) => void) | 长按搜索框弹出剪切板之后，点击剪切板的剪切按钮触发该回调。<br> -value: 剪切的文本内容。 | | onCut(callback: (value: string) => void) | 长按搜索框弹出剪切板之后，点击剪切板的剪切按钮触发该回调。<br> -value: 剪切的文本内容。 |
| onPaste(callback: (value: string) => void) | 长按搜索框弹出剪切板之后，点击剪切板的粘贴按钮触发该回调。<br> -value: 粘贴的文本内容。 | | onPaste(callback: (value: string) => void) | 长按搜索框弹出剪切板之后，点击剪切板的粘贴按钮触发该回调。<br> -value: 粘贴的文本内容。 |
| onTextSelectionChange(callback: (selectionStart: number, selectionEnd: number) => void)<sup>10+</sup> | 文本选择的位置发生变化时，触发该回调。<br />selectionStart：文本选择区域起始位置，文本框中文字的起始位置为0。<br />selectionEnd：文本选择区域结束位置。 |
| onContentScroll(callback: (totalOffsetX: number, totalOffsetY: number) => void)<sup>10+</sup> | 文本内容滚动时，触发该回调。<br />totalOffsetX：文本在内容区的横坐标偏移。<br />totalOffsetY：文本在内容区的纵坐标偏移。 |
## SearchController ## SearchController
...@@ -102,6 +105,12 @@ caretPosition(value: number): void ...@@ -102,6 +105,12 @@ caretPosition(value: number): void
| ------ | -------- | ---- | ---------------------------------- | | ------ | -------- | ---- | ---------------------------------- |
| value | number | 是 | 从字符串开始到光标所在位置的长度。 | | value | number | 是 | 从字符串开始到光标所在位置的长度。 |
### stopEditing<sup>10+</sup>
stopEditing(): void
退出编辑态。
## 示例 ## 示例
```ts ```ts
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-textarea.md
浏览文件 @ 834ce964
...@@ -29,17 +29,18 @@ TextArea(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: Tex ...@@ -29,17 +29,18 @@ TextArea(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: Tex
除支持[通用属性](ts-universal-attributes-size.md)外，还支持以下属性： 除支持[通用属性](ts-universal-attributes-size.md)外，还支持以下属性：
| 名称 | 参数类型 | 描述 | | 名称 | 参数类型 | 描述 |
| ------------------------- | ------------------------------------------------------------ | ------------------------------------------------------------ | | --------------------------------- | ------------------------------------------------------------ | ------------------------------------------------------------ |
| placeholderColor | [ResourceColor](ts-types.md#resourcecolor) | 设置placeholder文本颜色。 | | placeholderColor | [ResourceColor](ts-types.md#resourcecolor) | 设置placeholder文本颜色。 |
| placeholderFont | [Font](ts-types.md#font) | 设置placeholder文本样式，包括字体大小，字体粗细，字体族，字体风格。目前仅支持默认字体族。 | | placeholderFont | [Font](ts-types.md#font) | 设置placeholder文本样式，包括字体大小，字体粗细，字体族，字体风格。目前仅支持默认字体族。 |
| textAlign | [TextAlign](ts-appendix-enums.md#textalign) | 设置文本在输入框中的水平对齐式。<br/>默认值：TextAlign.Start | | textAlign | [TextAlign](ts-appendix-enums.md#textalign) | 设置文本在输入框中的水平对齐式。<br/>默认值：TextAlign.Start |
| caretColor | [ResourceColor](ts-types.md#resourcecolor) | 设置输入框光标颜色。 | | caretColor | [ResourceColor](ts-types.md#resourcecolor) | 设置输入框光标颜色。 |
| inputFilter<sup>8+</sup> | {<br/>value:&nbsp;[ResourceStr](ts-types.md#resourcestr),<br/>error?:&nbsp;(value:&nbsp;string) => void<br/>} | 通过正则表达式设置输入过滤器。匹配表达式的输入允许显示，不匹配的输入将被过滤。仅支持单个字符匹配，不支持字符串匹配。<br/>-&nbsp;value：设置正则表达式。<br/>-&nbsp;error：正则匹配失败时，返回被过滤的内容。 | | inputFilter<sup>8+</sup> | {<br/>value:&nbsp;[ResourceStr](ts-types.md#resourcestr),<br/>error?:&nbsp;(value:&nbsp;string) => void<br/>} | 通过正则表达式设置输入过滤器。匹配表达式的输入允许显示，不匹配的输入将被过滤。仅支持单个字符匹配，不支持字符串匹配。<br/>-&nbsp;value：设置正则表达式。<br/>-&nbsp;error：正则匹配失败时，返回被过滤的内容。 |
| copyOption<sup>9+</sup> | [CopyOptions](ts-appendix-enums.md#copyoptions9) | 设置输入的文本是否可复制。<br>设置CopyOptions.None时，当前TextArea中的文字无法被复制或剪切，仅支持粘贴。 | | copyOption<sup>9+</sup> | [CopyOptions](ts-appendix-enums.md#copyoptions9) | 设置输入的文本是否可复制。<br>设置CopyOptions.None时，当前TextArea中的文字无法被复制或剪切，仅支持粘贴。 |
| maxLength<sup>10+</sup> | number | 设置文本的最大输入字符数。<br/>默认不设置最大输入字符数限制。 | | maxLength<sup>10+</sup> | number | 设置文本的最大输入字符数。<br/>默认不设置最大输入字符数限制。 |
| showCounter<sup>10+</sup> | boolean | 设置文本最大输入字符数后，是否显示字数。<br/>默认值：false | | showCounter<sup>10+</sup> | boolean | 设置文本最大输入字符数后，是否显示字数。<br/>默认值：false |
| style<sup>10+</sup> | [TextContentStyle](enums.d.ts#TextContentStyle) | 设置文本框多态样式。<br/>默认值：TextContentStyle.DEFAULT | | style<sup>10+</sup> | [TextContentStyle](enums.d.ts#TextContentStyle) | 设置文本框多态样式。<br/>默认值：TextContentStyle.DEFAULT |
| selectionMenuHidden<sup>10+</sup> | boolean | 设置长按输入框或者右键输入框时，是否弹出文本选择菜单。<br />默认值：false |
> **说明：** > **说明：**
> >
...@@ -57,6 +58,8 @@ TextArea(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: Tex ...@@ -57,6 +58,8 @@ TextArea(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: Tex
| onCopy<sup>8+</sup>(callback:(value:&nbsp;string)&nbsp;=&gt;&nbsp;void) | 长按输入框内部区域弹出剪贴板后，点击剪切板复制按钮，触发该回调。<br/>- value：复制的文本内容。 | | onCopy<sup>8+</sup>(callback:(value:&nbsp;string)&nbsp;=&gt;&nbsp;void) | 长按输入框内部区域弹出剪贴板后，点击剪切板复制按钮，触发该回调。<br/>- value：复制的文本内容。 |
| onCut<sup>8+</sup>(callback:(value:&nbsp;string)&nbsp;=&gt;&nbsp;void) | 长按输入框内部区域弹出剪贴板后，点击剪切板剪切按钮，触发该回调。<br/>- value：剪切的文本内容。 | | onCut<sup>8+</sup>(callback:(value:&nbsp;string)&nbsp;=&gt;&nbsp;void) | 长按输入框内部区域弹出剪贴板后，点击剪切板剪切按钮，触发该回调。<br/>- value：剪切的文本内容。 |
| onPaste<sup>8+</sup>(callback:(value:&nbsp;string)&nbsp;=&gt;&nbsp;void) | 长按输入框内部区域弹出剪贴板后，点击剪切板粘贴按钮，触发该回调。<br/>- value：粘贴的文本内容。 | | onPaste<sup>8+</sup>(callback:(value:&nbsp;string)&nbsp;=&gt;&nbsp;void) | 长按输入框内部区域弹出剪贴板后，点击剪切板粘贴按钮，触发该回调。<br/>- value：粘贴的文本内容。 |
| onTextSelectionChange(callback: (selectionStart: number, selectionEnd: number) => void)<sup>10+</sup> | 文本选择的位置发生变化时，触发该回调。<br />selectionStart：文本选择区域起始位置，文本框中文字的起始位置为0。<br />selectionEnd：文本选择区域结束位置。 |
| onContentScroll(callback: (totalOffsetX: number, totalOffsetY: number) => void)<sup>10+</sup> | 文本内容滚动时，触发该回调。<br />totalOffsetX：文本在内容区的横坐标偏移。<br />totalOffsetY：文本在内容区的纵坐标偏移。 |
## TextAreaController<sup>8+</sup> ## TextAreaController<sup>8+</sup>
...@@ -93,6 +96,12 @@ setTextSelection(selectionStart: number, selectionEnd: number): void ...@@ -93,6 +96,12 @@ setTextSelection(selectionStart: number, selectionEnd: number): void
| selectionStart | number | 是 | 文本选择区域起始位置，文本框中文字的起始位置为0。<br/>当selectionStart小于0时、按照0处理；当selectionStart大于文字最大长度时、按照文字最大长度处理。<br/> | | selectionStart | number | 是 | 文本选择区域起始位置，文本框中文字的起始位置为0。<br/>当selectionStart小于0时、按照0处理；当selectionStart大于文字最大长度时、按照文字最大长度处理。<br/> |
| selectionEnd | number | 是 | 文本选择区域结束位置。<br/>当selectionEnd小于0时、按照0处理；当selectionEnd大于文字最大长度时、按照文字最大长度处理。<br/> | | selectionEnd | number | 是 | 文本选择区域结束位置。<br/>当selectionEnd小于0时、按照0处理；当selectionEnd大于文字最大长度时、按照文字最大长度处理。<br/> |
### stopEditing<sup>10+</sup>
stopEditing(): void
退出编辑态。
## 示例 ## 示例
```ts ```ts
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-textinput.md
浏览文件 @ 834ce964
...@@ -49,6 +49,7 @@ TextInput(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: Te ...@@ -49,6 +49,7 @@ TextInput(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: Te
| showError<sup>10+</sup> | string&nbsp;\|&nbsp;undefined | 设置错误状态下提示的错误文本或者不显示错误状态。<br/>默认不显示错误状态。 | | showError<sup>10+</sup> | string&nbsp;\|&nbsp;undefined | 设置错误状态下提示的错误文本或者不显示错误状态。<br/>默认不显示错误状态。 |
| showUnderLine<sup>10+</sup> | boolean | 设置是否开启下划线。<br/>默认值：false | | showUnderLine<sup>10+</sup> | boolean | 设置是否开启下划线。<br/>默认值：false |
| passwordIcon<sup>10+</sup> | [PasswordIcon](#passwordicon10对象说明) | 密码输入模式时，设置输入框末尾的图标。<br/>默认为系统提供的密码图标。 | | passwordIcon<sup>10+</sup> | [PasswordIcon](#passwordicon10对象说明) | 密码输入模式时，设置输入框末尾的图标。<br/>默认为系统提供的密码图标。 |
| selectionMenuHidden<sup>10+</sup> | boolean | 设置长按输入框或者右键输入框时，是否弹出文本选择菜单。<br />默认值：false |
> **说明：** > **说明：**
> >
...@@ -101,6 +102,8 @@ TextInput(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: Te ...@@ -101,6 +102,8 @@ TextInput(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: Te
| onCopy(callback:(value:&nbsp;string)&nbsp;=&gt;&nbsp;void)<sup>8+</sup> | 长按输入框内部区域弹出剪贴板后，点击剪切板复制按钮，触发该回调。<br/>value：复制的文本内容。 | | onCopy(callback:(value:&nbsp;string)&nbsp;=&gt;&nbsp;void)<sup>8+</sup> | 长按输入框内部区域弹出剪贴板后，点击剪切板复制按钮，触发该回调。<br/>value：复制的文本内容。 |
| onCut(callback:(value:&nbsp;string)&nbsp;=&gt;&nbsp;void)<sup>8+</sup> | 长按输入框内部区域弹出剪贴板后，点击剪切板剪切按钮，触发该回调。<br/>value：剪切的文本内容。 | | onCut(callback:(value:&nbsp;string)&nbsp;=&gt;&nbsp;void)<sup>8+</sup> | 长按输入框内部区域弹出剪贴板后，点击剪切板剪切按钮，触发该回调。<br/>value：剪切的文本内容。 |
| onPaste(callback:(value:&nbsp;string)&nbsp;=&gt;&nbsp;void)<sup>8+</sup> | 长按输入框内部区域弹出剪贴板后，点击剪切板粘贴按钮，触发该回调。<br/>value：粘贴的文本内容。 | | onPaste(callback:(value:&nbsp;string)&nbsp;=&gt;&nbsp;void)<sup>8+</sup> | 长按输入框内部区域弹出剪贴板后，点击剪切板粘贴按钮，触发该回调。<br/>value：粘贴的文本内容。 |
| onTextSelectionChange(callback: (selectionStart: number, selectionEnd: number) => void)<sup>10+</sup> | 文本选择的位置发生变化时，触发该回调。<br />selectionStart：文本选择区域起始位置，文本框中文字的起始位置为0。<br />selectionEnd：文本选择区域结束位置。 |
| onContentScroll(callback: (totalOffsetX: number, totalOffsetY: number) => void)<sup>10+</sup> | 文本内容滚动时，触发该回调。<br />totalOffsetX：文本在内容区的横坐标偏移。<br />totalOffsetY：文本在内容区的纵坐标偏移。 |
## TextInputController<sup>8+</sup> ## TextInputController<sup>8+</sup>
...@@ -134,6 +137,12 @@ setTextSelection(selectionStart:&nbsp;number, selectionStart:&nbsp;number): void ...@@ -134,6 +137,12 @@ setTextSelection(selectionStart:&nbsp;number, selectionStart:&nbsp;number): void
| selectionStart | number | 是 | 文本选择区域起始位置，文本框中文字的起始位置为0。 | | selectionStart | number | 是 | 文本选择区域起始位置，文本框中文字的起始位置为0。 |
| selectionEnd | number | 是 | 文本选择区域结束位置。 | | selectionEnd | number | 是 | 文本选择区域结束位置。 |
### stopEditing<sup>10+</sup>
stopEditing(): void
退出编辑态。
## 示例 ## 示例
```ts ```ts
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或