关注finddreams，一起分享，一起进步： 常常在网上登录的时候看到这样一个效果，就是当我们选择账号或者密码输入框时，它的背景会变成一种选中的状态，也就是输入框四周会有一种选中颜色的渐变效果。就如GitHub登录界面这样的效果：
所以很多情况下我们也希望自己的APP也能有这样的效果，当点击账号和密码输入框时显示成选中的状态，这样的效果该怎么实现呢？如图：
其实要实现这样的效果，思路很简单，只需要建一个背景selector选择器，分别在不同的状态下配置不同的背景。 一、建一个bg_edittext_selector.xml背景选择器，具体代码如下：
========>======></item></selector>
二、然后就是写布局文件，，并把选择器设置成输入框的背景。代码：
<LinearLayout===”horizontal” ><TextView==”@string/username”android:textSize=”18.0sp” /><com.finddreams.view.ClearEditText===”@string/please_input_username” /></LinearLayout><LinearLayout===”horizontal” ><TextView==”@string/password”android:textSize=”18.0sp” /><com.finddreams.view.ClearEditText====>
从代码中可以看出，我在布局上使用的是一个LinearLayout中包含两个子控件，水平的排列，一个是TextView，另一个则是带有清除功能的自定义控件ClearEditText。 为了实现这样选中效果，所以要把选择器bg_edittext_selector.xml做为父容器LinearLayout的背景。 但是这里有个小的细节需要注意一样，我们知道选择器有很多的状态，默认状态，选中，聚焦等等。那我们这里的父容器本身没有给它聚焦和选中的状态，我们只关心的是账号，密码这两个输入框是否被选中了，选中了则需要变成选中的背景。那怎么样做到子类控件的状态和父容器的状态相关联呢？ 这里父容器控件LinearLayout有一个很好的属性 android:addStatesFromChildren=”true”，这个属性在谷歌官方Api中是这样描述的：
本人英语水平有限，只知道大概意思是说如果属性设置成true的话，ViewGroup的drawable状态就可以根据子类控件EditText或者Button的聚焦状态发生改变。这样它们看起来成了一个整体，父容器的状态跟随子控件的状态来变动。 最后，把ClearEditText的代码贴一下：
/** * @Description: 带删除按钮的输入框 * @author */,TextWatcher {/*** 删除按钮的引用，可以自定义图片*/private Drawable mClearDrawable;SIZE = 0;public ClearEditText(Context context) {this(context, null);}public ClearEditText(Context context, AttributeSet attrs) {// 这里构造方法也很重要，不加这个很多属性不能再XML里面定义this(context, attrs, android.R.attr.editTextStyle);}public ClearEditText(Context context, AttributeSet attrs, int defStyle) {super(context, attrs, defStyle);init();}() {// 获取EditText的DrawableRight,假如没有设置我们就使用默认的图片mClearDrawable = getCompoundDrawables()[2];if (mClearDrawable == null) {mClearDrawable = getResources().getDrawable(R.drawable.progresscancelbtn);}mClearDrawable.setBounds(0, 0, mClearDrawable.getIntrinsicWidth()+ SIZE, mClearDrawable.getIntrinsicHeight() + SIZE);setClearIconVisible(false);setOnFocusChangeListener(this);addTextChangedListener(this);// setClickable(false);}/*** 因为我们不能直接给EditText设置点击事件，所以我们用记住我们按下的位置来模拟点击事件 当我们按下的位置 在 EditText的宽度 -* 图标到控件右边的间距 – 图标的宽度 和 EditText的宽度 – 图标到控件右边的间距之间我们就算点击了图标，竖直方向没有考虑*/(MotionEvent event) {if (getCompoundDrawables()[2] != null) {if (event.getAction() == MotionEvent.ACTION_UP) {boolean touchable = event.getX() > (getWidth()- getPaddingRight() – mClearDrawable.getIntrinsicWidth())&& (event.getX() < ((getWidth() – getPaddingRight())));if (touchable) {this.setText(“”);}}}return super.onTouchEvent(event);}/*** 当ClearEditText焦点发生变化的时候，判断里面字符串长度设置清除图标的显示与隐藏*/(View v, boolean hasFocus) {if (hasFocus) {setClearIconVisible(getText().length() > 0);} else {setClearIconVisible(false);}}/*** 设置清除图标的显示与隐藏，调用setCompoundDrawables为EditText绘制上去** @param visible*/(boolean visible) {Drawable right = visible ? mClearDrawable : null;setCompoundDrawables(getCompoundDrawables()[0],getCompoundDrawables()[1], right, getCompoundDrawables()[3]);}/*** 当输入框里面内容发生变化的时候回调的方法*/(CharSequence s, int start, int count, int after) {setClearIconVisible(s.length() > 0);}(CharSequence s, int start, int count,int after) {}(Editable s) {}/*** 设置晃动动画*/() {this.setAnimation(shakeAnimation(5));}/*** 晃动动画** @param counts*1秒钟晃动多少下* @return*/public static Animation shakeAnimation(int counts) {Animation translateAnimation = new TranslateAnimation(0, 10, 0, 0);translateAnimation.setInterpolator(new CycleInterpolator(counts));translateAnimation.setDuration(1000);return translateAnimation;}}
地球仍然转重，世间依旧善变，而我永远爱你。
