1# TextInput 2 3单行文本输入框组件。 4 5> **说明:** 6> 7> 该组件从API version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 8 9 10## 子组件 11 12无 13 14 15## 接口 16 17TextInput(value?: TextInputOptions) 18 19**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 20 21**系统能力:** SystemCapability.ArkUI.ArkUI.Full 22 23**参数:** 24 25| 参数名 | 类型 | 必填 | 说明 | 26| ----- | ----- | ---- | ---- | 27| value | [TextInputOptions](#textinputoptions对象说明) | 否 | TextInput组件参数。 | 28 29## TextInputOptions对象说明 30 31**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 32 33**系统能力:** SystemCapability.ArkUI.ArkUI.Full 34 35| 名称 | 类型 | 必填 | 说明 | 36| ---- | ----- | ---- | ---- | 37| placeholder | [ResourceStr](ts-types.md#resourcestr) | 否 | 设置无输入时的提示文本。 | 38| text | [ResourceStr](ts-types.md#resourcestr) | 否 | 设置输入框当前的文本内容。</br>建议通过onChange事件将状态变量与文本实时绑定,</br>避免组件刷新时TextInput中的文本内容异常。<br />从API version 10开始,该参数支持[$$](../../../ui/state-management/arkts-two-way-sync.md)双向绑定变量。<br />从API version 18开始,该参数支持[!!](../../../ui/state-management/arkts-new-binding.md#系统组件参数双向绑定)双向绑定变量。 | 39| controller<sup>8+</sup> | [TextInputController](#textinputcontroller8) | 否 | 设置TextInput控制器。 | 40 41## 属性 42 43除支持[通用属性](ts-component-general-attributes.md),还支持以下属性: 44 45> **说明:** 46> 默认情况下,通用属性[padding](ts-universal-attributes-size.md#padding)的默认值为:<br>{<br> top: '8vp',<br> right: '16vp',<br> bottom: '8vp',<br> left: '16vp'<br> } 47> 48> 输入框开启下划线模式时,通用属性padding的默认值为:<br>{<br> top: '12vp',<br> right: '0vp',<br> bottom: '12vp',<br> left: '0vp'<br> } 49> 50> 当输入框设置padding为0时,可设置borderRadius为0避免光标被截断。 51> 52> 从API version 10开始,单行输入框可设置.width('auto')使组件宽度自适应文本宽度,自适应时组件宽度受constraintSize属性以及父容器传递的最大最小宽度限制,其余使用方式参考[尺寸设置](ts-universal-attributes-size.md#属性)。 53 54### type 55 56type(value: InputType) 57 58设置输入框类型。 59 60**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 61 62**系统能力:** SystemCapability.ArkUI.ArkUI.Full 63 64**参数:** 65 66| 参数名 | 类型 | 必填 | 说明 | 67| ------ | ------------------------------- | ---- | ----------------------------------------- | 68| value | [InputType](#inputtype枚举说明) | 是 | 输入框类型。<br/>默认值:InputType.Normal | 69 70### placeholderColor 71 72placeholderColor(value: ResourceColor) 73 74设置placeholder文本颜色。 75 76**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 77 78**系统能力:** SystemCapability.ArkUI.ArkUI.Full 79 80**参数:** 81 82| 参数名 | 类型 | 必填 | 说明 | 83| ------ | ------------------------------------------ | ---- | -------------------------------------------- | 84| value | [ResourceColor](ts-types.md#resourcecolor) | 是 | placeholder文本颜色。<br/>默认值:跟随主题。<br/>Wearable设备上默认值为:'#99ffffff' | 85 86### placeholderFont 87 88placeholderFont(value?: Font) 89 90设置placeholder文本样式,包括字体大小,字体粗细,字体族,字体风格。当前支持'HarmonyOS Sans'字体和[注册自定义字体](../js-apis-font.md)。 91 92**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 93 94**系统能力:** SystemCapability.ArkUI.ArkUI.Full 95 96**参数:** 97 98| 参数名 | 类型 | 必填 | 说明 | 99| ------ | ------------------------ | ---- | --------------------- | 100| value | [Font](ts-types.md#font) | 否 | placeholder文本样式。<br/>Wearable设备上默认值为:18fp | 101 102### enterKeyType 103 104enterKeyType(value: EnterKeyType) 105 106设置输入法回车键类型。 107 108**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 109 110**系统能力:** SystemCapability.ArkUI.ArkUI.Full 111 112**参数:** 113 114| 参数名 | 类型 | 必填 | 说明 | 115| ------ | ------------------------------------------------ | ---- | ------------------------------------------------ | 116| value | [EnterKeyType](#enterkeytype枚举说明) | 是 | 输入法回车键类型。<br/>默认值:EnterKeyType.Done | 117 118### caretColor 119 120caretColor(value: ResourceColor) 121 122设置输入框光标颜色。 123 124**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 125 126**系统能力:** SystemCapability.ArkUI.ArkUI.Full 127 128**参数:** 129 130| 参数名 | 类型 | 必填 | 说明 | 131| ------ | ------------------------------------------ | ---- | -------------------------------------- | 132| value | [ResourceColor](ts-types.md#resourcecolor) | 是 | 输入框光标颜色。<br/>默认值:'#007DFF' | 133 134> **说明:** 135> 从API version 12开始,此接口支持设置文本手柄颜色,光标和文本手柄颜色保持一致。 136 137### maxLength 138 139maxLength(value: number) 140 141设置文本的最大输入字符数。 142 143**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 144 145**系统能力:** SystemCapability.ArkUI.ArkUI.Full 146 147**参数:** 148 149| 参数名 | 类型 | 必填 | 说明 | 150| ------ | ------ | ---- | ------------------------------------------------------------ | 151| value | number | 是 | 文本的最大输入字符数。<br/>默认值:Infinity,可以无限输入。<br/>**说明:** <br/>当不设置该属性或设置异常值时,取默认值,设置小数时,取整数部分。 | 152 153### fontColor 154 155fontColor(value: ResourceColor) 156 157设置字体颜色。 158 159**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 160 161**系统能力:** SystemCapability.ArkUI.ArkUI.Full 162 163**参数:** 164 165| 参数名 | 类型 | 必填 | 说明 | 166| ------ | ------------------------------------------ | ---- | ---------- | 167| value | [ResourceColor](ts-types.md#resourcecolor) | 是 | 字体颜色。<br/>Wearable设备上默认值为:'#dbffffff' | 168 169### fontSize 170 171fontSize(value: Length) 172 173设置字体大小。 174 175**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 176 177**系统能力:** SystemCapability.ArkUI.ArkUI.Full 178 179**参数:** 180 181| 参数名 | 类型 | 必填 | 说明 | 182| ------ | ---------------------------- | ---- | ------------------------------------------------------------ | 183| value | [Length](ts-types.md#length) | 是 | 字体大小。fontSize为number类型时,使用fp单位。字体默认大小16fp。不支持设置百分比字符串。<br/>Wearable设备上默认值为:18fp | 184 185### fontStyle 186 187fontStyle(value: FontStyle) 188 189设置字体样式。 190 191**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 192 193**系统能力:** SystemCapability.ArkUI.ArkUI.Full 194 195**参数:** 196 197| 参数名 | 类型 | 必填 | 说明 | 198| ------ | ------------------------------------------- | ---- | --------------------------------------- | 199| value | [FontStyle](ts-appendix-enums.md#fontstyle) | 是 | 字体样式。<br/>默认值:FontStyle.Normal | 200 201### fontWeight 202 203fontWeight(value: number | FontWeight | string) 204 205设置文本的字体粗细,设置过大可能会在不同字体下有截断。 206 207**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 208 209**系统能力:** SystemCapability.ArkUI.ArkUI.Full 210 211**参数:** 212 213| 参数名 | 类型 | 必填 | 说明 | 214| ------ | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | 215| value | number \| [FontWeight](ts-appendix-enums.md#fontweight) \| string | 是 | 文本的字体粗细,number类型取值[100, 900],取值间隔为100,默认为400,取值越大,字体越粗。string类型仅支持number类型取值的字符串形式,例如"400",以及"bold"、"bolder"、"lighter"、"regular"、"medium",分别对应FontWeight中相应的枚举值。<br/>默认值:FontWeight.Normal | 216 217### fontFamily 218 219fontFamily(value: ResourceStr) 220 221设置字体列表。 222 223**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 224 225**系统能力:** SystemCapability.ArkUI.ArkUI.Full 226 227**参数:** 228 229| 参数名 | 类型 | 必填 | 说明 | 230| ------ | -------------------------------------- | ---- | ------------------------------------------------------------ | 231| value | [ResourceStr](ts-types.md#resourcestr) | 是 | 字体列表。默认字体'HarmonyOS Sans'。<br>应用当前支持'HarmonyOS Sans'字体和[注册自定义字体](../js-apis-font.md)。<br>卡片当前仅支持'HarmonyOS Sans'字体。 | 232 233### inputFilter<sup>8+</sup> 234 235inputFilter(value: ResourceStr, error?: Callback\<string>) 236 237通过正则表达式设置输入过滤器。匹配表达式的输入允许显示,不匹配的输入将被过滤。仅支持单个字符匹配,不支持字符串匹配。 238 239从API version 11开始,设置inputFilter且输入的字符不为空字符,会导致设置输入框类型(即type接口)附带的文本过滤效果失效。 240 241**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 242 243**系统能力:** SystemCapability.ArkUI.ArkUI.Full 244 245**参数:** 246 247| 参数名 | 类型 | 必填 | 说明 | 248| ------ | -------------------------------------- | ---- | ---------------------------------- | 249| value | [ResourceStr](ts-types.md#resourcestr) | 是 | 正则表达式。 | 250| error | Callback\<string> | 否 | 正则匹配失败时,返回被过滤的内容。 | 251 252### copyOption<sup>9+</sup> 253 254copyOption(value: CopyOptions) 255 256设置输入的文本是否可复制。设置CopyOptions.None时,当前TextInput中的文字无法被复制、剪切、翻译、分享、搜索和帮写,仅支持粘贴。 257 258设置CopyOptions.None时,不允许拖拽。 259 260**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 261 262**系统能力:** SystemCapability.ArkUI.ArkUI.Full 263 264**参数:** 265 266| 参数名 | 类型 | 必填 | 说明 | 267| ------ | ------------------------------------------------ | ---- | ------------------------------------------------------------ | 268| value | [CopyOptions](ts-appendix-enums.md#copyoptions9) | 是 | 输入的文本是否可复制。<br/>默认值:CopyOptions.LocalDevice,支持设备内复制。 | 269 270### showPasswordIcon<sup>9+</sup> 271 272showPasswordIcon(value: boolean) 273 274设置当密码输入模式时,输入框末尾的图标是否显示。 275 276**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 277 278**系统能力:** SystemCapability.ArkUI.ArkUI.Full 279 280**参数:** 281 282| 参数名 | 类型 | 必填 | 说明 | 283| ------ | ------- | ---- | ----------------------------------------------------------- | 284| value | boolean | 是 | 密码输入模式时,输入框末尾的图标是否显示。<br/>true表示显示,false表示不显示。<br/>默认值:true | 285 286### style<sup>9+</sup> 287 288style(value: TextInputStyle | TextContentStyle) 289 290设置输入框为默认风格或内联输入风格,内联输入风格只支持InputType.Normal类型。 291 292**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 293 294**系统能力:** SystemCapability.ArkUI.ArkUI.Full 295 296**参数:** 297 298| 参数名 | 类型 | 必填 | 说明 | 299| ------ | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | 300| value | [TextInputStyle](#textinputstyle9枚举说明) \| [TextContentStyle](ts-appendix-enums.md#textcontentstyle10) | 是 | 输入框为默认风格或内联输入风格。<br/>默认值:TextInputStyle.Default | 301 302### textAlign<sup>9+</sup> 303 304textAlign(value: TextAlign) 305 306设置文本在输入框中的水平对齐方式。 307 308仅支持TextAlign.Start、TextAlign.Center和TextAlign.End。 309 310可通过[align](ts-universal-attributes-location.md)属性控制文本段落在垂直方向上的位置,此组件中不可通过align属性控制文本段落在水平方向上的位置,即align属性中Alignment.TopStart、Alignment.Top、Alignment.TopEnd效果相同,控制内容在顶部,Alignment.Start、Alignment.Center、Alignment.End效果相同,控制内容垂直居中,Alignment.BottomStart、Alignment.Bottom、Alignment.BottomEnd效果相同,控制内容在底部。 311 312**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 313 314**系统能力:** SystemCapability.ArkUI.ArkUI.Full 315 316**参数:** 317 318| 参数名 | 类型 | 必填 | 说明 | 319| ------ | ------------------------------------------- | ---- | ---------------------------------------------------------- | 320| value | [TextAlign](ts-appendix-enums.md#textalign) | 是 | 文本在输入框中的水平对齐方式。<br/>默认值:TextAlign.Start | 321 322### selectedBackgroundColor<sup>10+</sup> 323 324selectedBackgroundColor(value: ResourceColor) 325 326设置文本选中底板颜色。如果未设置不透明度,默认为20%不透明度。 327 328**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 329 330**系统能力:** SystemCapability.ArkUI.ArkUI.Full 331 332**参数:** 333 334| 参数名 | 类型 | 必填 | 说明 | 335| ------ | ------------------------------------------ | ---- | ------------------------------------------ | 336| value | [ResourceColor](ts-types.md#resourcecolor) | 是 | 文本选中底板颜色。<br/>默认为20%不透明度。 | 337 338### caretStyle<sup>10+</sup> 339 340caretStyle(value: CaretStyle) 341 342设置光标风格。 343 344**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 345 346**系统能力:** SystemCapability.ArkUI.ArkUI.Full 347 348**参数:** 349 350| 参数名 | 类型 | 必填 | 说明 | 351| ------ | ----------------------------------- | ---- | ------------ | 352| value | [CaretStyle](ts-text-common.md#caretstyle10) | 是 | 光标的风格。 | 353 354### caretPosition<sup>10+</sup> 355 356caretPosition(value: number) 357 358设置光标位置。 359 360**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 361 362**系统能力:** SystemCapability.ArkUI.ArkUI.Full 363 364**参数:** 365 366| 参数名 | 类型 | 必填 | 说明 | 367| ------ | ------ | ---- | ------------ | 368| value | number | 是 | 光标的位置。<br/>第一个字符前的位置是0。 | 369 370### showUnit<sup>10+</sup> 371 372showUnit(value: CustomBuilder) 373 374设置控件作为文本框单位。需搭配[showUnderline](#showunderline10)使用,当showUnderline为true时生效。 375 376**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 377 378**系统能力:** SystemCapability.ArkUI.ArkUI.Full 379 380**参数:** 381 382| 参数名 | 类型 | 必填 | 说明 | 383| ------ | ------------------------------------------- | ---- | ------------------------------ | 384| value | [CustomBuilder](ts-types.md#custombuilder8) | 是 | 文本输入时,文本框的显示单位。 | 385 386### showError<sup>10+</sup> 387 388showError(value?: ResourceStr | undefined) 389 390设置错误状态下提示的错误文本或者不显示错误状态。 391 392当参数类型为ResourceStr并且输入内容不符合定义规范时,提示错误文本,当提示错误单行文本超长时,末尾以省略号显示。当参数类型为undefined时,不显示错误状态。请参考[示例2](#示例2设置下划线)。 393 394**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 395 396**系统能力:** SystemCapability.ArkUI.ArkUI.Full 397 398**参数:** 399 400| 参数名 | 类型 | 必填 | 说明 | 401| ------ | ----------------------------- | ---- | ------------------------------------------------------------ | 402| value | [ResourceStr](ts-types.md#resourcestr) \| undefined | 否 | 错误状态下提示的错误文本或者不显示错误状态。<br/>默认不显示错误状态。<br/>Wearable设备上字体大小为:13fp,对齐方式为:居中对齐<br/>**说明:** <br/>从API version 12开始,value支持Resource类型。 | 403 404### showUnderline<sup>10+</sup> 405 406showUnderline(value: boolean) 407 408设置是否开启下划线。 409 410**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 411 412**系统能力:** SystemCapability.ArkUI.ArkUI.Full 413 414**参数:** 415 416| 参数名 | 类型 | 必填 | 说明 | 417| ------ | ------- | ---- | ---------------------------------- | 418| value | boolean | 是 | 是否开启下划线。<br/>true表示开启,false表示不开启。<br/>默认值:false<br/>下划线默认颜色为'#33182431',默认粗细为1px,文本框尺寸48vp,下划线只支持InputType.Normal类型。 | 419 420### passwordIcon<sup>10+</sup> 421 422passwordIcon(value: PasswordIcon) 423 424设置当密码输入模式时,输入框末尾的图标。 425 426支持jpg、png、bmp、heic和webp类型的图片格式。 427 428**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 429 430**系统能力:** SystemCapability.ArkUI.ArkUI.Full 431 432**参数:** 433 434| 参数名 | 类型 | 必填 | 说明 | 435| ------ | --------------------------------------- | ---- | ------------------------------------------------------------ | 436| value | [PasswordIcon](#passwordicon10对象说明) | 是 | 密码输入模式时,输入框末尾的图标。<br/>默认为系统提供的密码图标。<br/>该图标的固定尺寸为24vp,Wearable设备上默认值为28vp,若引用的图标过大或过小,均显示为固定尺寸。 | 437 438### enableKeyboardOnFocus<sup>10+</sup> 439 440enableKeyboardOnFocus(value: boolean) 441 442设置TextInput通过点击以外的方式获焦时,是否主动拉起软键盘。 443 444从API version 10开始,获焦默认绑定输入法。 445 446**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 447 448**系统能力:** SystemCapability.ArkUI.ArkUI.Full 449 450**参数:** 451 452| 参数名 | 类型 | 必填 | 说明 | 453| ------ | ------- | ---- | ----------------------------------------------------------- | 454| value | boolean | 是 | 通过点击以外的方式获焦时,是否主动拉起软键盘。<br/>默认值:true | 455 456### selectionMenuHidden<sup>10+</sup> 457 458selectionMenuHidden(value: boolean) 459 460设置是否隐藏系统文本选择菜单。 461 462**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 463 464**系统能力:** SystemCapability.ArkUI.ArkUI.Full 465 466**参数:** 467 468| 参数名 | 类型 | 必填 | 说明 | 469| ------ | ------- | ---- | ------------------------------------------------------------ | 470| value | boolean | 是 | 是否隐藏系统文本选择菜单。<br />设置为true时,单击输入框光标、长按输入框、双击输入框、三击输入框或者右键输入框,隐藏系统文本选择菜单。<br />设置为false时,显示系统文本选择菜单。<br />默认值:false | 471 472### barState<sup>10+</sup> 473 474barState(value: BarState) 475 476设置内联输入风格编辑态时滚动条的显示模式。 477 478**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 479 480**系统能力:** SystemCapability.ArkUI.ArkUI.Full 481 482**参数:** 483 484| 参数名 | 类型 | 必填 | 说明 | 485| ------ | ----------------------------------------- | ---- | ------------------------------------------------------------ | 486| value | [BarState](ts-appendix-enums.md#barstate) | 是 | 内联输入风格编辑态时滚动条的显示模式。<br/>默认值:BarState.Auto | 487 488### maxLines<sup>10+</sup> 489 490maxLines(value: number) 491 492设置内联输入风格编辑态时文本可显示的最大行数。 493 494**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 495 496**系统能力:** SystemCapability.ArkUI.ArkUI.Full 497 498**参数:** 499 500| 参数名 | 类型 | 必填 | 说明 | 501| ------ | ----------------------------------------- | ---- | ------------------------------------------------------------ | 502| value | number | 是 | 内联输入风格编辑态时文本可显示的最大行数。<br/>默认值:3 <br/>取值范围:(0, +∞) | 503 504### customKeyboard<sup>10+</sup> 505 506customKeyboard(value: CustomBuilder, options?: KeyboardOptions) 507 508设置自定义键盘。 509 510当设置自定义键盘时,输入框激活后不会打开系统输入法,而是加载指定的自定义组件。 511 512自定义键盘的高度可以通过自定义组件根节点的height属性设置,宽度不可设置,使用系统默认值。 513 514自定义键盘采用覆盖原始界面的方式呈现,当没有开启避让模式或者输入框不需要避让的场景不会对应用原始界面产生压缩或者上提。 515 516自定义键盘无法获取焦点,但是会拦截手势事件。 517 518默认在输入控件失去焦点时,关闭自定义键盘,开发者也可以通过[TextInputController](#textinputcontroller8).[stopEditing](#stopediting10)方法控制键盘关闭。 519 520如果设备支持拍摄输入,设置自定义键盘后,该输入框会不支持拍摄输入。 521 522当设置自定义键盘时,可以通过绑定[onKeyPrelme](ts-universal-events-key.md#onkeypreime12)事件规避物理键盘的输入。 523 524**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 525 526**系统能力:** SystemCapability.ArkUI.ArkUI.Full 527 528**参数:** 529 530| 参数名 | 类型 | 必填 | 说明 | 531| --------------------- | ------------------------------------------- | ---- | ------------------------------------------------------------ | 532| value | [CustomBuilder](ts-types.md#custombuilder8) | 是 | 自定义键盘。<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 533| options<sup>12+</sup> | [KeyboardOptions](ts-basic-components-richeditor.md#keyboardoptions12) | 否 | 设置自定义键盘是否支持避让功能。 | 534 535### enableAutoFill<sup>11+</sup> 536 537enableAutoFill(value: boolean) 538 539设置是否启用自动填充。 540 541**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 542 543**系统能力:** SystemCapability.ArkUI.ArkUI.Full 544 545**参数:** 546 547| 参数名 | 类型 | 必填 | 说明 | 548| ------ | ------- | ---- | ------------------------------------------------------------ | 549| value | boolean | 是 | 是否启用自动填充。<br/>true表示启用,false表示不启用。<br/>默认值:true | 550 551### passwordRules<sup>11+</sup> 552 553passwordRules(value: string) 554 555定义生成密码的规则。在触发自动填充时,所设置的密码规则会透传给密码保险箱,用于新密码的生成。<!--RP1--><!--RP1End--> 556 557**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 558 559**系统能力:** SystemCapability.ArkUI.ArkUI.Full 560 561**参数:** 562 563| 参数名 | 类型 | 必填 | 说明 | 564| ------ | ------ | ---- | -------------------- | 565| value | string | 是 | 定义生成密码的规则。 | 566 567### cancelButton<sup>11+</sup> 568 569cancelButton(options: CancelButtonOptions) 570 571设置右侧清除按钮样式。不支持内联模式。 572 573**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 574 575**系统能力:** SystemCapability.ArkUI.ArkUI.Full 576 577**参数:** 578 579| 参数名 | 类型 | 必填 | 说明 | 580| ------ | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | 581| options | [CancelButtonOptions](ts-basic-components-search.md#cancelbuttonoptions12对象说明) | 是 | 右侧清除按钮样式选项。<br />默认值:<br />{<br />style: CancelButtonStyle.INPUT<br />}<br/>Wearable设备上默认值为:28vp | 582 583### selectAll<sup>11+</sup> 584 585selectAll(value: boolean) 586 587设置当初始状态,是否全选文本。不支持内联模式。 588 589**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 590 591**系统能力:** SystemCapability.ArkUI.ArkUI.Full 592 593**参数:** 594 595| 参数名 | 类型 | 必填 | 说明 | 596| ------ | ------- | ---- | --------------------------------- | 597| value | boolean | 是 | 是否全选文本。<br />默认值:false | 598 599### showCounter<sup>11+</sup> 600 601showCounter(value: boolean, options?: InputCounterOptions) 602 603设置当通过InputCounterOptions输入的字符数超过阈值时显示计数器。 604 605参数value为true时,才能设置options,文本框开启计数下标功能,需要配合maxLength(设置最大字符限制)一起使用。字符计数器显示的效果是当前输入字符数/最大可输入字符数。 606 607当输入字符数大于最大字符数乘百分比值时,显示字符计数器。如果用户设置计数器时不设置InputCounterOptions,那么当前输入字符数超过最大字符数时,边框和计数器下标将变为红色。用户同时设置参数value为true和InputCounterOptions,当thresholdPercentage数值在有效区间内,且输入字符数超过最大字符数时,边框和计数器下标将变为红色,框体抖动。highlightBorder设置为false,则不显示红色边框,计数器默认显示红色,框体抖动。 608 609内联模式和密码模式下字符计数器不显示。 610 611**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 612 613**系统能力:** SystemCapability.ArkUI.ArkUI.Full 614 615**参数:** 616 617| 参数名 | 类型 | 必填 | 说明 | 618| --------------------- | ----------------------------------------------------- | ---- | ---------------- | 619| value | boolean | 是 | 是否显示计数器。 | 620| options<sup>11+</sup> | [InputCounterOptions](ts-types.md#inputcounteroptions11对象说明) | 否 | 计数器的百分比。 | 621 622### contentType<sup>12+</sup> 623 624contentType(value: ContentType) 625 626设置自动填充类型。 627 628**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 629 630**系统能力:** SystemCapability.ArkUI.ArkUI.Full 631 632**参数:** 633 634| 参数名 | 类型 | 必填 | 说明 | 635| ------ | ------------------------------------- | ---- | -------------- | 636| value | [ContentType](#contenttype12枚举说明) | 是 | 自动填充类型。 | 637 638### underlineColor<sup>12+</sup> 639 640underlineColor(value: ResourceColor|UnderlineColor|undefined) 641 642开启下划线时,支持配置下划线颜色。 643 644**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 645 646**系统能力:** SystemCapability.ArkUI.ArkUI.Full 647 648| 参数名 | 类型 | 必填 | 说明 | 649| ------ | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | 650| value | [ResourceColor](ts-types.md#resourcecolor) \| [UnderlineColor](#underlinecolor12对象说明) \| undefined | 是 | 设置下划线颜色。<br/>当设置下划线颜色模式时,修改下划线颜色。当只设定非特殊状态下的颜色,可以直接输入ResourceColor。设定值为undefined、null、无效值时,所有下划线恢复为默认值。<br/>默认值:主题配置的下划线颜色。主题配置的默认下滑颜色为'#33182431'。 | 651 652### lineHeight<sup>12+</sup> 653 654lineHeight(value: number | string | Resource) 655 656设置文本的文本行高,设置值不大于0时,不限制文本行高,自适应字体大小,number类型时单位为fp。string类型支持number类型取值的字符串形式,可以附带单位,例如"10"、"10fp"。 657 658**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 659 660**系统能力:** SystemCapability.ArkUI.ArkUI.Full 661 662**参数:** 663 664| 参数名 | 类型 | 必填 | 说明 | 665| ------ | ------------------------------------------------------------ | ---- | ---------------- | 666| value | number \| string \| [Resource](ts-types.md#resource) | 是 | 文本的文本行高。 | 667 668### decoration<sup>12+</sup> 669 670decoration(value: TextDecorationOptions) 671 672设置文本装饰线类型样式及其颜色。密码模式不生效。 673 674**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 675 676**系统能力:** SystemCapability.ArkUI.ArkUI.Full 677 678**参数:** 679 680| 参数名 | 类型 | 必填 | 说明 | 681| ------ | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | 682| value | [TextDecorationOptions](ts-types.md#textdecorationoptions12对象说明) | 是 | 文本装饰线对象。<br />默认值:{<br/> type: TextDecorationType.None,<br/> color: Color.Black,<br/> style: TextDecorationStyle.SOLID <br/>} | 683 684### letterSpacing<sup>12+</sup> 685 686letterSpacing(value: number | string | Resource) 687 688设置文本字符间距。设置该值为百分比时,按默认值显示。设置该值为0时,按默认值显示。string类型支持number类型取值的字符串形式,可以附带单位,例如"10"、"10fp"。 689 690当取值为负值时,文字会发生压缩,负值过小时会将组件内容区大小压缩为0,导致无内容显示。 691 692**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 693 694**系统能力:** SystemCapability.ArkUI.ArkUI.Full 695 696**参数:** 697 698| 参数名 | 类型 | 必填 | 说明 | 699| ------ | -------------------------- | ---- | -------------- | 700| value | number \| string \| [Resource](ts-types.md#resource) | 是 | 文本字符间距。<br/>单位:fp | 701 702### fontFeature<sup>12+</sup> 703 704fontFeature(value: string) 705 706设置文字特性效果,比如数字等宽的特性。 707 708格式为:normal \| \<feature-tag-value\> 709 710\<feature-tag-value\>的格式为:\<string\> \[ \<integer\> \| on \| off ] 711 712\<feature-tag-value\>的个数可以有多个,中间用','隔开。 713 714例如,使用等宽数字的输入格式为:"ss01" on。 715 716**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 717 718**系统能力:** SystemCapability.ArkUI.ArkUI.Full 719 720**参数:** 721 722| 参数名 | 类型 | 必填 | 说明 | 723| ------ | ------ | ---- | -------------- | 724| value | string | 是 | 文字特性效果。 | 725 726Font Feature当前支持的属性见 [fontFeature属性列表](ts-basic-components-text.md#fontfeature12)。 727设置 Font Feature 属性,Font Feature 是 OpenType 字体的高级排版能力,如支持连字、数字等宽等特性,一般用在自定义字体中,其能力需要字体本身支持。 728更多 Font Feature 能力介绍可参考 https://www.w3.org/TR/css-fonts-3/#font-feature-settings-prop 和 https://sparanoid.com/lab/opentype-features/ 729 730> **说明:** 731> type属性中InputType枚举为Password、NEW_PASSWORD和NUMBER_PASSWORD等密码模式时,暂时不支持fontFeature设置文本样式。 732 733### wordBreak<sup>12+</sup> 734 735wordBreak(value: WordBreak) 736 737设置文本断行规则。该属性在组件设置内联模式时样式生效,但对placeholder文本无效。 738 739**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 740 741**系统能力:** SystemCapability.ArkUI.ArkUI.Full 742 743**参数:** 744 745| 参数名 | 类型 | 必填 | 说明 | 746| ------ | --------------------------------------------- | ---- | --------------------------------------------- | 747| value | [WordBreak](ts-appendix-enums.md#wordbreak11) | 是 | 内联输入风格编辑态时断行规则。 <br />默认值:WordBreak.BREAK_WORD | 748 749> **说明:** 750> 751> 组件不支持clip属性设置,设置该属性任意枚举值对组件文本截断无影响。 752 753### textOverflow<sup>12+</sup> 754 755textOverflow(value: TextOverflow) 756 757设置文本超长时的显示方式。仅在内联模式的编辑态、非编辑态下支持。 758 759文本截断是按字截断。例如,英文以单词为最小单位进行截断,若需要以字母为单位进行截断,wordBreak属性可设置为WordBreak.BREAK_ALL。 760 761当overflow设置TextOverflow.None与TextOverflow.Clip效果一样。 762 763**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 764 765**系统能力:** SystemCapability.ArkUI.ArkUI.Full 766 767**参数:** 768 769| 参数名 | 类型 | 必填 | 说明 | 770| ------ | ------------------------------------------------------------ | ---- | -------------------------------------------------------------------------------------------------- | 771| value | [TextOverflow](ts-appendix-enums.md#textoverflow) | 是 | 文本超长时的显示方式。<br/>内联模式非编辑态下默认值:TextOverflow.Ellipsis <br/>内联模式编辑态下默认值:TextOverflow.Clip | 772 773> **说明:** 774> TextInput组件不支持设置TextOverflow.MARQUEE模式,当设置为TextOverflow.MARQUEE模式时 内联模式非编辑态下显示为TextOverflow.Ellipsis,内联模式编辑态下以及非内联模式下显示为TextOverflow.Clip 775 776### textIndent<sup>12+</sup> 777 778textIndent(value: Dimension) 779 780设置首行文本缩进。 781 782**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 783 784**系统能力:** SystemCapability.ArkUI.ArkUI.Full 785 786**参数:** 787 788| 参数名 | 类型 | 必填 | 说明 | 789| ------ | ------------------------------------ | ---- | ---------------------------- | 790| value | [Dimension](ts-types.md#dimension10) | 是 | 首行文本缩进。<br/>默认值:0 | 791 792### minFontSize<sup>12+</sup> 793 794minFontSize(value: number | string | Resource) 795 796设置文本最小显示字号。string类型支持number类型取值的字符串形式,可以附带单位,例如"10"、"10fp"。 797 798需配合[maxFontSize](#maxfontsize12)以及[maxLines](#maxlines10)(组件设置为内联输入风格且编辑态时使用)或布局大小限制使用,单独设置不生效。 799 800自适应字号生效时,fontSize设置不生效。 801 802**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 803 804**系统能力:** SystemCapability.ArkUI.ArkUI.Full 805 806**参数:** 807 808| 参数名 | 类型 | 必填 | 说明 | 809| ------ | ------------------------------------------------------------ | ---- | ------------------ | 810| value | number \| string \| [Resource](ts-types.md#resource) | 是 | 文本最小显示字号。<br/>单位:fp | 811 812### maxFontSize<sup>12+</sup> 813 814maxFontSize(value: number | string | Resource) 815 816设置文本最大显示字号。string类型支持number类型取值的字符串形式,可以附带单位,例如"10"、"10fp"。 817 818需配合[minFontSize](#minfontsize12)以及[maxLines](#maxlines10)(组件设置为内联输入风格且编辑态时使用)或布局大小限制使用,单独设置不生效。 819 820自适应字号生效时,fontSize设置不生效。 821 822**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 823 824**系统能力:** SystemCapability.ArkUI.ArkUI.Full 825 826**参数:** 827 828| 参数名 | 类型 | 必填 | 说明 | 829| ------ | ------------------------------------------------------------ | ---- | ------------------ | 830| value | number \| string \| [Resource](ts-types.md#resource) | 是 | 文本最大显示字号。<br/>单位:fp | 831 832### heightAdaptivePolicy<sup>12+</sup> 833 834heightAdaptivePolicy(value: TextHeightAdaptivePolicy) 835 836组件设置为内联输入风格时,设置文本自适应高度的方式。 837 838当设置为TextHeightAdaptivePolicy.MAX_LINES_FIRST时,优先使用[maxLines](#maxlines10)属性来调整文本高度。如果使用maxLines属性的布局大小超过了布局约束,则尝试在[minFontSize](#minfontsize12)和[maxFontSize](#maxfontsize12)的范围内缩小字体以显示更多文本。 839 840当设置为TextHeightAdaptivePolicy.MIN_FONT_SIZE_FIRST时,优先使用minFontSize属性来调整文本高度。如果使用minFontSize属性可以将文本布局在一行中,则尝试在minFontSize和maxFontSize的范围内增大字体并使用最大可能的字体大小。 841 842当设置为TextHeightAdaptivePolicy.LAYOUT_CONSTRAINT_FIRST时,与TextHeightAdaptivePolicy.MIN_FONT_SIZE_FIRST效果一样。 843 844组件设置为非内联输入风格时,设置文本自适应高度(TextHeightAdaptivePolicy)的三种方式效果一样,即在minFontSize和maxFontSize的范围内缩小字体以显示更多文本。 845 846> **说明:** 847> 848> 组件设置为内联输入风格,编辑态与非编辑态存在字体大小不一致情况。 849 850**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 851 852**系统能力:** SystemCapability.ArkUI.ArkUI.Full 853 854**参数:** 855 856| 参数名 | 类型 | 必填 | 说明 | 857| ------ | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | 858| value | [TextHeightAdaptivePolicy](ts-appendix-enums.md#textheightadaptivepolicy10) | 是 | 文本自适应高度的方式。<br/>默认值:TextHeightAdaptivePolicy.MAX_LINES_FIRST | 859 860### showPassword<sup>12+</sup> 861 862showPassword(visible: boolean) 863 864设置密码的显隐状态。 865 866当[输入框的类型](#inputtype枚举说明)设置为Password、NEW_PASSWORD和NUMBER_PASSWORD模式时,密码保护功能才能生效。非密码输入模式则不会触发该功能。 867 868密码模式时,由于输入框后端的状态和前端应用侧的状态管理变量会不一致,可能导致末尾图标的状态异常。建议在[onSecurityStateChange](#onsecuritystatechange12)上增加状态同步。参考[示例1](#示例1设置与获取光标位置)。 869 870**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 871 872**系统能力:** SystemCapability.ArkUI.ArkUI.Full 873 874**参数:** 875 876| 参数名 | 类型 | 必填 | 说明 | 877| ------ | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | 878| visible | boolean | 是 | 是否显示密码。<br/>默认值:false | 879 880### lineBreakStrategy<sup>12+</sup> 881 882lineBreakStrategy(strategy: LineBreakStrategy) 883 884设置折行规则。该属性在wordBreak不等于breakAll的时候生效,不支持连词符。 885 886**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 887 888**系统能力:** SystemCapability.ArkUI.ArkUI.Full 889 890**参数:** 891 892| 参数名 | 类型 | 必填 | 说明 | 893| -------- | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | 894| strategy | [LineBreakStrategy](ts-appendix-enums.md#linebreakstrategy12) | 是 | 文本的折行规则。 <br />默认值:LineBreakStrategy.GREEDY <br/>**说明:**<br/>仅设置内联模式时该属性生效。 | 895 896### editMenuOptions<sup>12+</sup> 897 898editMenuOptions(editMenu: EditMenuOptions) 899 900设置自定义菜单扩展项,允许用户设置扩展项的文本内容、图标、回调方法。 901 902**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 903 904**系统能力:** SystemCapability.ArkUI.ArkUI.Full 905 906**参数:** 907 908| 参数名 | 类型 | 必填 | 说明 | 909| ------ | --------------------------------------------- | ---- | --------------------------------------------- | 910| editMenu | [EditMenuOptions](ts-text-common.md#editmenuoptions) | 是 | 扩展菜单选项。 | 911 912### enablePreviewText<sup>12+</sup> 913 914enablePreviewText(enable: boolean) 915 916设置是否开启输入预上屏。 917 918预上屏内容定义为文字暂存态,目前不支持文字拦截功能,因此不触发onWillInsert、onDidInsert、onWillDelete、onDidDelete回调。 919 920**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 921 922**系统能力:** SystemCapability.ArkUI.ArkUI.Full 923 924**参数:** 925 926| 参数名 | 类型 | 必填 | 说明 | 927| ------ | ------- | ---- | ---------------------------------- | 928| enable | boolean | 是 | 是否开启输入预上屏。<br/>默认值:true | 929 930### enableHapticFeedback<sup>13+</sup> 931 932enableHapticFeedback(isEnabled: boolean) 933 934设置是否开启触控反馈。 935 936**原子化服务API:** 从API version 13开始,该接口支持在原子化服务中使用。 937 938**系统能力:** SystemCapability.ArkUI.ArkUI.Full 939 940**参数:** 941 942| 参数名 | 类型 | 必填 | 说明 | 943| ------ | ------- | ---- | ---------------------------------- | 944| isEnabled | boolean | 是 | 是否开启触控反馈。<br/>默认值:true | 945 946> **说明:** 947> 948> 开启触控反馈时,需要在工程的module.json5中配置requestPermissions字段以开启振动权限,配置如下: 949> ```json 950> "requestPermissions": [ 951> { 952> "name": "ohos.permission.VIBRATE", 953> } 954> ] 955> ``` 956 957### keyboardAppearance<sup>15+</sup> 958 959keyboardAppearance(appearance: Optional\<KeyboardAppearance>) 960 961设置输入框拉起的键盘样式。 962 963**原子化服务API:** 从API version 15开始,该接口支持在原子化服务中使用。 964 965**系统能力:** SystemCapability.ArkUI.ArkUI.Full 966 967**参数:** 968 969| 参数名 | 类型 | 必填 | 说明 | 970| ------ | ----------------------------------------- | ---- | ------------------------------------------------------ | 971| appearance | [Optional](ts-universal-attributes-custom-property.md#optional12)\<[KeyboardAppearance](ts-text-common.md#keyboardappearance15枚举说明)> | 是 | 键盘样式。<br/>默认值:KeyboardAppearance.NONE_IMMERSIVE | 972 973### stopBackPress<sup>15+<sup> 974 975stopBackPress(isStopped: Optional\<boolean>) 976 977设置是否阻止返回键向其它组件或应用侧传递。 978 979**原子化服务API:** 从API version 15开始,该接口支持在原子化服务中使用。 980 981**系统能力:** SystemCapability.ArkUI.ArkUI.Full 982 983**参数:** 984 985| 参数名 | 类型 | 必填 | 说明 | 986| ------ | --------------------------------------------------- | ---- | ----------------------------------------- | 987| isStopped | [Optional](ts-universal-attributes-custom-property.md#optional12)\<boolean> | 是 | 是否消费返回键。 <br />默认值:true | 988 989### halfLeading<sup>18+</sup> 990 991halfLeading(halfLeading: Optional\<boolean>) 992 993设置文本是否将行间距平分至行的顶部与底部。 994 995**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 996 997**系统能力:** SystemCapability.ArkUI.ArkUI.Full 998 999**参数:** 1000 1001| 参数名 | 类型 | 必填 | 说明 | 1002| ------ | --------------------------------------------- | ---- | --------------------------------------------- | 1003| halfLeading | [Optional](ts-universal-attributes-custom-property.md#optional12)\<boolean> | 是 | 文本是否将行间距平分至行的顶部与底部。<br/>true表示将行间距平分至行的顶部与底部,false则不平分。<br/>默认值:false | 1004 1005### minFontScale<sup>18+</sup> 1006 1007minFontScale(scale: Optional\<number | Resource>) 1008 1009设置文本最小的字体缩放倍数。 1010 1011**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 1012 1013**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1014 1015**参数:** 1016 1017| 参数名 | 类型 | 必填 | 说明 | 1018| ------ | --------------------------------------------- | ---- | --------------------------------------------- | 1019| scale | [Optional](ts-universal-attributes-custom-property.md#optional12)\<number \| [Resource](ts-types.md#resource)> | 是 | 文本最小的字体缩放倍数,支持undefined类型。<br/>取值范围:[0, 1]<br/>**说明:** <br/>设置的值小于0时,按值为0处理。设置的值大于1,按值为1处理。异常值默认不生效。<br/>使用前需在工程中配置configuration.json文件和app.json5文件,具体详见[示例18设置最小字体范围与最大字体范围](#示例18设置最小字体范围与最大字体范围)。 | 1020 1021### maxFontScale<sup>18+</sup> 1022 1023maxFontScale(scale: Optional\<number | Resource>) 1024 1025设置文本最大的字体缩放倍数。 1026 1027**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 1028 1029**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1030 1031**参数:** 1032 1033| 参数名 | 类型 | 必填 | 说明 | 1034| ------ | --------------------------------------------- | ---- | --------------------------------------------- | 1035| scale | [Optional](ts-universal-attributes-custom-property.md#optional12)\<number \| [Resource](ts-types.md#resource)> | 是 | 文本最大的字体缩放倍数,支持undefined类型。<br/>取值范围:[1, +∞)<br/>**说明:** <br/>设置的值小于1时,按值为1处理。异常值默认不生效。<br/>使用前需在工程中配置configuration.json文件和app.json5文件,具体详见[示例18设置最小字体范围与最大字体范围](#示例18设置最小字体范围与最大字体范围)。 | 1036 1037### cancelButton<sup>18+</sup> 1038 1039cancelButton(symbolOptions: CancelButtonSymbolOptions) 1040 1041设置右侧清除按钮样式。不支持内联模式。 1042 1043**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 1044 1045**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1046 1047**参数:** 1048 1049| 参数名 | 类型 | 必填 | 说明 | 1050| ------ | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | 1051| symbolOptions | [CancelButtonSymbolOptions](ts-basic-components-search.md#cancelbuttonsymboloptions12对象说明) | 是 | 右侧清除按钮样式。<br />默认值:<br />{<br />style: CancelButtonStyle.INPUT<br />} | 1052 1053### ellipsisMode<sup>18+</sup> 1054 1055ellipsisMode(mode: Optional\<EllipsisMode>) 1056 1057设置省略位置。ellipsisMode属性仅在内联模式下生效,需要配合overflow设置为TextOverflow.Ellipsis使用,单独设置ellipsisMode属性不生效。 1058 1059非编辑态时正常生效,编辑态时EllipsisMode.START和EllipsisMode.CENTER仅在maxline设置为1时生效,EllipsisMode.END正常生效。 1060 1061**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 1062 1063**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1064 1065**参数:** 1066 1067| 参数名 | 类型 | 必填 | 说明 | 1068| ------ | --------------------------------------------------- | ---- | ----------------------------------------- | 1069| mode | [Optional](ts-universal-attributes-custom-property.md#optional12)\<[EllipsisMode](ts-appendix-enums.md#ellipsismode11)> | 是 | 省略位置。 <br />默认值:EllipsisMode.END | 1070 1071## InputType枚举说明 1072 1073**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1074 1075| 名称 | 说明 | 1076| ----------------------------- | ------------------------------------------------------------ | 1077| Normal | 基本输入模式,无特殊限制。<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 1078| Password | 密码输入模式。<br/>密码显示小眼睛图标,默认输入文字短暂显示后变成圆点,从API version 12开始,特定设备上输入文字直接显示为圆点。密码输入模式不支持下划线样式。在已启用密码保险箱的情况下,支持用户名、密码的自动保存和自动填充。<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 1079| Email | 邮箱地址输入模式。<br/>支持数字、字母、下划线、小数点、!、#、$、%、&、'、"、*、+、-、/、=、?、^、`、\{、\|、\}、~,以及@字符(只能存在一个@字符)。<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 1080| Number | 纯数字输入模式。<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 1081| PhoneNumber<sup>9+</sup> | 电话号码输入模式。<br/>支持输入数字、空格、+ 、-、*、#、(、),长度不限。<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 1082| USER_NAME<sup>11+</sup> | 用户名输入模式。<br/>在已启用密码保险箱的情况下,支持用户名、密码的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1083| NEW_PASSWORD<sup>11+</sup> | 新密码输入模式。<br/>密码显示小眼睛图标,默认输入文字短暂显示后变成圆点,从API version 12开始,特定设备上输入文字直接显示为圆点。在已启用密码保险箱的情况下,支持自动生成新密码。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1084| NUMBER_PASSWORD<sup>11+</sup> | 纯数字密码输入模式。<br/>密码显示小眼睛图标,默认输入文字短暂显示后变成圆点,从API version 12开始,特定设备上输入文字直接显示为圆点。密码输入模式不支持下划线样式。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1085| NUMBER_DECIMAL<sup>11+</sup> | 带小数点的数字输入模式。<br/>支持数字,小数点(只能存在一个小数点)。<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 1086| URL<sup>12+</sup> | 带URL的输入模式。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1087 1088## ContentType<sup>12+</sup>枚举说明 1089 1090自动填充类型。 1091 1092**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1093 1094| 名称 | 值 | 说明 | 1095| -------------------------- | ---- | ------------------------------------------------------------ | 1096| USER_NAME | 0 | 【用户名】在已启用密码保险箱的情况下,支持用户名的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1097| PASSWORD | 1 | 【密码】在已启用密码保险箱的情况下,支持密码的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1098| NEW_PASSWORD | 2 | 【新密码】在已启用密码保险箱的情况下,支持自动生成新密码。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1099| FULL_STREET_ADDRESS | 3 | 【详细地址】在已启用情景化自动填充的情况下,支持详细地址的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1100| HOUSE_NUMBER | 4 | 【门牌号】在已启用情景化自动填充的情况下,支持门牌号的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1101| DISTRICT_ADDRESS | 5 | 【区/县】在已启用情景化自动填充的情况下,支持区/县的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1102| CITY_ADDRESS | 6 | 【市】在已启用情景化自动填充的情况下,支持市的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1103| PROVINCE_ADDRESS | 7 | 【省】在已启用情景化自动填充的情况下,支持省的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1104| COUNTRY_ADDRESS | 8 | 【国家】在已启用情景化自动填充的情况下,支持国家的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1105| PERSON_FULL_NAME | 9 | 【姓名】在已启用情景化自动填充的情况下,支持姓名的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1106| PERSON_LAST_NAME | 10 | 【姓氏】在已启用情景化自动填充的情况下,支持姓氏的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1107| PERSON_FIRST_NAME | 11 | 【名字】在已启用情景化自动填充的情况下,支持名字的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1108| PHONE_NUMBER | 12 | 【手机号码】在已启用情景化自动填充的情况下,支持手机号码的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1109| PHONE_COUNTRY_CODE | 13 | 【国家代码】在已启用情景化自动填充的情况下,支持国家代码的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1110| FULL_PHONE_NUMBER | 14 | 【包含国家代码的手机号码】在已启用情景化自动填充的情况下,支持包含国家代码的手机号码的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1111| EMAIL_ADDRESS | 15 | 【邮箱地址】在已启用情景化自动填充的情况下,支持邮箱地址的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1112| BANK_CARD_NUMBER | 16 | 【银行卡号】在已启用情景化自动填充的情况下,支持银行卡号的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1113| ID_CARD_NUMBER | 17 | 【身份证号】在已启用情景化自动填充的情况下,支持身份证号的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1114| NICKNAME | 23 | 【昵称】在已启用情景化自动填充的情况下,支持昵称的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1115| DETAIL_INFO_WITHOUT_STREET | 24 | 【无街道地址】在已启用情景化自动填充的情况下,支持无街道地址的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1116| FORMAT_ADDRESS | 25 | 【标准地址】在已启用情景化自动填充的情况下,支持标准地址的自动保存和自动填充。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1117| PASSPORT_NUMBER<sup>18+</sup> | 26 | 【护照号】在已启用情景化自动填充的情况下,支持护照号的自动保存和自动填充。<br/>**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 | 1118| VALIDITY<sup>18+</sup> | 27 | 【护照有效期】在已启用情景化自动填充的情况下,支持护照有效期的自动保存和自动填充。<br/>**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 | 1119| ISSUE_AT<sup>18+</sup> | 28 | 【护照签发地】在已启用情景化自动填充的情况下,支持护照签发地的自动保存和自动填充。<br/>**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 | 1120| ORGANIZATION<sup>18+</sup> | 29 | 【发票抬头名称】在已启用情景化自动填充的情况下,支持发票抬头名称的自动保存和自动填充。<br/>**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 | 1121| TAX_ID<sup>18+</sup> | 30 | 【税号】在已启用情景化自动填充的情况下,支持税号的自动保存和自动填充。<br/>**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 | 1122| ADDRESS_CITY_AND_STATE<sup>18+</sup> | 31 | 【所在地区】在已启用情景化自动填充的情况下,支持所在地区的自动保存和自动填充。<br/>**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 | 1123| FLIGHT_NUMBER<sup>18+</sup> | 32 | 【航班号】暂不支持自动保存和自动填充。<br/>**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 | 1124| LICENSE_NUMBER<sup>18+</sup> | 33 | 【驾驶证号】暂不支持自动保存和自动填充。<br/>**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 | 1125| LICENSE_FILE_NUMBER<sup>18+</sup> | 34 | 【驾驶证档案编号】暂不支持自动保存和自动填充。<br/>**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 | 1126| LICENSE_PLATE<sup>18+</sup> | 35 | 【车牌号】在已启用情景化自动填充的情况下,支持车牌号的自动保存和自动填充。<br/>**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 | 1127| ENGINE_NUMBER<sup>18+</sup> | 36 | 【行驶证发动机号】暂不支持自动保存和自动填充。<br/>**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 | 1128| LICENSE_CHASSIS_NUMBER<sup>18+</sup> | 37 | 【车牌识别号】暂不支持自动保存和自动填充。<br/>**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 | 1129 1130## TextInputStyle<sup>9+</sup>枚举说明 1131 1132**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 1133 1134**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1135 1136| 名称 | 说明 | 1137| ------- | ------------------------------------------------------------ | 1138| Default | 默认风格,光标宽1.5vp,光标高度与文本选中底板高度和字体大小相关。 | 1139| Inline | 内联输入风格。文本选中底板高度与输入框高度相同。<br/>内联输入是在有明显的编辑态/非编辑态的区分场景下使用,例如:文件列表视图中的重命名。<br/>不支持showError属性。<br/>内联模式下,不支持拖入文本。 | 1140 1141## PasswordIcon<sup>10+</sup>对象说明 1142 1143**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 1144 1145**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1146 1147| 名称 | 类型 | 必填 | 说明 | 1148| ---- | ----- | ---- | ---- | 1149| onIconSrc | string \| [Resource](ts-types.md#resource) | 否 | 密码输入模式时,能够切换密码隐藏的显示状态的图标。<br/>string格式可用于加载网络图片和本地图片。 | 1150| offIconSrc | string \| [Resource](ts-types.md#resource) | 否 | 密码输入模式时,能够切换密码显示的隐藏状态的图标。<br/>string格式可用于加载网络图片和本地图片。 | 1151 1152## EnterKeyType枚举说明 1153 1154输入法回车键类型。 1155 1156**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1157 1158| 名称 | 值 | 说明 | 1159| ---------------------- | --- | ------------------ | 1160| Go | 2 | 显示为开始样式。<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 1161| Search | 3 | 显示为搜索样式。 <br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 1162| Send | 4 | 显示为发送样式。 <br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 1163| Next | 5 | 显示为下一步样式。<br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 1164| Done | 6 | 显示为完成样式。 <br/>**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 | 1165| PREVIOUS<sup>11+</sup> | 7 | 显示为上一步样式。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1166| NEW_LINE<sup>11+</sup> | 8 | 显示为换行样式。 <br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 1167 1168 1169## 事件 1170 1171除支持[通用事件](ts-component-general-events.md)外,还支持以下事件: 1172 1173### onChange 1174 1175onChange(callback: EditableTextOnChangeCallback) 1176 1177输入内容发生变化时,触发该回调。 1178 1179在本回调中,若执行了光标操作,需要开发者在预上屏场景下依据previewText参数调整光标逻辑,以适应预上屏场景。 1180 1181**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 1182 1183**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1184 1185**参数:** 1186 1187| 参数名 | 类型 | 必填 | 说明 | 1188| ------ | ------ | ---- | -------------------- | 1189| callback | [EditableTextOnChangeCallback](ts-text-common.md#editabletextonchangecallback12) | 是 | 当前输入文本内容变化时的回调。 | 1190 1191### onSubmit 1192 1193onSubmit(callback: OnSubmitCallback) 1194 1195按下输入法回车键触发该回调。 1196 1197**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 1198 1199**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1200 1201**参数:** 1202 1203| 参数名 | 类型 | 必填 | 说明 | 1204| ------------------- | ------------------------------------------------ | ---- | ------------------------------------------------------------ | 1205| callback | [OnSubmitCallback](#onsubmitcallback18) | 是 | 提交回调。 | 1206 1207### onEditChanged<sup>(deprecated)</sup> 1208 1209onEditChanged(callback: (isEditing: boolean) => void) 1210 1211输入状态变化时,触发该回调。 1212 1213从API 8开始废弃,建议使用onEditChange。 1214 1215**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1216 1217**参数:** 1218 1219| 参数名 | 类型 | 必填 | 说明 | 1220| --------- | ------- | ---- | -------------------- | 1221| isEditing | boolean | 是 | 为true表示正在输入。 | 1222 1223### onEditChange<sup>8+</sup> 1224 1225onEditChange(callback: Callback\<boolean>) 1226 1227输入状态变化时,触发该回调。有光标时为编辑态,无光标时为非编辑态。 1228 1229**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 1230 1231**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1232 1233**参数:** 1234 1235| 参数名 | 类型 | 必填 | 说明 | 1236| --------- | ------- | ---- | -------------------- | 1237| callback | Callback\<boolean> | 是 | 输入状态变化回调,返回值为true表示正在输入。 | 1238 1239### onCopy<sup>8+</sup> 1240 1241onCopy(callback: Callback\<string>) 1242 1243进行复制操作时,触发该回调。 1244 1245**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 1246 1247**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1248 1249**参数:** 1250 1251| 参数名 | 类型 | 必填 | 说明 | 1252| --------- | ------- | ---- | ---------------- | 1253| callback | Callback\<string> | 是 | 复制回调,其返回值为复制的文本内容。 | 1254 1255### onCut<sup>8+</sup> 1256 1257onCut(callback: Callback\<string>) 1258 1259进行剪切操作时,触发该回调。 1260 1261**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 1262 1263**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1264 1265**参数:** 1266 1267| 参数名 | 类型 | 必填 | 说明 | 1268| --------- | ------- | ---- | ---------------- | 1269| callback | Callback\<string> | 是 | 剪切回调,其返回值为剪切的文本内容。 | 1270 1271### onPaste<sup>8+</sup> 1272 1273onPaste(callback: OnPasteCallback) 1274 1275进行粘贴操作时,触发该回调。 1276 1277**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 1278 1279**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1280 1281**参数:** 1282| 参数名 | 类型 | 必填 | 说明 | 1283| ------------------- | ------------------------------------------------------------ | ---- | ---------------------- | 1284| callback | [OnPasteCallback](#onpastecallback18) | 是 | 粘贴回调。 | 1285 1286### onTextSelectionChange<sup>10+</sup> 1287 1288onTextSelectionChange(callback: OnTextSelectionChangeCallback) 1289 1290文本选择的位置或编辑状态下光标位置发生变化时,触发该回调。 1291 1292**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 1293 1294**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1295 1296**参数:** 1297 1298| 参数名 | 类型 | 必填 | 说明 | 1299| -------------- | ------ | ---- | --------------------------------------- | 1300| callback | [OnTextSelectionChangeCallback](#ontextselectionchangecallback18) | 是 | 文本选择变化回调或光标位置变化回调。 | 1301 1302### onContentScroll<sup>10+</sup> 1303 1304onContentScroll(callback: OnContentScrollCallback) 1305 1306文本内容滚动时,触发该回调。 1307 1308**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 1309 1310**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1311 1312**参数:** 1313 1314| 参数名 | 类型 | 必填 | 说明 | 1315| ------------ | ------ | ---- | ---------------------------------- | 1316| callback | [OnContentScrollCallback](#oncontentscrollcallback18) | 是 | 文本内容滚动回调。 | 1317 1318### onSecurityStateChange<sup>12+</sup> 1319 1320onSecurityStateChange(callback: Callback\<boolean>) 1321 1322密码显隐状态切换时,触发该回调。 1323 1324**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 1325 1326**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1327 1328**参数:** 1329 1330| 参数名 | 类型 | 必填 | 说明 | 1331| ------------ | ------ | ---- | ---------------------------------- | 1332| callback | Callback\<boolean> | 是 | 回调函数。| 1333 1334### onWillInsert<sup>12+</sup> 1335 1336onWillInsert(callback: Callback\<InsertValue, boolean>) 1337 1338在将要输入时,触发该回调。 1339 1340**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 1341 1342**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1343 1344**参数:** 1345 1346| 参数名 | 类型 | 必填 | 说明 | 1347| ------ | ------------------------------------------------------------ | ---- | ------------------ | 1348| callback | Callback\<[InsertValue](ts-text-common.md#insertvalue12对象说明), boolean> | 是 | 在将要输入时调用的回调。<br/>在返回true时,表示正常插入,返回false时,表示不插入。<br/>在预上屏和候选词操作时,该回调不触发。<br/>仅支持系统输入法输入的场景。 | 1349 1350### onDidInsert<sup>12+</sup> 1351 1352onDidInsert(callback: Callback\<InsertValue>) 1353 1354在输入完成时,触发该回调。 1355 1356**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 1357 1358**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1359 1360**参数:** 1361 1362| 参数名 | 类型 | 必填 | 说明 | 1363| ------ | ------------------------------------------------------------ | ---- | ------------------ | 1364| callback | Callback\<[InsertValue](ts-text-common.md#insertvalue12对象说明)> | 是 | 在输入完成时调用的回调。<br/>仅支持系统输入法输入的场景。 | 1365 1366### onWillDelete<sup>12+</sup> 1367 1368onWillDelete(callback: Callback\<DeleteValue, boolean>) 1369 1370在将要删除时,触发该回调。 1371 1372**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 1373 1374**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1375 1376**参数:** 1377 1378| 参数名 | 类型 | 必填 | 说明 | 1379| ------ | ------------------------------------------------------------ | ---- | ------------------ | 1380| callback | Callback\<[DeleteValue](ts-text-common.md#deletevalue12对象说明), boolean> | 是 | 在将要删除时调用的回调。<br/>在返回true时,表示正常删除,返回false时,表示不删除。<br/>在预上屏删除操作时,该回调不触发。<br/>仅支持系统输入法输入的场景。 | 1381 1382### onDidDelete<sup>12+</sup> 1383 1384onDidDelete(callback: Callback\<DeleteValue>) 1385 1386在删除完成时,触发该回调。 1387 1388**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 1389 1390**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1391 1392**参数:** 1393 1394| 参数名 | 类型 | 必填 | 说明 | 1395| ------ | ------------------------------------------------------------ | ---- | ------------------ | 1396| callback | Callback\<[DeleteValue](ts-text-common.md#deletevalue12对象说明)> | 是 | 在删除完成时调用的回调。<br/>仅支持系统输入法输入的场景。 | 1397 1398### onWillChange<sup>15+</sup> 1399 1400onWillChange(callback: Callback\<EditableTextChangeValue, boolean>) 1401 1402在文本内容将要发生变化时,触发该回调。 1403 1404onWillChange的回调时序晚于onWillInsert、onWillDelete,早于onDidInsert、onDidDelete。 1405 1406**原子化服务API:** 从API version 15开始,该接口支持在原子化服务中使用。 1407 1408**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1409 1410**参数:** 1411 1412| 参数名 | 类型 | 必填 | 说明 | 1413| ------ | ------------------------------------------------------------ | ---- | ------------------ | 1414| callback | Callback\<[EditableTextChangeValue](ts-text-common.md#editabletextchangevalue15), boolean> | 是 | 在文本内容将要发生变化时的回调。<br/>返回true时,表示正常修改。返回false时,表示拦截此次触发。 | 1415 1416## TextInputController<sup>8+</sup> 1417 1418TextInput组件的控制器继承自[TextContentControllerBase](ts-types.md#textcontentcontrollerbase10)。 1419 1420**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 1421 1422**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1423 1424### 导入对象 1425``` 1426controller: TextInputController = new TextInputController() 1427``` 1428 1429### constructor<sup>8+</sup> 1430 1431constructor() 1432 1433TextInputController的构造函数。 1434 1435**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 1436 1437**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1438 1439### caretPosition<sup>8+</sup> 1440 1441caretPosition(value: number): void 1442 1443设置输入光标的位置。当取值小于0时,取0,大于文本长度时,显示在文本末尾。 1444 1445**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 1446 1447**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1448 1449**参数:** 1450 1451| 参数名 | 类型 | 必填 | 说明 | 1452| ----- | ------ | ---- | ------ | 1453| value | number | 是 | 从字符串开始到光标所在位置的字符长度。 | 1454### setTextSelection<sup>10+</sup> 1455 1456setTextSelection(selectionStart: number, selectionEnd: number, options?: SelectionOptions): void 1457 1458设置文本选择区域并高亮显示。 1459 1460**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 1461 1462**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1463 1464**参数:** 1465 1466| 参数名 | 类型 | 必填 | 说明 | 1467| ------- | ------ | ---- | ----- | 1468| selectionStart | number | 是 | 文本选择区域起始位置,文本框中文字的起始位置为0。 | 1469| selectionEnd | number | 是 | 文本选择区域结束位置。 | 1470| options<sup>12+</sup> | [SelectionOptions](ts-types.md#selectionoptions12对象说明) | 否 | 选中文字时的配置。<br />默认值:MenuPolicy.DEFAULT<br/>从API version 12开始,该接口中的options参数支持在原子化服务中使用。 | 1471 1472> **说明:** 1473> 1474> 如果selectionStart或selectionEnd被赋值为undefined时,当作0处理。 1475> 1476> 如果selectionMenuHidden被赋值为true或设备为2in1时,即使options被赋值为MenuPolicy.SHOW,调用setTextSelection也不弹出菜单。 1477> 1478> 如果emoji表情被选中区域截断时,表情的起始位置包含在设置的文本选中区域内就会被选中。 1479 1480### stopEditing<sup>10+</sup> 1481 1482stopEditing(): void 1483 1484退出编辑态。 1485 1486**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 1487 1488**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1489 1490## UnderlineColor<sup>12+</sup>对象说明 1491 1492**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 1493 1494**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1495 1496| 名称 | 类型 | 必填 | 说明 | 1497| ---- | ----- | ---- | ---- | 1498| typing | [ResourceColor](ts-types.md#resourcecolor) \| undefined | 否 | 键入时下划线颜色。不填写、undefined、null、无效值时恢复默认。 | 1499| normal | [ResourceColor](ts-types.md#resourcecolor) \| undefined | 否 | 非特殊状态时下划线颜色。不填写、undefined、null、无效值时恢复默认。 | 1500| error | [ResourceColor](ts-types.md#resourcecolor) \| undefined | 否 | 错误时下划线颜色。不填写、undefined、null、无效值时恢复默认。此选项会修改showCounter属性中达到最大字符数时的颜色。 | 1501| disable | [ResourceColor](ts-types.md#resourcecolor) \| undefined | 否 | 禁用时下划线颜色。不填写、undefined、null、无效值时恢复默认。 | 1502 1503## SubmitEvent<sup>11+</sup> 1504 1505定义用户提交事件。 1506 1507**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 1508 1509**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1510 1511### 属性 1512 1513**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 1514 1515**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1516 1517| 名称 | 类型 | 必填 | 说明 | 1518| ---- | ----- | ---- | ---- | 1519| text | string | 是 | 输入框文本内容。 | 1520 1521### keepEditableState 1522 1523keepEditableState(): void 1524 1525用户自定义输入框编辑状态,调用时保持编辑态。 1526 1527**原子化服务API:** 从API version 11开始,该接口支持在原子化服务中使用。 1528 1529**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1530 1531## OnPasteCallback<sup>18+</sup> 1532 1533type OnPasteCallback = (content: string, event: PasteEvent) => void 1534 1535粘贴回调。 1536 1537**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 1538 1539**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1540 1541**参数:** 1542 1543| 参数名 | 类型 | 必填 | 说明 | 1544| ------------------- | ------------------------------------------------------------ | ---- | ---------------------- | 1545| content | string | 是 | 粘贴的文本内容。 | 1546| event | [PasteEvent](ts-basic-components-richeditor.md#pasteevent11) | 是 | 用户自定义的粘贴事件。 | 1547 1548## OnSubmitCallback<sup>18+</sup> 1549 1550type OnSubmitCallback = (enterKey: EnterKeyType, event: SubmitEvent) => void 1551 1552提交回调。 1553 1554**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 1555 1556**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1557 1558**参数:** 1559 1560| 参数名 | 类型 | 必填 | 说明 | 1561| ------------------- | ------------------------------------------------ | ---- | ------------------------------------------------------------ | 1562| enterKey | [EnterKeyType](#enterkeytype枚举说明) | 是 | 输入法回车键类型。 | 1563| event | [SubmitEvent](#submitevent11) | 是 | 提交事件。 | 1564 1565## OnTextSelectionChangeCallback<sup>18+</sup> 1566 1567type OnTextSelectionChangeCallback = (selectionStart: number, selectionEnd: number) => void 1568 1569文本选择变化回调或光标位置变化回调。 1570 1571**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 1572 1573**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1574 1575**参数:** 1576 1577| 参数名 | 类型 | 必填 | 说明 | 1578| -------------- | ------ | ---- | --------------------------------------- | 1579| selectionStart | number | 是 | 所选文本的起始位置,文字的起始位置为0。 | 1580| selectionEnd | number | 是 | 所选文本的结束位置。 | 1581 1582## OnContentScrollCallback<sup>18+</sup> 1583 1584type OnContentScrollCallback = (totalOffsetX: number, totalOffsetY: number) => void 1585 1586文本内容滚动回调。 1587 1588**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 1589 1590**系统能力:** SystemCapability.ArkUI.ArkUI.Full 1591 1592**参数:** 1593 1594| 参数名 | 类型 | 必填 | 说明 | 1595| ------------ | ------ | ---- | ---------------------------------- | 1596| totalOffsetX | number | 是 | 文本在内容区的横坐标偏移,单位px。 | 1597| totalOffsetY | number | 是 | 文本在内容区的纵坐标偏移,单位px。 | 1598 1599## 示例 1600 1601### 示例1(设置与获取光标位置) 1602 1603该示例通过controller实现了光标位置的设置与获取的功能。 1604 1605```ts 1606// xxx.ets 1607@Entry 1608@Component 1609struct TextInputExample { 1610 @State text: string = '' 1611 @State positionInfo: CaretOffset = { index: 0, x: 0, y: 0 } 1612 @State passwordState: boolean = false 1613 controller: TextInputController = new TextInputController() 1614 1615 build() { 1616 Column() { 1617 // 使用!!实现text参数的双向数据绑定 1618 TextInput({ text: this.text!!, placeholder: 'input your word...', controller: this.controller }) 1619 .placeholderColor(Color.Grey) 1620 .placeholderFont({ size: 14, weight: 400 }) 1621 .caretColor(Color.Blue) 1622 .width('95%') 1623 .height(40) 1624 .margin(20) 1625 .fontSize(14) 1626 .fontColor(Color.Black) 1627 .inputFilter('[a-z]', (e) => { 1628 console.log(JSON.stringify(e)) 1629 }) 1630 Text(this.text) 1631 Button('Set caretPosition 1') 1632 .margin(15) 1633 .onClick(() => { 1634 // 将光标移动至第一个字符后 1635 this.controller.caretPosition(1) 1636 }) 1637 Button('Get CaretOffset') 1638 .margin(15) 1639 .onClick(() => { 1640 this.positionInfo = this.controller.getCaretOffset() 1641 }) 1642 // 密码输入框 1643 TextInput({ placeholder: 'input your password...' }) 1644 .width('95%') 1645 .height(40) 1646 .margin(20) 1647 .type(InputType.Password) 1648 .maxLength(9) 1649 .showPasswordIcon(true) 1650 .showPassword(this.passwordState) 1651 .onSecurityStateChange(((isShowPassword: boolean) => { 1652 // 更新密码显示状态 1653 console.info('isShowPassword', isShowPassword) 1654 this.passwordState = isShowPassword 1655 })) 1656 // 邮箱地址自动填充类型 1657 TextInput({ placeholder: 'input your email...' }) 1658 .width('95%') 1659 .height(40) 1660 .margin(20) 1661 .contentType(ContentType.EMAIL_ADDRESS) 1662 .maxLength(9) 1663 // 内联风格输入框 1664 TextInput({ text: 'inline style' }) 1665 .width('95%') 1666 .height(50) 1667 .margin(20) 1668 .borderRadius(0) 1669 .style(TextInputStyle.Inline) 1670 }.width('100%') 1671 } 1672} 1673``` 1674 1675 1676 1677### 示例2(设置下划线) 1678 1679该示例通过showUnderline、showError、showUnit、passwordIcon属性展示了下划线在不同场景的效果。 1680 1681```ts 1682// xxx.ets 1683@Entry 1684@Component 1685struct TextInputExample { 1686 @State passWordSrc1: Resource = $r('app.media.ImageOne'); 1687 @State passWordSrc2: Resource = $r('app.media.ImageTwo'); 1688 @State textError: string = ''; 1689 @State text: string = ''; 1690 @State nameText: string = 'test'; 1691 1692 @Builder 1693 itemEnd() { 1694 Select([{ value: 'KB' }, 1695 { value: 'MB' }, 1696 { value: 'GB' }, 1697 { value: 'TB', }]) 1698 .height("48vp") 1699 .borderRadius(0) 1700 .selected(2) 1701 .align(Alignment.Center) 1702 .value('MB') 1703 .font({ size: 20, weight: 500 }) 1704 .fontColor('#182431') 1705 .selectedOptionFont({ size: 20, weight: 400 }) 1706 .optionFont({ size: 20, weight: 400 }) 1707 .backgroundColor(Color.Transparent) 1708 .responseRegion({ 1709 height: "40vp", 1710 width: "80%", 1711 x: '10%', 1712 y: '6vp' 1713 }) 1714 .onSelect((index: number) => { 1715 console.info('Select:' + index); 1716 }) 1717 } 1718 1719 build() { 1720 Column({ space: 20 }) { 1721 // 自定义密码显示图标 1722 TextInput({ placeholder: 'user define password icon' }) 1723 .type(InputType.Password) 1724 .width(350) 1725 .height(60) 1726 .passwordIcon({ onIconSrc: this.passWordSrc1, offIconSrc: this.passWordSrc2 }) 1727 // 下划线模式 1728 TextInput({ placeholder: 'underline style' }) 1729 .showUnderline(true) 1730 .width(350) 1731 .height(60) 1732 .showError('Error') 1733 .showUnit(this.itemEnd) 1734 1735 Text(`用户名:${this.text}`) 1736 .width(350) 1737 TextInput({ placeholder: '请输入用户名', text: this.text }) 1738 .showUnderline(true) 1739 .width(350) 1740 .showError(this.textError) 1741 .onChange((value: string) => { 1742 this.text = value 1743 }) 1744 .onSubmit((enterKey: EnterKeyType, event: SubmitEvent) => { 1745 // 用户名不正确会清空输入框和用户名并提示错误文本 1746 if (this.text == this.nameText) { 1747 this.textError = ''; 1748 } else { 1749 this.textError = '用户名输入错误'; 1750 this.text = ''; 1751 // 调用keepEditableState方法,输入框保持编辑态 1752 event.keepEditableState(); 1753 } 1754 }) 1755 // 设置下划线颜色 1756 TextInput({ placeholder: '提示文本内容' }) 1757 .width(350) 1758 .showUnderline(true) 1759 .underlineColor({ 1760 normal: Color.Orange, 1761 typing: Color.Green, 1762 error: Color.Red, 1763 disable: Color.Gray 1764 }); 1765 TextInput({ placeholder: '提示文本内容' }) 1766 .width(350) 1767 .showUnderline(true) 1768 .underlineColor(Color.Gray); 1769 1770 }.width('100%').margin({ top: 10 }) 1771 } 1772} 1773``` 1774 1775 1776 1777### 示例3(设置自定义键盘) 1778 1779该示例通过customKeyboard属性实现了自定义键盘的功能。 1780 1781```ts 1782// xxx.ets 1783@Entry 1784@Component 1785struct TextInputExample { 1786 controller: TextInputController = new TextInputController(); 1787 @State inputValue: string = ""; 1788 1789 // 自定义键盘组件 1790 @Builder 1791 CustomKeyboardBuilder() { 1792 Column() { 1793 Button('x').onClick(() => { 1794 // 关闭自定义键盘 1795 this.controller.stopEditing(); 1796 }) 1797 Grid() { 1798 ForEach([1, 2, 3, 4, 5, 6, 7, 8, 9, '*', 0, '#'], (item: number | string) => { 1799 GridItem() { 1800 Button(item + "") 1801 .width(110).onClick(() => { 1802 this.inputValue += item; 1803 }) 1804 } 1805 }) 1806 }.maxCount(3).columnsGap(10).rowsGap(10).padding(5) 1807 }.backgroundColor(Color.Gray) 1808 } 1809 1810 build() { 1811 Column() { 1812 TextInput({ controller: this.controller, text: this.inputValue })// 绑定自定义键盘 1813 .customKeyboard(this.CustomKeyboardBuilder()).margin(10).border({ width: 1 }).height('48vp') 1814 } 1815 } 1816} 1817``` 1818 1819 1820 1821### 示例4(设置右侧清除按钮样式) 1822 1823该示例通过cancelButton属性展示了自定义右侧清除按钮样式的效果。 1824 1825```ts 1826// xxx.ets 1827@Entry 1828@Component 1829struct TextInputExample { 1830 @State text: string = ''; 1831 controller: TextInputController = new TextInputController(); 1832 1833 build() { 1834 Column() { 1835 TextInput({ placeholder: 'input ...', controller: this.controller }) 1836 .width(380) 1837 .height(60) 1838 .cancelButton({ 1839 style: CancelButtonStyle.CONSTANT, 1840 icon: { 1841 size: 45, 1842 src: $r('app.media.app_icon'), 1843 color: Color.Blue 1844 } 1845 }) 1846 .onChange((value: string) => { 1847 this.text = value; 1848 }) 1849 } 1850 } 1851} 1852``` 1853 1854 1855 1856### 示例5(设置计数器) 1857 1858该示例通过maxLength、showCounter、showUnderline属性实现了计数器的功能。 1859 1860```ts 1861// xxx.ets 1862@Entry 1863@Component 1864struct TextInputExample { 1865 @State text: string = ''; 1866 controller: TextInputController = new TextInputController(); 1867 1868 build() { 1869 Column() { 1870 TextInput({ text: this.text, controller: this.controller }) 1871 .placeholderFont({ size: 16, weight: 400 }) 1872 .width(336) 1873 .height(56) 1874 .maxLength(6) 1875 .showUnderline(true) 1876 .showCounter(true, 1877 { thresholdPercentage: 50, highlightBorder: true })//计数器显示效果为用户当前输入字符数/最大字符限制数。最大字符限制数通过maxLength()接口设置。 1878 //如果用户当前输入字符数达到最大字符限制乘50%(thresholdPercentage)。字符计数器显示。 1879 //用户设置highlightBorder为false时,配置取消红色边框。不设置此参数时,默认为true。 1880 .onChange((value: string) => { 1881 this.text = value; 1882 }) 1883 }.width('100%').height('100%').backgroundColor('#F1F3F5') 1884 } 1885} 1886``` 1887 1888 1889 1890 1891### 示例6(电话号码格式化) 1892 1893该示例通过onChange回调实现了电话号码格式化为XXX XXXX XXXX的功能。 1894 1895```ts 1896// xxx.ets 1897@Entry 1898@Component 1899struct TextInputExample { 1900 @State submitValue: string = ''; 1901 @State text: string = ''; 1902 public readonly NUM_TEXT_MAXSIZE_LENGTH = 13; 1903 @State teleNumberNoSpace: string = ""; 1904 @State nextCaret: number = -1; // 用于记录下次光标设置的位置 1905 @State actualCh: number = -1; // 用于记录光标在第i个数字后插入或者第i个数字前删除 1906 @State lastCaretPosition: number = 0; 1907 @State lastCaretPositionEnd: number = 0; 1908 controller: TextInputController = new TextInputController(); 1909 1910 isEmpty(str?: string): boolean { 1911 return str == 'undefined' || !str || !new RegExp("[^\\s]").test(str); 1912 } 1913 1914 checkNeedNumberSpace(numText: string) { 1915 let isSpace: RegExp = new RegExp('[\\+;,#\\*]', 'g'); 1916 let isRule: RegExp = new RegExp('^\\+.*'); 1917 1918 if (isSpace.test(numText)) { 1919 // 如果电话号码里有特殊字符,就不加空格 1920 if (isRule.test(numText)) { 1921 return true; 1922 } else { 1923 return false; 1924 } 1925 } 1926 return true; 1927 } 1928 1929 removeSpace(str: string): string { 1930 if (this.isEmpty(str)) { 1931 return ''; 1932 } 1933 return str.replace(new RegExp("[\\s]", "g"), ''); 1934 } 1935 1936 setCaret() { 1937 if (this.nextCaret != -1) { 1938 console.log("to keep caret position right, change caret to", this.nextCaret); 1939 this.controller.caretPosition(this.nextCaret); 1940 this.nextCaret = -1; 1941 } 1942 } 1943 1944 calcCaretPosition(nextText: string) { 1945 let befNumberNoSpace: string = this.removeSpace(this.text); 1946 this.actualCh = 0; 1947 if (befNumberNoSpace.length < this.teleNumberNoSpace.length) { // 插入场景 1948 for (let i = 0; i < this.lastCaretPosition; i++) { 1949 if (this.text[i] != ' ') { 1950 this.actualCh += 1; 1951 } 1952 } 1953 this.actualCh += this.teleNumberNoSpace.length - befNumberNoSpace.length; 1954 console.log("actualCh: " + this.actualCh); 1955 for (let i = 0; i < nextText.length; i++) { 1956 if (nextText[i] != ' ') { 1957 this.actualCh -= 1; 1958 if (this.actualCh <= 0) { 1959 this.nextCaret = i + 1; 1960 break; 1961 } 1962 } 1963 } 1964 } else if (befNumberNoSpace.length > this.teleNumberNoSpace.length) { // 删除场景 1965 if (this.lastCaretPosition === this.text.length) { 1966 console.log("Caret at last, no need to change"); 1967 } else if (this.lastCaretPosition === this.lastCaretPositionEnd) { 1968 // 按键盘上回退键一个一个删的情况 1969 for (let i = this.lastCaretPosition; i < this.text.length; i++) { 1970 if (this.text[i] != ' ') { 1971 this.actualCh += 1; 1972 } 1973 } 1974 for (let i = nextText.length - 1; i >= 0; i--) { 1975 if (nextText[i] != ' ') { 1976 this.actualCh -= 1; 1977 if (this.actualCh <= 0) { 1978 this.nextCaret = i; 1979 break; 1980 } 1981 } 1982 } 1983 } else { 1984 // 剪切/手柄选择 一次删多个字符 1985 this.nextCaret = this.lastCaretPosition; // 保持光标位置 1986 } 1987 } 1988 } 1989 1990 build() { 1991 Column() { 1992 Row() { 1993 TextInput({ text: `${this.text}`, controller: this.controller }).type(InputType.PhoneNumber).height('48vp') 1994 .onChange((number: string) => { 1995 this.teleNumberNoSpace = this.removeSpace(number); 1996 let nextText: string = ""; 1997 if (this.teleNumberNoSpace.length > this.NUM_TEXT_MAXSIZE_LENGTH - 2) { 1998 nextText = this.teleNumberNoSpace; 1999 } else if (this.checkNeedNumberSpace(number)) { 2000 if (this.teleNumberNoSpace.length <= 3) { 2001 nextText = this.teleNumberNoSpace; 2002 } else { 2003 let split1: string = this.teleNumberNoSpace.substring(0, 3); 2004 let split2: string = this.teleNumberNoSpace.substring(3); 2005 nextText = split1 + ' ' + split2; 2006 if (this.teleNumberNoSpace.length > 7) { 2007 split2 = this.teleNumberNoSpace.substring(3, 7); 2008 let split3: string = this.teleNumberNoSpace.substring(7); 2009 nextText = split1 + ' ' + split2 + ' ' + split3; 2010 } 2011 } 2012 } else { 2013 nextText = number; 2014 } 2015 console.log("onChange Triggered:" + this.text + "|" + nextText + "|" + number); 2016 if (this.text === nextText && nextText === number) { 2017 // 此时说明数字已经格式化完成了 在这个时候改变光标位置不会被重置掉 2018 this.setCaret(); 2019 } else { 2020 this.calcCaretPosition(nextText); 2021 } 2022 this.text = nextText; 2023 }) 2024 .onTextSelectionChange((selectionStart, selectionEnd) => { 2025 // 记录光标位置 2026 console.log("selection change: ", selectionStart, selectionEnd); 2027 this.lastCaretPosition = selectionStart; 2028 this.lastCaretPositionEnd = selectionEnd; 2029 }) 2030 } 2031 } 2032 .width('100%') 2033 .height("100%") 2034 } 2035} 2036``` 2037 2038 2039### 示例7(设置文本断行规则) 2040 2041该示例通过wordBreak属性实现了TextInput不同断行规则下的效果。 2042 2043```ts 2044// xxx.ets 2045@Entry 2046@Component 2047struct TextInputExample { 2048 @State textStrEn: string = 2049 'This is set wordBreak to WordBreak text Taumatawhakatangihangakoauauotamateaturipukakapikimaungahoronukupokaiwhenuakitanatahu.'; 2050 @State textStrZn: string = 2051 '多行文本输入框组件,当输入的文本内容超过组件宽度时会自动换行显示。\n高度未设置时,组件无默认高度,自适应内容高度。宽度未设置时,默认撑满最大宽度。'; 2052 2053 build() { 2054 Row() { 2055 Column() { 2056 Text("TextInput为inline模式,WordBreakType属性为NORMAL的样式:").fontSize(16).fontColor(0xCCCCCC) 2057 TextInput({ 2058 text: this.textStrEn 2059 }) 2060 .margin(10) 2061 .fontSize(16) 2062 .style(TextInputStyle.Inline)// Inline模式 2063 .wordBreak(WordBreak.NORMAL) // 非Inline模式该属性无效 2064 2065 Text("TextInput为inline模式,英文文本,WordBreakType属性为BREAK_ALL的样式:").fontSize(16).fontColor(0xCCCCCC) 2066 TextInput({ 2067 text: this.textStrEn 2068 }) 2069 .margin(10) 2070 .fontSize(16) 2071 .style(TextInputStyle.Inline) 2072 .wordBreak(WordBreak.BREAK_ALL) 2073 2074 Text("TextInput为inline模式,中文文本,WordBreakType属性为BREAK_ALL的样式:").fontSize(16).fontColor(0xCCCCCC) 2075 TextInput({ 2076 text: this.textStrZn 2077 }) 2078 .margin(10) 2079 .fontSize(16) 2080 .style(TextInputStyle.Inline) 2081 .wordBreak(WordBreak.BREAK_ALL) 2082 2083 Text("TextInput为inline模式,WordBreakType属性为BREAK_WORD的样式:").fontSize(16).fontColor(0xCCCCCC) 2084 TextInput({ 2085 text: this.textStrEn 2086 }) 2087 .margin(10) 2088 .fontSize(16) 2089 .style(TextInputStyle.Inline) 2090 .wordBreak(WordBreak.BREAK_WORD) 2091 }.width('100%') 2092 }.height('100%').margin(10) 2093 } 2094} 2095``` 2096 2097 2098### 示例8(设置文本样式) 2099 2100该示例通过lineHeight、letterSpacing、decoration属性展示了不同样式的文本效果。 2101 2102```ts 2103// xxx.ets 2104@Entry 2105@Component 2106struct TextInputExample { 2107 build() { 2108 Row() { 2109 Column() { 2110 Text('lineHeight').fontSize(9).fontColor(0xCCCCCC) 2111 TextInput({ text: 'lineHeight unset' }) 2112 .border({ width: 1 }).padding(10).margin(5) 2113 TextInput({ text: 'lineHeight 15' }) 2114 .border({ width: 1 }).padding(10).margin(5).lineHeight(15) 2115 TextInput({ text: 'lineHeight 30' }) 2116 .border({ width: 1 }).padding(10).margin(5).lineHeight(30) 2117 2118 Text('letterSpacing').fontSize(9).fontColor(0xCCCCCC) 2119 TextInput({ text: 'letterSpacing 0' }) 2120 .border({ width: 1 }).padding(5).margin(5).letterSpacing(0) 2121 TextInput({ text: 'letterSpacing 3' }) 2122 .border({ width: 1 }).padding(5).margin(5).letterSpacing(3) 2123 TextInput({ text: 'letterSpacing -1' }) 2124 .border({ width: 1 }).padding(5).margin(5).letterSpacing(-1) 2125 2126 Text('decoration').fontSize(9).fontColor(0xCCCCCC) 2127 TextInput({ text: 'LineThrough, Red' }) 2128 .border({ width: 1 }).padding(5).margin(5) 2129 .decoration({ type: TextDecorationType.LineThrough, color: Color.Red }) 2130 TextInput({ text: 'Overline, Red, DASHED' }) 2131 .border({ width: 1 }).padding(5).margin(5) 2132 .decoration({ type: TextDecorationType.Overline, color: Color.Red, style: TextDecorationStyle.DASHED }) 2133 TextInput({ text: 'Underline, Red, WAVY' }) 2134 .border({ width: 1 }).padding(5).margin(5) 2135 .decoration({ type: TextDecorationType.Underline, color: Color.Red, style: TextDecorationStyle.WAVY }) 2136 }.height('90%') 2137 } 2138 .width('90%') 2139 .margin(10) 2140 } 2141} 2142``` 2143 2144 2145 2146### 示例9(设置文字特性效果) 2147 2148该示例通过fontFeature属性实现了文本在不同文字特性下的展示效果。 2149 2150```ts 2151// xxx.ets 2152@Entry 2153@Component 2154struct TextInputExample { 2155 @State text1: string = 'This is ss01 on : 0123456789'; 2156 @State text2: string = 'This is ss01 off: 0123456789'; 2157 2158 build() { 2159 Column() { 2160 TextInput({ text: this.text1 }) 2161 .fontSize(20) 2162 .margin({ top: 200 }) 2163 .fontFeature("\"ss01\" on") 2164 TextInput({ text: this.text2 }) 2165 .margin({ top: 10 }) 2166 .fontSize(20) 2167 .fontFeature("\"ss01\" off") 2168 } 2169 .width("90%") 2170 .margin("5%") 2171 } 2172} 2173``` 2174 2175 2176 2177### 示例10(自定义键盘避让) 2178 2179该示例通过自定义键盘实现了键盘避让的效果。 2180 2181```ts 2182// xxx.ets 2183@Entry 2184@Component 2185struct TextInputExample { 2186 controller: TextInputController = new TextInputController(); 2187 @State inputValue: string = ""; 2188 @State height1: string | number = '80%'; 2189 @State supportAvoidance: boolean = true; 2190 2191 // 自定义键盘组件 2192 @Builder 2193 CustomKeyboardBuilder() { 2194 Column() { 2195 Row() { 2196 Button('x').onClick(() => { 2197 // 关闭自定义键盘 2198 this.controller.stopEditing(); 2199 }).margin(10) 2200 } 2201 2202 Grid() { 2203 ForEach([1, 2, 3, 4, 5, 6, 7, 8, 9, '*', 0, '#'], (item: number | string) => { 2204 GridItem() { 2205 Button(item + "") 2206 .width(110).onClick(() => { 2207 this.inputValue += item; 2208 }) 2209 } 2210 }) 2211 }.maxCount(3).columnsGap(10).rowsGap(10).padding(5) 2212 }.backgroundColor(Color.Gray) 2213 } 2214 2215 build() { 2216 Column() { 2217 Row() { 2218 Button("20%") 2219 .fontSize(24) 2220 .onClick(() => { 2221 this.height1 = "20%"; 2222 }) 2223 Button("80%") 2224 .fontSize(24) 2225 .margin({ left: 20 }) 2226 .onClick(() => { 2227 this.height1 = "80%"; 2228 }) 2229 } 2230 .justifyContent(FlexAlign.Center) 2231 .alignItems(VerticalAlign.Bottom) 2232 .height(this.height1) 2233 .width("100%") 2234 .padding({ bottom: 50 }) 2235 2236 TextInput({ controller: this.controller, text: this.inputValue })// 绑定自定义键盘 2237 .customKeyboard(this.CustomKeyboardBuilder(), { supportAvoidance: this.supportAvoidance }) 2238 .margin(10) 2239 .border({ width: 1 }) 2240 2241 } 2242 } 2243} 2244``` 2245 2246 2247 2248### 示例11(设置文本自适应) 2249 2250该示例通过minFontSize、maxFontSize、heightAdaptivePolicy属性实现了文本自适应字号的功能。 2251 2252```ts 2253// xxx.ets 2254@Entry 2255@Component 2256struct TextInputExample { 2257 build() { 2258 Row() { 2259 Column() { 2260 Text('heightAdaptivePolicy').fontSize(9).fontColor(0xCCCCCC) 2261 TextInput({ text: 'This is the text without the height adaptive policy set' }) 2262 .width('80%').height(50).borderWidth(1).margin(1) 2263 TextInput({ text: 'This is the text with the height adaptive policy set' }) 2264 .width('80%') 2265 .height(50) 2266 .borderWidth(1) 2267 .margin(1) 2268 .minFontSize(4) 2269 .maxFontSize(40) 2270 .maxLines(3) 2271 .heightAdaptivePolicy(TextHeightAdaptivePolicy.MAX_LINES_FIRST) 2272 TextInput({ text: 'This is the text with the height adaptive policy set' }) 2273 .width('80%') 2274 .height(50) 2275 .borderWidth(1) 2276 .margin(1) 2277 .minFontSize(4) 2278 .maxFontSize(40) 2279 .maxLines(3) 2280 .heightAdaptivePolicy(TextHeightAdaptivePolicy.MIN_FONT_SIZE_FIRST) 2281 TextInput({ text: 'This is the text with the height adaptive policy set' }) 2282 .width('80%') 2283 .height(50) 2284 .borderWidth(1) 2285 .margin(1) 2286 .minFontSize(4) 2287 .maxFontSize(40) 2288 .maxLines(3) 2289 .heightAdaptivePolicy(TextHeightAdaptivePolicy.LAYOUT_CONSTRAINT_FIRST) 2290 }.height('90%') 2291 } 2292 .width('90%') 2293 .margin(10) 2294 } 2295} 2296``` 2297 2298 2299 2300### 示例12(设置折行规则) 2301 2302该示例通过lineBreakStrategy属性实现了TextInput不同折行规则下的效果。 2303 2304```ts 2305// xxx.ets 2306@Entry 2307@Component 2308struct TextInputExample { 2309 @State message1: string = 2310 "They can be classified as built-in components–those directly provided by the ArkUI framework and custom components – those defined by developers" + 2311 "The built-in components include buttons radio buttonsprogress indicators and text You can set the rendering effectof thesecomponents in method chaining mode," + 2312 "page components are divided into independent UI units to implementindependent creation development and reuse of different units on pages making pages more engineering-oriented."; 2313 @State lineBreakStrategyIndex: number = 0; 2314 @State lineBreakStrategy: LineBreakStrategy[] = 2315 [LineBreakStrategy.GREEDY, LineBreakStrategy.HIGH_QUALITY, LineBreakStrategy.BALANCED]; 2316 @State lineBreakStrategyStr: string[] = ['GREEDY', 'HIGH_QUALITY', 'BALANCED']; 2317 2318 build() { 2319 Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Start }) { 2320 Text('lineBreakStrategy').fontSize(9).fontColor(0xCCCCCC) 2321 TextInput({ text: this.message1 }) 2322 .fontSize(12) 2323 .border({ width: 1 }) 2324 .padding(10) 2325 .width('100%') 2326 .maxLines(12) 2327 .style(TextInputStyle.Inline) 2328 .lineBreakStrategy(this.lineBreakStrategy[this.lineBreakStrategyIndex]) 2329 Row() { 2330 Button('当前lineBreakStrategy模式:' + this.lineBreakStrategyStr[this.lineBreakStrategyIndex]).onClick(() => { 2331 this.lineBreakStrategyIndex++; 2332 if (this.lineBreakStrategyIndex > (this.lineBreakStrategyStr.length - 1)) { 2333 this.lineBreakStrategyIndex = 0; 2334 } 2335 }) 2336 } 2337 }.height(700).width(370).padding({ left: 35, right: 35, top: 35 }) 2338 } 2339} 2340``` 2341 2342 2343 2344### 示例13(支持插入和删除回调) 2345该示例通过onWillInsert、onDidInsert、onWillDelete、onDidDelete接口实现了插入和删除的效果。 2346```ts 2347// xxx.ets 2348@Entry 2349@Component 2350struct TextInputExample { 2351 @State insertValue: string = ""; 2352 @State deleteValue: string = ""; 2353 @State insertOffset: number = 0; 2354 @State deleteOffset: number = 0; 2355 @State deleteDirection: number = 0; 2356 2357 build() { 2358 Row() { 2359 Column() { 2360 TextInput({ text: "TextInput支持插入回调文本" }) 2361 .height(60) 2362 .onWillInsert((info: InsertValue) => { 2363 this.insertValue = info.insertValue; 2364 return true; 2365 }) 2366 .onDidInsert((info: InsertValue) => { 2367 this.insertOffset = info.insertOffset; 2368 }) 2369 2370 Text("insertValue:" + this.insertValue + " insertOffset:" + this.insertOffset).height(30) 2371 2372 TextInput({ text: "TextInput支持删除回调文本b" }) 2373 .height(60) 2374 .onWillDelete((info: DeleteValue) => { 2375 this.deleteValue = info.deleteValue; 2376 info.direction; 2377 return true; 2378 }) 2379 .onDidDelete((info: DeleteValue) => { 2380 this.deleteOffset = info.deleteOffset; 2381 this.deleteDirection = info.direction; 2382 }) 2383 2384 Text("deleteValue:" + this.deleteValue + " deleteOffset:" + this.deleteOffset).height(30) 2385 Text("deleteDirection:" + (this.deleteDirection == 0 ? "BACKWARD" : "FORWARD")).height(30) 2386 2387 }.width('100%') 2388 } 2389 .height('100%') 2390 } 2391} 2392``` 2393 2394 2395 2396### 示例14(文本扩展自定义菜单) 2397 2398该示例通过editMenuOptions接口实现了文本设置自定义菜单扩展项的文本内容、图标以及回调的功能。 2399 2400```ts 2401// xxx.ets 2402@Entry 2403@Component 2404struct TextInputExample { 2405 @State text: string = 'TextInput editMenuOptions' 2406 onCreateMenu = (menuItems: Array<TextMenuItem>) => { 2407 let item1: TextMenuItem = { 2408 content: 'custom1', 2409 icon: $r('app.media.startIcon'), 2410 id: TextMenuItemId.of('custom1'), 2411 }; 2412 let item2: TextMenuItem = { 2413 content: 'custom2', 2414 id: TextMenuItemId.of('custom2'), 2415 icon: $r('app.media.startIcon'), 2416 }; 2417 menuItems.push(item1); 2418 menuItems.unshift(item2); 2419 return menuItems; 2420 } 2421 onMenuItemClick = (menuItem: TextMenuItem, textRange: TextRange) => { 2422 if (menuItem.id.equals(TextMenuItemId.of("custom2"))) { 2423 console.log("拦截 id: custom2 start:" + textRange.start + "; end:" + textRange.end); 2424 return true; 2425 } 2426 if (menuItem.id.equals(TextMenuItemId.COPY)) { 2427 console.log("拦截 COPY start:" + textRange.start + "; end:" + textRange.end); 2428 return true; 2429 } 2430 if (menuItem.id.equals(TextMenuItemId.SELECT_ALL)) { 2431 console.log("不拦截 SELECT_ALL start:" + textRange.start + "; end:" + textRange.end); 2432 return false; 2433 } 2434 return false; 2435 } 2436 @State editMenuOptions: EditMenuOptions = { 2437 onCreateMenu: this.onCreateMenu, onMenuItemClick: this.onMenuItemClick 2438 } 2439 2440 build() { 2441 Column() { 2442 TextInput({ text: this.text }) 2443 .width('95%') 2444 .height(50) 2445 .editMenuOptions(this.editMenuOptions) 2446 .margin({ top: 100 }) 2447 } 2448 .width("90%") 2449 .margin("5%") 2450 } 2451} 2452``` 2453 2454 2455 2456### 示例15(设置symbol类型清除按钮) 2457 2458该示例通过cancelButton属性展示了自定义右侧symbol类型清除按钮样式的效果。 2459 2460```ts 2461import { SymbolGlyphModifier } from '@kit.ArkUI'; 2462 2463// xxx.ets 2464@Entry 2465@Component 2466struct TextInputExample { 2467 @State text: string = ''; 2468 symbolModifier: SymbolGlyphModifier = 2469 new SymbolGlyphModifier($r('sys.symbol.trash')).fontColor([Color.Red]).fontSize(16).fontWeight(FontWeight.Regular); 2470 2471 build() { 2472 Column() { 2473 TextInput({ text: this.text, placeholder: 'input your word...' }) 2474 .cancelButton({ 2475 style: CancelButtonStyle.CONSTANT, 2476 icon: this.symbolModifier 2477 }) 2478 } 2479 } 2480} 2481``` 2482 2483 2484 2485### 示例16(文本设置省略模式) 2486 2487该示例通过textOverflow、ellipsisMode、style属性展示了文本超长省略以及调整省略位置的效果。 2488 2489```ts 2490// xxx.ets 2491@Entry 2492@Component 2493struct EllipsisModeExample { 2494 @State text: string = "As the sun begins to set, casting a warm golden hue across the sky," + 2495 "the world seems to slow down and breathe a sigh of relief. The sky is painted with hues of orange, " + 2496 " pink, and lavender, creating a breath taking tapestry that stretches as far as the eye can see." + 2497 "The air is filled with the sweet scent of blooming flowers, mingling with the earthy aroma of freshly turned soil." 2498 @State ellipsisModeIndex: number = 0 2499 @State ellipsisMode: (EllipsisMode | undefined | null)[] = [EllipsisMode.END, EllipsisMode.START, EllipsisMode.CENTER] 2500 @State ellipsisModeStr: string[] = ['END ', 'START', 'CENTER'] 2501 @State textOverflowIndex: number = 0 2502 @State textOverflow: TextOverflow[] = [TextOverflow.Ellipsis, TextOverflow.Clip] 2503 @State textOverflowStr: string[] = ['Ellipsis', 'Clip'] 2504 @State styleInputIndex: number = 0 2505 @State styleInput: TextInputStyle[] = [TextInputStyle.Inline, TextInputStyle.Default] 2506 @State styleInputStr: string[] = ['Inline', 'Default'] 2507 build() { 2508 Row() { 2509 Column({ space: 20 }) { 2510 Text('测试TextInput').fontSize(30) 2511 TextInput({ text: this.text}) 2512 .textOverflow( this.textOverflow[this.textOverflowIndex]) 2513 .ellipsisMode( this.ellipsisMode[this.ellipsisModeIndex]) 2514 .style(this.styleInput[this.styleInputIndex]) 2515 .fontSize(30) 2516 .margin(30) 2517 Button('更改ellipsisMode模式:' + this.ellipsisModeStr[this.ellipsisModeIndex]).onClick(() => { 2518 this.ellipsisModeIndex++ 2519 if (this.ellipsisModeIndex > (this.ellipsisModeStr.length - 1)) { 2520 this.ellipsisModeIndex = 0 2521 } 2522 }).fontSize(20) 2523 Button('更改textOverflow模式:' + this.textOverflowStr[this.textOverflowIndex]).onClick(() => { 2524 this.textOverflowIndex++ 2525 if (this.textOverflowIndex > (this.textOverflowStr.length - 1)) { 2526 this.textOverflowIndex = 0 2527 } 2528 }).fontSize(20) 2529 Button('更改Style大小:' + this.styleInputStr[this.styleInputIndex]).onClick(() => { 2530 this.styleInputIndex++ 2531 if (this.styleInputIndex > (this.styleInputStr.length - 1)) { 2532 this.styleInputIndex = 0 2533 } 2534 }).fontSize(20) 2535 } 2536 } 2537 } 2538} 2539``` 2540 2541 2542 2543### 示例17(输入框支持输入状态变化等回调) 2544 2545该示例通过onEditChange、onCopy、onCut、onPaste、onContentScroll接口实现了输入框监测输入状态变化、复制、剪切、粘贴、文本内容滚动回调的效果。 2546 2547```ts 2548// xxx.ets 2549@Entry 2550@Component 2551struct TextInputExample { 2552 @State editStatus: boolean = false; 2553 @State copyValue: string = ""; 2554 @State cutValue: string = ""; 2555 @State pasteValue: string = ""; 2556 @State totalOffsetX: number = 0; 2557 @State totalOffsetY: number = 0; 2558 2559 build() { 2560 Row() { 2561 Column() { 2562 TextInput({ text: "TextInput支持输入状态变化时回调" }) 2563 .height(60) 2564 .fontStyle(FontStyle.Italic) 2565 .fontWeight(FontWeight.Bold) 2566 .fontFamily("HarmonyOS Sans") 2567 .copyOption(CopyOptions.LocalDevice) 2568 .textAlign(TextAlign.Center) 2569 .selectedBackgroundColor(Color.Blue) 2570 .caretStyle({ width: '4vp' }) 2571 .caretPosition(10)// 设置TextInput光标位置 2572 .selectionMenuHidden(true)// 设置TextInput不弹出系统文本选择菜单 2573 .onEditChange((status: boolean) => { 2574 this.editStatus = status; 2575 }) 2576 .defaultFocus(true)// 设置TextInput默认获焦 2577 .enableKeyboardOnFocus(false)// 设置TextInput通过点击以外的方式获焦时,不主动拉起软键盘 2578 .selectAll(false) 2579 2580 Text("editStatus:" + this.editStatus).height(30) 2581 2582 TextInput({ text: "TextInput支持复制操作时回调" }) 2583 .height(60) 2584 .fontStyle(FontStyle.Italic) 2585 .fontWeight(FontWeight.Bold) 2586 .fontFamily("HarmonyOS Sans") 2587 .copyOption(CopyOptions.LocalDevice) 2588 .textAlign(TextAlign.Center) 2589 .selectedBackgroundColor(Color.Blue) 2590 .caretStyle({ width: '4vp' }) 2591 .onCopy((copyValue: string) => { 2592 this.copyValue = copyValue; 2593 }) 2594 2595 Text("copyValue:" + this.copyValue).height(30) 2596 2597 TextInput({ text: "TextInput支持剪切操作时回调" }) 2598 .height(60) 2599 .fontStyle(FontStyle.Italic) 2600 .fontWeight(FontWeight.Bold) 2601 .fontFamily("HarmonyOS Sans") 2602 .copyOption(CopyOptions.LocalDevice) 2603 .textAlign(TextAlign.Center) 2604 .selectedBackgroundColor(Color.Blue) 2605 .caretStyle({ width: '4vp' }) 2606 .onCut((cutValue: string) => { 2607 this.cutValue = cutValue; 2608 }) 2609 2610 Text("cutValue:" + this.cutValue).height(30) 2611 2612 TextInput({ text: "TextInput支持粘贴操作时回调" }) 2613 .height(60) 2614 .fontStyle(FontStyle.Italic) 2615 .fontWeight(FontWeight.Bold) 2616 .fontFamily("HarmonyOS Sans") 2617 .copyOption(CopyOptions.LocalDevice) 2618 .textAlign(TextAlign.Center) 2619 .selectedBackgroundColor(Color.Blue) 2620 .caretStyle({ width: '4vp' }) 2621 .onPaste((pasteValue: string) => { 2622 this.pasteValue = pasteValue; 2623 }) 2624 2625 Text("pasteValue:" + this.pasteValue).height(30) 2626 2627 TextInput({ text: "TextInput支持文本内容滚动时回调: 文本内容宽度超出输入框宽度,滚动文本查看偏移量变化" }) 2628 .height(60) 2629 .fontStyle(FontStyle.Italic) 2630 .fontWeight(FontWeight.Bold) 2631 .fontFamily("HarmonyOS Sans") 2632 .copyOption(CopyOptions.LocalDevice) 2633 .textAlign(TextAlign.Center) 2634 .selectedBackgroundColor(Color.Blue) 2635 .caretStyle({ width: '4vp' }) 2636 .onContentScroll((totalOffsetX: number, totalOffsetY: number) => { 2637 this.totalOffsetX = totalOffsetX; 2638 this.totalOffsetY = totalOffsetY; 2639 }) 2640 2641 Text("totalOffsetX:" + this.totalOffsetX + " totalOffsetY:" + this.totalOffsetY).height(30) 2642 2643 }.width('100%') 2644 } 2645 .height('100%') 2646 } 2647} 2648``` 2649 2650 2651 2652### 示例18(设置最小字体范围与最大字体范围) 2653 2654该示例通过minFontScale、maxFontScale设置字体显示最小与最大范围。 2655 2656```json 2657// 开启应用缩放跟随系统 2658// AppScope/resources/base,新建文件夹profile。 2659// AppScope/resources/base/profile,新建文件configuration.json。 2660// AppScope/resources/base/profile/configuration.json,增加如下代码。 2661{ 2662 "configuration": { 2663 "fontSizeScale": "followSystem", 2664 "fontSizeMaxScale": "3.2" 2665 } 2666} 2667``` 2668 2669```json 2670// AppScope/app.json5,修改如下代码。 2671{ 2672 "app": { 2673 "bundleName": "com.example.myapplication", 2674 "vendor": "example", 2675 "versionCode": 1000000, 2676 "versionName": "1.0.0", 2677 "icon": "$media:app_icon", 2678 "label": "$string:app_name", 2679 "configuration": "$profile:configuration" 2680 } 2681} 2682``` 2683 2684```ts 2685// xxx.ets 2686@Entry 2687@Component 2688struct TextInputExample { 2689 @State minFontScale: number = 0.85; 2690 @State maxFontScale: number = 2; 2691 2692 build() { 2693 Column() { 2694 Column({ space: 30 }) { 2695 Text("系统字体变大变小,变大变小aaaaaaaAAAAAA") 2696 TextInput({ 2697 placeholder: 'The text area can hold an unlimited amount of text. input your word...', 2698 }) 2699 .minFontScale(this.minFontScale)// 设置最小字体缩放倍数,参数为undefined则跟随系统默认倍数缩放 2700 .maxFontScale(this.maxFontScale)// 设置最大字体缩放倍数,参数为undefined则跟随系统默认倍数缩放 2701 }.width('100%') 2702 } 2703 } 2704} 2705``` 2706 2707### 示例19(设置选中指定区域的文本内容) 2708 2709该示例通过setTextSelection方法展示如何设置选中指定区域的文本内容以及菜单的显隐策略。 2710 2711```ts 2712// xxx.ets 2713 2714@Entry 2715@Component 2716struct TextInputExample { 2717 controller: TextInputController = new TextInputController() 2718 @State startIndex: number = 0 2719 @State endIndex: number = 0 2720 2721 build() { 2722 Column({ space: 3 }) { 2723 Text('Selection start:' + this.startIndex + ' end:' + this.endIndex) 2724 TextInput({ text: 'Hello World', controller: this.controller }) 2725 .width('95%') 2726 .height(40) 2727 .defaultFocus(true) 2728 .enableKeyboardOnFocus(true) 2729 .onTextSelectionChange((selectionStart: number, selectionEnd: number) => { 2730 this.startIndex = selectionStart 2731 this.endIndex = selectionEnd 2732 }) 2733 2734 Button('setTextSelection [0,3], set menuPolicy is MenuPolicy.SHOW') 2735 .onClick(() => { 2736 this.controller.setTextSelection(0, 3, { menuPolicy: MenuPolicy.SHOW }) 2737 }) 2738 } 2739 .width('100%') 2740 .height('100%') 2741 } 2742} 2743``` 2744 2745