監(jiān)聽(tīng)EditText的內(nèi)容變化
本節(jié)引言:
在前面我們已經(jīng)學(xué)過(guò)EditText控件了,本節(jié)來(lái)說(shuō)下如何監(jiān)聽(tīng)輸入框的內(nèi)容變化! 這個(gè)再實(shí)際開(kāi)發(fā)中非常實(shí)用,另外,附帶著說(shuō)下如何實(shí)現(xiàn)EditText的密碼可見(jiàn) 與不可見(jiàn)!好了,開(kāi)始本節(jié)內(nèi)容!
1.監(jiān)聽(tīng)EditText的內(nèi)容變化
由題可知,是基于監(jiān)聽(tīng)的事件處理機(jī)制,好像前面的點(diǎn)擊事件是OnClickListener,文本內(nèi)容 變化的監(jiān)聽(tīng)器則是:TextWatcher,我們可以調(diào)用EditText.addTextChangedListener(mTextWatcher); 為EditText設(shè)置內(nèi)容變化監(jiān)聽(tīng)!
簡(jiǎn)單說(shuō)下TextWatcher,實(shí)現(xiàn)該類(lèi)需實(shí)現(xiàn)三個(gè)方法:
public void onTextChanged(CharSequence s, int start, int before, int count);
public void afterTextChanged(Editable s);
依次會(huì)在下述情況中觸發(fā):
- 1.內(nèi)容變化前
- 2.內(nèi)容變化中
- 3.內(nèi)容變化后
我們可以根據(jù)實(shí)際的需求重寫(xiě)相關(guān)方法,一般重寫(xiě)得較多的是第三個(gè)方法!
監(jiān)聽(tīng)EditText內(nèi)容變化的場(chǎng)合有很多: 限制字?jǐn)?shù)輸入,限制輸入內(nèi)容等等~
這里給大家實(shí)現(xiàn)一個(gè)簡(jiǎn)單的自定義EditText,輸入內(nèi)容后,有面會(huì)顯示一個(gè)叉叉的圓圈,用戶點(diǎn)擊后 可以清空文本框~,當(dāng)然你也可以不自定義,直接為EditText添加TextWatcher然后設(shè)置下刪除按鈕~
實(shí)現(xiàn)效果圖:
自定義EditText:DelEditText.java
import android.content.Context;
import android.graphics.Rect;
import android.graphics.drawable.Drawable;
import android.text.Editable;
import android.text.TextWatcher;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.widget.EditText;
/**
* Created by coder-pig on 2015/7/16 0016.
*/
public class DelEditText extends EditText {
private Drawable imgClear;
private Context mContext;
public DelEditText(Context context, AttributeSet attrs) {
super(context, attrs);
this.mContext = context;
init();
}
private void init() {
imgClear = mContext.getResources().getDrawable(R.drawable.delete_gray);
addTextChangedListener(new TextWatcher() {
@Override
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
}
@Override
public void onTextChanged(CharSequence s, int start, int before, int count) {
}
@Override
public void afterTextChanged(Editable editable) {
setDrawable();
}
});
}
//繪制刪除圖片
private void setDrawable(){
if (length() < 1)
setCompoundDrawablesWithIntrinsicBounds(null, null, null, null);
else
setCompoundDrawablesWithIntrinsicBounds(null, null, imgClear, null);
}
//當(dāng)觸摸范圍在右側(cè)時(shí),觸發(fā)刪除方法,隱藏叉叉
@Override
public boolean onTouchEvent(MotionEvent event) {
if(imgClear != null && event.getAction() == MotionEvent.ACTION_UP)
{
int eventX = (int) event.getRawX();
int eventY = (int) event.getRawY();
Rect rect = new Rect();
getGlobalVisibleRect(rect);
rect.left = rect.right - 100;
if (rect.contains(eventX, eventY))
setText("");
}
return super.onTouchEvent(event);
}
@Override
protected void finalize() throws Throwable {
super.finalize();
}
}
EditText的背景drawable:bg_frame_search.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<solid android:color="@color/background_white" />
<corners android:radius="5dp" />
<stroke android:width="1px" android:color="@color/frame_search"/>
</shape>
顏色資源:color.xml
<resources>
<color name="reveal_color">#FFFFFF</color>
<color name="bottom_color">#3086E4</color>
<color name="bottom_bg">#40BAF8</color>
<color name="frame_search">#ADAEAD</color>
<color name="background_white">#FFFFFF</color>
<color name="back_red">#e75049</color>
</resources>
布局文件:activity_main.xml
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="../style/images/back_red"
android:orientation="vertical"
tools:context=".MainActivity">
<demo.com.jay.buttondemo.DelEditText
android:id="@+id/edit_search"
android:layout_width="match_parent"
android:layout_height="32dp"
android:layout_margin="10dp"
android:background="../style/images/bg_frame_search"
android:hint="帶刪除按鈕的EditText~"
android:maxLength="20"
android:padding="5dp"
android:singleLine="true" />
</LinearLayout>
PS:代碼是非常簡(jiǎn)單的,就不解釋了~
2.實(shí)現(xiàn)EditText的密碼可見(jiàn)與不可見(jiàn)
這個(gè)也是一個(gè)很實(shí)用的需求,就是用戶點(diǎn)擊按鈕后可讓EditText中的密碼可見(jiàn)或者不可見(jiàn)~
實(shí)現(xiàn)效果圖:
實(shí)現(xiàn)代碼:activity_main.xml
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:layout_margin="5dp"
android:orientation="horizontal">
<EditText
android:id="@+id/edit_pawd"
android:layout_width="0dp"
android:layout_weight="2"
android:layout_height="48dp"
android:inputType="textPassword"
android:background="../style/images/editborder"/>
<Button
android:id="@+id/btnChange"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="48dp"
android:text="密碼可見(jiàn)"/>
</LinearLayout>
MainActivity.java
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.text.method.HideReturnsTransformationMethod;
import android.text.method.PasswordTransformationMethod;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
public class MainActivity extends AppCompatActivity {
private EditText edit_pawd;
private Button btnChange;
private boolean flag = false;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
edit_pawd = (EditText) findViewById(R.id.edit_pawd);
btnChange = (Button) findViewById(R.id.btnChange);
edit_pawd.setHorizontallyScrolling(true); //設(shè)置EditText不換行
btnChange.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
if(flag == true){
edit_pawd.setTransformationMethod(HideReturnsTransformationMethod.getInstance());
flag = false;
btnChange.setText("密碼不可見(jiàn)");
}else{
edit_pawd.setTransformationMethod(PasswordTransformationMethod.getInstance());
flag = true;
btnChange.setText("密碼可見(jiàn)");
}
}
});
}
}
editborder.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<!-- 設(shè)置透明背景色 -->
<solid android:color="#FFFFFF" />
<!-- 設(shè)置一個(gè)白色邊框 -->
<stroke
android:width="1px"
android:color="#FFFFFF" />
<!-- 設(shè)置一下邊距,讓空間大一點(diǎn) -->
<padding
android:bottom="5dp"
android:left="5dp"
android:right="5dp"
android:top="5dp" />
</shape>
本節(jié)小結(jié):
本節(jié)就到這里,謝謝~