Android登陸介面實現-支援輸入框清楚和震動效果功能

標籤：edittext   清楚文字   輸入框震動   自訂edittex   

示範效果

主要代碼如下

自訂的一個EditText，用於實現有文字的時候顯示可以清楚的按鈕：

import android.content.Context;import android.graphics.drawable.Drawable;import android.text.Editable;import android.text.TextWatcher;import android.util.AttributeSet;import android.view.MotionEvent;import android.view.View;import android.view.animation.Animation;import android.view.animation.CycleInterpolator;import android.view.animation.TranslateAnimation;import android.widget.EditText;public class ClearEditText extends EditText implements View.OnFocusChangeListener,TextWatcher{     //刪除按鈕的引用    private Drawable mClearDrawable;    //控制項是否有焦點    private boolean hasFoucs;    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();    }     private void init() {            //擷取EditText的DrawableRight,假如沒有設定我們就使用預設的圖片            mClearDrawable = getCompoundDrawables()[2];            if (mClearDrawable == null) {                // throw new NullPointerException("You can add drawableRight attribute in XML");                mClearDrawable = getResources().getDrawable(R.drawable.selector_ic_delete);            }            //getIntrinsicWidth()取得的是Drawable在手機上的寬度，所以不同解析度下擷取到的值是不同的，關鍵所在處            mClearDrawable.setBounds(0, 0, mClearDrawable.getIntrinsicWidth(), mClearDrawable.getIntrinsicHeight());            //預設設定隱藏表徵圖            setClearIconVisible(false);            //設定焦點改變的監聽            setOnFocusChangeListener(this);            //設定輸入框裡面內容發生改變的監聽            addTextChangedListener(this);        }        /**         * 因為我們不能直接給EditText設定點擊事件，所以我們用記住我們按下的位置來類比點擊事件         * 當我們按下的位置 在  EditText的寬度 - 表徵圖到控制項右邊的間距 - 表徵圖的寬度  和         * EditText的寬度 - 表徵圖到控制項右邊的間距之間我們就算點擊了表徵圖，豎直方向就沒有考慮         */        @Override        public boolean onTouchEvent(MotionEvent event) {            if (event.getAction() == MotionEvent.ACTION_UP) {                if (getCompoundDrawables()[2] != null) {                    boolean touchable = event.getX() > (getWidth() - getTotalPaddingRight())                            && (event.getX() < ((getWidth() - getPaddingRight())));                    if (touchable) {                        this.setText("");                    }                }            }            return super.onTouchEvent(event);        }        /**         * 當ClearEditText焦點發生變化的時候，判斷裡面字串長度設定清除表徵圖的顯示與隱藏         */        @Override        public void onFocusChange(View v, boolean hasFocus) {            this.hasFoucs = hasFocus;            if (hasFocus) {                setClearIconVisible(getText().length() > 0);            } else {                setClearIconVisible(false);            }        }        /**         * 設定清除表徵圖的顯示與隱藏，調用setCompoundDrawables為EditText繪製上去         * @param visible         */        protected void setClearIconVisible(boolean visible) {            Drawable right = visible ? mClearDrawable : null;            setCompoundDrawables(getCompoundDrawables()[0],                    getCompoundDrawables()[1], right, getCompoundDrawables()[3]);        }        /**         * 當輸入框裡面內容發生變化的時候回調的方法         */        @Override        public void onTextChanged(CharSequence s, int start, int count,int after) {            if(hasFoucs){                setClearIconVisible(s.length() > 0);            }        }        @Override        public void beforeTextChanged(CharSequence s, int start, int count,int after) {        }        @Override        public void afterTextChanged(Editable s) {        }        /**         * 設定晃動動畫         */        public void setShakeAnimation(){            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;        }}

MainActivity.java 主要是彈出一句話表示按鈕的點擊事件

import android.os.Bundle;import android.view.View;import android.widget.Button;import android.widget.Toast;import android.app.Activity;public class MainActivity extends Activity {    private Button btnLogin;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_login);        btnLogin = (Button) this.findViewById(R.id.btnLogin);    }    public void login(View view) {        Toast.makeText(this, "登陸", Toast.LENGTH_LONG).show();    }}

布局檔案如下：

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:background="#ffffffff"    android:orientation="vertical"    android:padding="4.0dip" >    <com.xuliugen.clearedittext.ClearEditText        android:id="@+id/etxtEmail"        style="@style/editText"        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:layout_marginTop="30.0dip"        android:drawableLeft="@drawable/icon_reg_name"        android:drawablePadding="10.0dip"        android:hint="使用郵箱登陸" />    <com.xuliugen.clearedittext.ClearEditText        android:id="@+id/etxtPwd"        style="@style/editText"        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:layout_marginTop="20.0dip"        android:drawableLeft="@drawable/icon_reg_password"        android:drawablePadding="10.0dip"        android:hint="輸入登陸密碼"        android:inputType="textPassword" />    <Button        android:id="@+id/btnLogin"        style="@style/bigGreenButton"        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:layout_marginTop="20.0dip"        android:onClick="login"        android:text="登陸" /></LinearLayout>

另外還有一些selector檔案，圖片資源等：
bg_btn_style_green.xml

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android">    <item android:state_enabled="false"><shape android:shape="rectangle">            <corners android:radius="2.0dip" />            <solid android:color="@color/green_btn_color_disable" />        </shape></item>    <item android:state_pressed="true"><shape android:shape="rectangle">            <corners android:radius="2.0dip" />            <solid android:color="@color/green_btn_color_pressed" />        </shape></item>    <item><shape android:shape="rectangle">            <corners android:radius="2.0dip" />            <solid android:color="@color/green_btn_color_normal" />        </shape></item></selector>

bg_edittext_selector.xml

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android">    <item android:drawable="@drawable/input_bar_bg_active" android:state_focused="true"/>    <item android:drawable="@drawable/input_bar_bg_normal"/></selector>

項目免費：
http://yunpan.cn/cwWymCEMmgTzp （提取碼：317d）

Android登陸介面實現-支援輸入框清楚和震動效果功能