Input 输入框
通过鼠标或键盘输入字符。
实现原理
使用 TextField 组件作为基础,通过 Container、Stack 等组件实现自定义样式和交互效果。
基础用法
使用 size
属性来定义输入框的尺寸。
禁用状态
使用 disabled
和 readOnly
属性来定义输入框是否为禁用状态, 在样式展示上有些微区别。
可清空
使用 clearable
属性来定义输入框是否可清空。
自定义颜色
使用 colorType
和 customColor
属性来自定义输入框的颜色。
默认颜色
使用 defaultColor
属性来定义输入框的默认边框颜色。
占位符样式
使用 showPlaceholderOnTop
属性来控制占位符的显示样式。
是否显示为密码
使用 password 控制是否显示为密码
前缀和后缀
使用 prefix
和 suffix
属性来定义输入框的前缀和后缀。
API
input 组件提供 onFocus, onBlur, onChanged 事件, 可以监听输入框的聚焦、失焦、输入内容变化时的回调。
Input 属性
属性名 | 说明 | 类型 | 默认值 |
---|---|---|---|
textController | 输入框控制器 | TextEditingController | - |
placeholder | 输入框占位文本 | String | '' |
clearable | 是否可清空 | boolean | false |
disabled | 是否禁用 | boolean | false |
passowrd | 是否为密码 | boolean | false |
readOnly | 是否只读 | boolean | false |
prefix | 输入框前缀 | Widget | - |
suffix | 输入框后缀 | Widget | - |
colorType | 输入框颜色类型 | EColorType | EColorType.primary |
customColor | 自定义颜色 | Color | - |
defaultColor | 默认边框颜色 | Color | EBasicColors.borderGray |
size | 输入框尺寸 | ESizeItem | ESizeItem.medium |
customHeight | 自定义高度 | double | - |
customFontSize | 自定义字体大小 | double | - |
customBorderRadius | 自定义圆角大小 | double | - |
showPlaceholderOnTop | 是否在顶部显示占位符 | boolean | false |
Input 事件
事件名 | 说明 | 参数 |
---|---|---|
onChanged | 输入框内容变化时触发 | (String value) => void |
onFocus | 输入框获得焦点时触发 | () => void |
onBlur | 输入框失去焦点时触发 | () => void |
</rewritten_file>