-
-
Notifications
You must be signed in to change notification settings - Fork 844
EditText
xuexiangjys edited this page Apr 26, 2022
·
15 revisions
Android输入框组件。包括MaterialEditText、密码输入框、带清除按钮的输入框以及自动校验的输入框。
遵循谷歌Material Design设计风格的输入框,功能强大,支持清除按钮、长度校验、悬浮提示、出错提示、样式自定义、自定义校验规则,自动校验等。
- 演示效果
- 使用案例
<com.xuexiang.xui.widget.edittext.materialedittext.MaterialEditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Floating Label"
app:met_floatingLabel="normal" />
<com.xuexiang.xui.widget.edittext.materialedittext.MaterialEditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Custom Floating Label Text"
app:met_floatingLabel="normal"
app:met_floatingLabelText="Label" />
- 属性表: (MaterialEditText)
属性名 | 类型 | 默认值 | 备注 |
---|---|---|---|
met_baseColor | color | Color.BLACK | 线和文字的基础颜色 |
met_primaryColor | color | ?colorPrimary | 高亮样式的颜色 |
met_floatingLabel | enum | none(normal,highlight) | 悬浮提示文字的样式 |
met_errorColor | color | #e7492E | 出现错误时文字的颜色 |
met_minCharacters | integer | 0 | 最少文字的限制(0代表无限) |
met_maxCharacters | integer | 0 | 最多文字的限制(0代表无限) |
met_allowEmpty | boolean | true | 是否允许输入为空 |
met_errorEmpty | string | "输入不能为空" | 为空的错误提示 |
met_singleLineEllipsis | boolean | false | 底部文字是否显示单行,显示不全的省略号 |
met_helperText | string | / | 在底部的辅助文字 |
met_helperTextColor | color | -1 | 辅助文字的颜色 |
met_floatingLabelText | string | / | 自定义悬浮提示的文字 |
met_floatingLabelPadding | dimension | 8dp | 输入框文字与悬浮提示文字的间距 |
met_hideUnderline | boolean | false | 隐藏底线 |
met_underlineColor | color | -1 | 输入框底线的颜色 |
met_autoValidate | boolean | false | 是否自动校验 |
met_iconLeft | reference | -1 | 左侧图标资源 |
met_iconRight | reference | -1 | 右侧图标资源 |
met_iconPadding | dimension | 8dp | 图标与输入区域的距离 |
met_clearButton | boolean | false | 是否使用清除按钮 |
met_passWordButton | boolean | false | 是否使用显示密码按钮 |
met_isAsteriskStyle | boolean | false | 密码输入框文字的样式是否是“*” |
met_floatingLabelTextSize | dimension | 12sp | 悬浮提示文字的大小 |
met_floatingLabelTextColor | color | -1 | 悬浮提示文字的颜色 |
met_bottomTextSize | dimension | 12sp | 底部提示文字的大小 |
met_floatingLabelAlwaysShown | boolean | false | 悬浮提示一直显示(而不是通过动画显示/消失) |
met_helperTextAlwaysShown | boolean | false | 是否一直显示辅助性文字(错误提示),无论是否在焦点 |
met_floatingLabelAnimating | boolean | false | 是否使用动画显示悬浮提示 |
met_textColor | color | / | 输入文字的颜色 |
met_textColorHint | color | / | 提示文字的颜色 |
met_validateOnFocusLost | boolean | false | 是否失去焦点后自动校验 |
met_checkCharactersCountAtBeginning | boolean | true | 是否在文字显示的时候开始计算文字的数量 |
met_regexp | string | / | 校验的正则表达式 |
met_errorMessage | string | / | 校验不通过的提示信息 |
轻量级的带清除功能的输入框。
- 演示效果
- 使用案例
<com.xuexiang.xui.widget.edittext.ClearEditText
android:id="@+id/clearEditText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp" />
<com.xuexiang.xui.widget.edittext.ClearEditText
android:id="@+id/clearEditText1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cet_clearIcon="@drawable/icon_clear"
app:cet_clearIconSize="@dimen/default_clear_icon_size"
android:layout_margin="5dp" />
- 属性表: (ClearEditText)
属性名 | 类型 | 默认值 | 备注 |
---|---|---|---|
cet_clearIcon | reference | / | 清除按钮的图片资源 |
cet_clearIconSize | dimension | 0 | 清除按钮的图片尺寸 |
支持密码显示隐藏的输入框。
- 演示效果
- 使用案例
<android.support.design.widget.TextInputLayout
android:id="@+id/input_layout_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_marginTop="16dp"
android:gravity="start"
android:textAlignment="viewStart">
<com.xuexiang.xui.widget.edittext.PasswordEditText
android:id="@+id/input_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="start"
android:hint="输入密码"
android:inputType="textPassword"
android:textAlignment="viewStart"
app:pet_enableIconAlpha="true" />
</android.support.design.widget.TextInputLayout>
<com.xuexiang.xui.widget.edittext.PasswordEditText
android:id="@+id/input_password2"
fontPath="fonts/Roboto-Thin.ttf"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_marginTop="8dp"
android:gravity="start"
android:hint="重复密码"
android:inputType="textPassword"
android:textAlignment="viewStart"
app:pet_enableIconAlpha="true"
app:pet_hoverShowsPw="true" />
- 属性表: (PasswordEditText)
属性名 | 类型 | 默认值 | 备注 |
---|---|---|---|
pet_iconShow | integer | R.drawable.icon_visibility_24dp | 显示密码的图标资源 |
pet_iconHide | integer | R.drawable.icon_visibility_off_24dp | 隐藏密码的图标资源 |
pet_hoverShowsPw | boolean | false | 是否触摸显示密码 |
pet_nonMonospaceFont | boolean | false | 是否使用系统默认字体 |
pet_enableIconAlpha | boolean | true | 图标是否设置透明度 |
pet_isAsteriskStyle | boolean | false | 密码输入框文字的样式是否是“*” |
可自动验证的输入框,支持自定义校验规则。可支持自定义错误提示。
- 演示效果
- 使用案例
<com.xuexiang.xui.widget.edittext.ValidatorEditText
style="@style/EditText.Normal"
android:layout_width="300dp"
android:layout_margin="10dp"
android:singleLine="true"
app:vet_tipPosition="top"
app:vet_regexp="@string/regexp_number_only"
app:vet_errorMessage="@string/tip_number_only_error_message"/>
- 属性表: (ValidatorEditText)
属性名 | 类型 | 默认值 | 备注 |
---|---|---|---|
vet_regexp | string | / | 校验的正则表达式 |
vet_errorMessage | string | / | 校验不通过的提示信息 |
vet_autoValidate | boolean | false | 是否自动校验 |
vet_showErrorIcon | boolean | true | 是否显示出错图标 |
vet_errorIcon | reference | R.drawable.ic_default_tip_btn | 出错提示的图片资源 |
vet_errorIconSize | dimension | 0 | 出错提示的图片尺寸 |
vet_tipPosition | enum | right(left,top,bottom) | 出错提示显示的位置 |
多行计数输入框。
- 演示效果
- 使用案例
<com.xuexiang.xui.widget.edittext.MultiLineEditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp" />
- 属性表: (MultiLineEditText)
属性名 | 类型 | 默认值 | 备注 |
---|---|---|---|
mlet_maxCount | integer | 240 | 最大输入文字的数目 |
mlet_ignoreCnOrEn | boolean | true | 是否忽略中英文的差异 |
mlet_hintText | string | / | 输入框提示文字 |
mlet_hintTextColor | color | R.attr.xui_config_color_hint_text | 输入框提示文字的颜色 |
mlet_contentPadding | dimension | 10dp | 输入框的padding |
mlet_contentBackground | reference | / | 输入框背景 |
mlet_contentText | string | / | 输入框的内容 |
mlet_contentTextSize | dimension | 14sp | 输入框文字的大小 |
mlet_contentTextColor | color | R.attr.xui_config_color_input_text | 输入框文字的颜色 |
mlet_contentViewHeight | dimension | 140dp | 输入框的高度 |
mlet_showSurplusNumber | boolean | false | 统计数字显示剩余数目 |
mlet_isFixHeight | boolean | true | 输入框的高度是否是固定高度 |
用于手机验证码验证和支付密码验证的输入框组件。
- 演示效果
- 使用案例
<com.xuexiang.xui.widget.edittext.verify.VerifyCodeEditText
android:id="@+id/vcet_1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="26dp"
android:layout_marginRight="10dp"
app:vcet_is_pwd="true"
app:vcet_number="6"
app:vcet_pwd_radius="10dp"
app:vcet_text_color="#000000"
app:vcet_width="50dp" />
- 属性表: (VerifyCodeEditText)
属性名 | 类型 | 默认值 | 备注 |
---|---|---|---|
vcet_number | integer | 4 | 输入框的数量 |
vcet_width | dimension | 21dp | 每一个输入框的宽度 |
vcet_is_divide_equally | boolean | false | 平分每个输入框的宽度。如果为true,vcet_width值将失效 |
vcet_divider | reference | / | 输入框之间的分割线 |
vcet_text_color | color | Color.BLACK | 输入框文字颜色 |
vcet_text_size | dimension | 16sp | 输入框文字大小 |
vcet_bg_focus | reference | / | 输入框获取焦点时背景 |
vcet_bg_normal | reference | / | 输入框没有焦点时背景 |
vcet_is_pwd | boolean | false | 是否是密码模式 |
vcet_pwd_radius | dimension | 5dp | 密码模式时,圆的半径 |