自定义TextInputLayout,有右边的按钮/文字的EditText

最近有需求,要使用Material Design 的输入框,支持右边有按钮或是文字。

先看看效果吧。


自定义TextInputLayout,有右边的按钮/文字的EditText_第1张图片
自定义TextInputLayout,有右边的按钮/文字的EditText_第2张图片

在输入框右边加入文字或者按钮,在TextInputLayout 里是有一个CheckableImageButton 的,用于明文和密文的切换,增加按钮是为里支持其他操作,例如清空输入框等等。

说说思路吧:

查看过源码,TextInputLayout 是垂直的LinearLayout。

源码中实现CheckableImageButton 加入文本右边,其实是在LinearLayout中放入一个FrameLayout,然后在FrameLayout中加入EditText 和 CheckableImageButton。所以很简单,要实现在输入框右边加入文字,也在FrameLayout中添加就好里。添加按钮,要么自己添加,要嘛就复用原来的CheckableImageButton。很简单吧~图1就做好了。

而实现自定义的Error 效果,如图2,那么涉及到修改hintColor 和 background。在源码里有这两个函数,分别是updateLabelState() 和 updateEditTextBackground() , 第一个是修改提示颜色的,第二个是修改输入框背景的。设置好颜色就OK啦。图2 就做好了。

已将代码上传到GitHub,有部分功能还在进行中,还未能及时更新。

MultiOperationEditText

使用请参照例子:

现有以下还未来得及修改:

1. error 显示时,光标颜色未修改,有人说用反射,还没尝试。

已解决:

自定义CheckableImageButton 时,都为黑色。函数applyOperationToggleTint()是修改drawable的颜色的。已添加mOperationToggleApplyTint变量来控制,默认为false。

如有问题,请联系我:[email protected]

你可能感兴趣的:(自定义TextInputLayout,有右边的按钮/文字的EditText)