1. 程式人生 > >Android實現一鍵清除輸入內容和震動效果的EditText

Android實現一鍵清除輸入內容和震動效果的EditText

        Android系統自帶的EditText總的來說,功能相對簡單,不能滿足產品與UI的奇思妙想的功能(逃),
所以我們勢必要對輸入框功能進行一定的拓展,這次我們來實現一鍵清除輸入內容的功能,畢竟不能
讓使用者一直按著刪除鍵來刪除吧(我覺著很有道理),以及輸入內容有誤時輸入框震動功能(其實就是

平移動畫),不多說,上效果圖和程式碼。

    

public class ClearWriteAndAnimaEditText
        extends EditText
        implements View.OnFocusChangeListener , TextWatcher {

    /**
     * 刪除按鈕
     */
    private Drawable mClearDrawable;

    public ClearWriteAndAnimaEditText(Context context) {
        this(context, null);
    }

    public ClearWriteAndAnimaEditText(Context context, AttributeSet attrs) {
        this(context, attrs, android.R.attr.editTextStyle);
    }

    public ClearWriteAndAnimaEditText(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    private void init() {
        mClearDrawable = getResources().getDrawable(R.drawable.pic_delete);
        mClearDrawable.setBounds(0, 0,36,36);
        setClearIconVisible(false);
        this.setOnFocusChangeListener(this);
        this.addTextChangedListener(this);
    }

    /**
     * 當輸入框裡面內容發生變化的時候回撥的方法
     */
    @Override
    public void onTextChanged(CharSequence s, int start, int count, int after) {
        setClearIconVisible(s.length() > 0);
    }


    /**
     * 設定清除圖示的顯示與隱藏,呼叫setCompoundDrawables為EditText繪製上去
     * @param visible
     */
    protected void setClearIconVisible(boolean visible) {
        Drawable right = visible ? mClearDrawable : null;
        setCompoundDrawables(getCompoundDrawables()[0],
                             getCompoundDrawables()[1], right, getCompoundDrawables()[3]);
    }

    /**
     * 因為我們不能直接給EditText設定點選事件,所以我們用記住我們按下的位置來模擬點選事件
     * 當我們按下的位置 在  EditText的寬度 - 圖示到控制元件右邊的間距 - 圖示的寬度  和
     * EditText的寬度 - 圖示到控制元件右邊的間距之間我們就算點選了圖示,豎直方向沒有考慮
     */
    @Override
    public boolean onTouchEvent(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焦點發生變化的時候,判斷裡面字串長度設定清除圖示的顯示與隱藏
     */
    @Override
    public void onFocusChange(View v, boolean hasFocus) {
        if (hasFocus) {
            setClearIconVisible(getText().length() > 0);
        } else {
            setClearIconVisible(false);
        }
    }

    @Override
    public void beforeTextChanged(CharSequence s, int start, int count, int after) {

    }

    @Override
    public void afterTextChanged(Editable s) {

    }

    /**
     * 設定晃動動畫
     */
    public void setShakeAnimation() {
        this.startAnimation(shakeAnimation(3));
    }

    /**
     * 晃動動畫
     * @param counts 半秒鐘晃動多少下
     * @return
     */
    public static Animation shakeAnimation(int counts) {
        Animation translateAnimation = new TranslateAnimation(0, 10, 0, 0);
        translateAnimation.setInterpolator(new CycleInterpolator(counts));
        translateAnimation.setDuration(500);
        return translateAnimation;
    }

    public Drawable getClearDrawable() {
        return mClearDrawable;
    }

    public void setClearDrawable(Drawable mClearDrawable) {
        this.mClearDrawable = mClearDrawable;
    }
}

在Xml檔案進行使用,注意 Copy reference 全路徑包名

  <com.utils.
ClearWriteAndAnimaEditText
android:id="@+id/password_et" android:layout_width="match_parent" android:layout_height="100px" android:maxLength="11" android:maxLines="1" android:drawableLeft="@mipmap/password_icon" android:drawablePadding="10dp" android:layout_weight="1" android:paddingRight="30dp" android:background="@drawable/layout_line" android:hint="請輸入密碼" android:textColor="#000" android:textCursorDrawable="@null" android:textSize="14sp" />