1. 程式人生 > >Android EditText 文字框實現搜尋和清空效果

Android EditText 文字框實現搜尋和清空效果

前言

  本文實現的效果:文字框輸入為空時顯示輸入的圖示;不為空時顯示清空的圖示,此時點選清空圖示能清空文字框內輸入文字。

宣告

  歡迎轉載,但請保留文章原始出處:) 

    部落格園:http://www.cnblogs.com

    農民伯伯: http://over140.cnblogs.com 

正文

  一、實現效果

    

       

  二、實現程式碼 

    監聽輸入

複製程式碼 /**
     * 動態搜尋
     
*/private TextWatcher tbxSearch_TextChanged =new TextWatcher() {

        
//快取上一次文字框內是否為空
privateboolean isnull =true;

        @Override
        
publicvoid afterTextChanged(Editable s) {
            
if (TextUtils.isEmpty(s)) {
                
if (!isnull) {
                    mSearchView.setCompoundDrawablesWithIntrinsicBounds(
null,
                            
null, mIconSearchDefault, 
null);
                    isnull 
=true;
                }
            } 
else {
                
if (isnull) {
                    mSearchView.setCompoundDrawablesWithIntrinsicBounds(
null,
                            
null, mIconSearchClear, null);
                    isnull 
=false;
                }
            }
        }

        @Override
        
publicvoid beforeTextChanged(CharSequence s, int start, int count,
                
int after) {
        }

        
/**
         * 隨著文字框內容改變動態改變列表內容
         
*/
        @Override
        
publicvoid onTextChanged(CharSequence s, int start, int before,
                
int count) {
            
        }
    };
複製程式碼

     觸控事件

複製程式碼 private OnTouchListener txtSearch_OnTouch =new OnTouchListener() {
        @Override
        
publicboolean onTouch(View v, MotionEvent event) {
            
switch (event.getAction()) {
            
case MotionEvent.ACTION_UP:
                
int curX = (int) event.getX();
                
if (curX > v.getWidth() -38&&!TextUtils.isEmpty(mSearchView.getText())) {
                    mSearchView.setText(
"");
                    
int cacheInputType = mSearchView.getInputType();// backup  the input type                    mSearchView.setInputType(InputType.TYPE_NULL);// disable soft input                    mSearchView.onTouchEvent(event);// call native handler                    mSearchView.setInputType(cacheInputType);// restore input  typereturntrue;// consume touch even                }
                
break;
            }
            
returnfalse;
        }
    };
複製程式碼

    繫結事件

複製程式碼 private Drawable mIconSearchDefault; // 搜尋文字框預設圖示private Drawable mIconSearchClear; // 搜尋文字框清除文字內容圖示
    @Override
    
protectedvoid onCreate(Bundle savedInstanceState) {
        
super.onCreate(savedInstanceState);
        setContentView(R.layout.main)
        
        
final Resources res = getResources();
        mIconSearchDefault 
= res.getDrawable(R.drawable.txt_search_default);
        mIconSearchClear 
= res.getDrawable(R.drawable.txt_search_clear);
        
        mSearchView 
= (EditText) findViewById(R.id.txtSearch);
        mSearchView.addTextChangedListener(tbxSearch_TextChanged);
        mSearchView.setOnTouchListener(txtSearch_OnTouch);
    }
複製程式碼

    程式碼說明:

      1. 為輸入框繫結觸控事件(模擬點選事件捕捉)。通過監聽點選區域判斷是否點選清空圖片,如果在該區域並且文字框不為空,則清空文字框。

      2. 為輸入框繫結文字改變事件監聽,根據內容改變動態設定圖示顯示。

      3. 維持清空操作後軟鍵盤狀態。

  三、參考

  四、小圖示下載

      

    (右鍵另存為即可。)

 感謝農民伯伯的文章