一、功能介绍
为了能够更直观的让大家知道BEditText都能做什么,下面我列了一个功能列表,做一下简单描述;如下:
功能 | 描述 |
---|---|
圆角 | 可以统一设置圆角角度,也可以四个角单独设置 |
描边 | 可以设置描边大小、颜色,可以隐藏任意边 |
阴影 | 可以设置阴影大小、颜色、偏移、距离、单边多边显示等 |
渐变色 | 可以设置文本渐变色、背景渐变色 |
辅助功能 | 支持一键清空 支持内容可见性切换&自定义图标 支持设置四周图标&自定义宽高 支持输入法控制 |
另类样式 | 支付密码输入样式、验证码输入样式等 |
下面详细说说各个功能的使用方法:
◆ 圆角
XML设置 | 代码设置 | 描述 |
---|---|---|
app:bsv_roundRadius="10dp" | setRoundradius(int radius) | 设置四个角圆角值,优先级最高 |
app:bsv_topLeftRadius="10dp" | setTopLeftRoundRadius(int radius) | 左上角圆角值 |
app:bsv_topRightRadius="10dp" | setTopRightRoundRadius(int radius) | 右上角圆角值 |
app:bsv_bottomLeftRadius="10dp" | setBottomLeftRoundRadius(int radius) | 左下角圆角值 |
app:bsv_bottomRightRadius="10dp" | setBottomRightRoundRadius(int radius) | 左下角圆角值 |
如果设置了roundRadius的值默认会重置四个角度的值,以roundRadius为准
<!--四个圆角都为10dp-->
<com.bary.ui.view.BEditText
...
app:bsv_roundRadius="10dp"
/>
<!--左上、右上、坐下圆角为10dp-->
<com.bary.ui.view.BEditText
...
app:bsv_topLeftRadius="10dp"
app:bsv_topRightRadius="10dp"
app:bsv_bottomLeftRadius="10dp"
/>
◆ 描边
XML设置 | 代码设置 | 描述 |
---|---|---|
app:bsv_borderSize="3dp" | setBorderSize(float size) | 设置描边尺寸 |
app:bsv_borderColor="#ff8585" | setBorderColor(int color) | 设置描边颜色 |
app:bsv_borderHideEdges="left|top" | hideBorderEdges(int... edges) | 设置需要隐藏的边,值为: left、top、right、bottom; 可以同时设置多个用|分隔 即可(代码设置的话, hideBorderEdges方法为 不定参,传多个参数即可; BorderBuilder.LEFT、 BorderBuilder.TOP、 BorderBuilder.RIGHT、 BorderBuilder.BOTTOM) |
想要显示描边borderShow必须为true
<com.bary.ui.view.BEditText
...
app:bsv_borderSize="3dp"
app:bsv_borderColor="#ff8585"
app:bsv_borderHideEdges="left|top"
/>
◆ 阴影
XML设置 | 代码设置 | 描述 |
---|---|---|
app:bsv_shadowShow="true" | setShadowShow(boolean show) | 设置是否展示阴影 |
app:bsv_shadowSize="3dp" | setShadowSize(float size) | 设置阴影尺寸,优先级最高 |
app:bsv_shadowXSize="3dp" | setShadowXSize(float size) | 可以单独设置横向阴影尺寸 |
app:bsv_shadowYSize="3dp" | setShadowYSize(float size) | 可以单独设置纵向阴影尺寸 |
app:bsv_shadowDx="1dp" | setShadowDx(float dx) | 设置横向的偏移值,默认0 视图在中心,左右阴影尺寸 相同 |
app:bsv_shadowDy="1dp" | setShadowDy(float dy) | 设置纵向的偏移值,默认0 视图在中心,上下阴影尺寸 相同 |
app:bsv_shadowColor="#ff8585" | setShadowColor(int color) | 设置阴影颜色 |
app:bsv_shadowAlpha="0.8" | setShadowAlpha(float alpha) | 设置阴影透明度 |
app:bsv_shadowHideEdges="left|top" | hideShadowEdges(int... edges) | 设置需要隐藏的边,值为: left、top、right、bottom; 可以同时设置多个用|分隔 即可(代码设置的话, hideShadowEdges方法为 不定参,传多个参数即可; ShadowBuilder.LEFT、 ShadowBuilder.TOP、 ShadowBuilder.RIGHT、 ShadowBuilder.BOTTOM) |
想要显示描边shadowShow必须为true,如果设置了shadowSize的值默认会重置shadowXSize,shadowYSize的值,以shadowSize为准,四边阴影尺寸相同,想要横向纵向尺寸不同,只设置shadowXSize,shadowYSize即可。
<com.bary.ui.view.BEditText
...
app:bsv_shadowShow="true"
app:bsv_shadowSize="3dp"
app:bsv_shadowDx="1dp"
app:bsv_shadowDy="1dp"
app:bsv_shadowColor="#ff8585"
app:bsv_shadowAlpha="0.8"
app:bsv_shadowHideEdges="left|top"
/>
◆ 渐变色
XML设置 | 代码设置 | 描述 |
---|---|---|
app:bsv_backgroundGradientColor="#FF8585|#FF8B15" | setBackgroundGradientColor(String... colors) | 设置背景渐变色,至少两个16进制颜色值; 代码设置方法为不定参,传多个参数16进制颜色值 |
app:bsv_backgroundGradientType="linear" | setBackgroundGradientType (GradientType type) |
设置渐变类型,参数为: linear-线性 radial-圆环 sweep-角度 ------------------------- GradientType.LINEAR、 GradientType.RADIAL、 GradientType.SWEEP |
app:bsv_backgroundGradientOrientation="horizontal" | setBackgroundGradientOrientation (GradientOrientation orientation) |
设置渐变方向,参数为: horizontal-垂直 vertical-水平 diagonal-对角 ------------------------- GradientOrientation.HORIZONTAL、 GradientOrientation.VERTICAL、 GradientOrientation.DIAGONAL |
app:bsv_textGradientColor="#FF8585|#FF8B15" | setBackgroundGradientColor(String... colors) | 设置背景渐变色,至少两个16进制颜色值; 代码设置方法为不定参,传多个参数16进制颜色值 |
app:bsv_textGradientType="linear" | setTextGradientType (GradientType type) |
设置渐变类型,参数同背景渐变类型相同 |
app:bsv_textGradientOrientation="horizontal" | setTextGradientOrientation (GradientOrientation orientation) |
设置渐变方向,参数同背景渐变类型相同 |
☛ 由于渐变色需要在同一个属性下设置多个颜色,所以只能设置16进制颜色值,不能使用color下的颜色资源
背景渐变:
<com.bary.ui.view.BEditText
...
app:bsv_backgroundGradientColor="#FF8585|#FF8B15"
app:bsv_backgroundGradientType="linear"
app:bsv_backgroundGradientOrientation="horizontal"
/>
文本渐变:
<com.bary.ui.view.BEditText
...
app:bsv_textGradientColor="#FF8585|#FF8B15"
app:bsv_textGradientType="linear"
app:bsv_textGradientOrientation="horizontal"
/>
◆ 辅助功能
1、一键清空
自带一键清空功能,当文本框有内容的时候自动显示出来,可以设置展示/隐藏,图标可更换;具体说明如下:
XML设置 | 代码设置 | 描述 |
---|---|---|
app:bsv_showClearIcon="true" | showClearIcon(boolean show) | 设置是否显示一键清空图标,默认true |
app:bsv_clearIcon="@drawable/clear" | setClearIcon(int res) | 设置一键清空按钮图标 |
2、内容可见性切换&自定义图标
支持自定义内容可见按钮功能,默认隐藏,可以设置展示/隐藏,图标可更换;具体说明如下:
XML设置 | 代码设置 | 描述 |
---|---|---|
app:bsv_showSecretIcon="false" | showSecretIcon(boolean show) | 设置是否显示内容可见控制图标,默认false |
app:bsv_secretIconVisible="@drawable/visible" app:bsv_secretIcoInvisible="@drawable/invisible" |
setSecretIcon(int visibe, int invisibe) | 设置内容隐藏按钮图标 |
3、添加左右两侧图标&自定义宽高
XML设置 | 代码设置 | 描述 |
---|---|---|
app:bsv_leftIcon="@drawable/icon" app:bsv_leftIconWidth="20dp" app:bsv_leftIconHeight="20dp" app:bsv_leftIconPadding="5dp" |
addLeftIcon( Drawable drawable, int width, int height, int padding, OnClickListener listener ) |
添加左侧图标,代码添加支持多个 |
右侧同上(left-right) | addRightIcon | ...... |
注意:
1、xml设置图标左右两个各自职能设置一个,点击事件通过代码设置setOnLeftIconClickListener,setOnRightIconClickListener来实现。
2、在代码添加两侧图标时可以添加多个,直接附带点击事件。
4、输入法控制
可以设置编辑模式,默认普通模式
【普通模式】
【不可编辑模式】
【可编辑不弹输入法】(有光标,一般用在语音录入)
温馨提示:
addTextChangedListener ———— addNewTextChangedListener
setOnTouchListener ———— setNewOnTouchListener
setOnFocusChangeListener ———— setNewOnFocusChangeListener
这几个监听需要调用新的方法再能生效。
二、使用方法
1、把maven { url 'https://jitpack.io' }这段代码添加到项目的build.gradle存储库末尾
allprojects {
repositories {
...
maven { url 'https://www.jitpack.io' }
}
}
2、在需要用的主程序或Module下的build.gradle中引用
dependencies {
...
implementation 'com.github.barystudio:BSuperView:最新版本'
}
点击下方↓↓↓ 查看最新版本