ClearEditText自定義

製作一個可以清除訊息的文字編輯框

使用方法如下

建立一個新的類ClearEditText繼承AppCompatEditText，我們可以在onTouchEvent裡面設定清除文字的事件

並且在onTextChange裡面設定當有文字的時候產生右邊清除按鈕的事件。

結果如下

	package com.example.caffeuiphone;
	import android.content.Context;
	import android.graphics.drawable.Drawable;
	import android.support.v7.widget.AppCompatEditText;
	import android.text.Editable;
	import android.text.TextUtils;
	import android.text.TextWatcher;
	import android.util.AttributeSet;
	import android.view.MotionEvent;
	public class ClearEditText extends AppCompatEditText implements TextWatcher {
	public static final String TAG = "ClearEditText";
	boolean isShow = false;//是否已经显示右侧删除图标
	public ClearEditText(Context context) {
	this(context, null);
	}
	public ClearEditText(Context context, AttributeSet attrs) {
	this(context, attrs, 0);
	}
	public ClearEditText(Context context, AttributeSet attrs, int defStyleAttr) {
	super(context, attrs, defStyleAttr);
	}
	@Override
	public boolean onTouchEvent(MotionEvent event) {
	Drawable drawableRight = this.getCompoundDrawables()[2];
	if (drawableRight != null) {//有右边图标才去相应点击事件
	int action = event.getAction();
	if (action == MotionEvent.ACTION_UP) {
	boolean xFlag1 = event.getX() > getWidth() - drawableRight.getIntrinsicWidth() - getPaddingRight();
	boolean xFlag2 = event.getX() < getWidth() - getPaddingRight();
	if (xFlag1 && xFlag2) {
	setText("");
	Drawable drawable2 = this.getResources().getDrawable(R.drawable.line);
	drawable2.setBounds(0, 0, drawable2.getIntrinsicWidth(), drawable2.getIntrinsicHeight());
	this.setCompoundDrawables(null, null, null, drawable2);
	}
	}
	}
	return super.onTouchEvent(event);
	}
	@Override
	public void beforeTextChanged(CharSequence s, int start, int count, int after) {
	}
	@Override
	public void onTextChanged(CharSequence s, int start, int before, int count) {
	if (TextUtils.isEmpty(s)) {
	if (isShow) {
	isShow = !isShow;
	this.setCompoundDrawables(null, null, null, null);
	}
	} else {
	if (!isShow) {
	isShow = !isShow;
	Drawable drawable = this.getResources().getDrawable(R.drawable.right_delete);
	drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());
	Drawable drawable2 = this.getResources().getDrawable(R.drawable.line);
	drawable2.setBounds(0, 0, drawable2.getIntrinsicWidth(), drawable2.getIntrinsicHeight());
	this.setCompoundDrawables(null, null, drawable, drawable2);
	}
	}
	}
	@Override
	public void afterTextChanged(Editable s) {
	}
	}

view raw ClearEditText.java hosted with ❤ by GitHub

line.xml

	<shape xmlns:android="http://schemas.android.com/apk/res/android"
	android:shape="rectangle" >
	<solid android:color="#936e59" />
	<size
	android:height="2dp"
	android:width="1000dp" />
	</shape>

view raw line.xml hosted with ❤ by GitHub

順帶一提，若是想要自己定義view的話，一開始會有這樣的結構：

	public class OriginalView extends View {
	public OriginalView(Context context) {
	this(context, null);
	}
	public OriginalView(Context context, AttributeSet attrs) {
	this(context, attrs, R.attr.originalViewStyle);
	}
	public OriginalView(Context context, AttributeSet attrs, int defStyleAttr) {
	super(context, attrs, defStyleAttr);
	// このへんで初期化処理
	}
	}

view raw OriginalView.java hosted with ❤ by GitHub

參考資料