標籤:
根據EditText搜尋方塊ListView動態顯示資料是根據需求來的,覺得這之中涉及的東西可能比較的有意思,所以動手來寫一寫,希望對大家有點協助。
首先,我們來分析下整個過程:
1、建立一個layout,包含一個EditText搜尋方塊和一個ListView
2、建立一個資料集mData,用於ListView的Adapter的建立
3、添加EditText的文本改變的監聽器
4、利用notifyDataSetChanged()動態更新ListView
第一步:建立一個搜尋方塊
文字框,具有點叉全刪功能,不過,刪除了搜尋按鈕,因為我們動態搜尋,用不到按鈕。
添加一個Relativelayout布局,然後往裡添加兩個控制項(具體是3個),
第二步:建立資料集mData
這裡使用的是SimpleAdapter,所以資料集建立的格式我的是這樣的,自己根據自己的Adapter來建立中繼資料,存放在mListTitle和mListText裡的資料是不會去改的,而mData是會在文字框改變時,mData的資料也會做相應的改變,這個是更新操作需要做的。這裡是建立中繼資料集,
代碼如下:
1 ListView mListView; 2 3 ArrayList> mData = new ArrayList>(); 4 5 ArrayList mListTitle = new ArrayList(); 6 ArrayList mListText = new ArrayList(); 7 8 private void getmData(ArrayList> mDatas) 9 {10 Map item = new HashMap();11 mListTitle.add(This is a title!);12 mListText.add(this is a text.13 2016.01.27.11.20);14 15 item.put(title, mListTitle.get(0));16 item.put(text, mListText.get(0));17 mDatas.add(item);18 mListTitle.add(This is an another title!);19 mListText.add(this is an another text.20 016.01.27.11.22);21 22 item = new HashMap();23 item.put(title, mListTitle.get(1));24 item.put(text, mListText.get(1));25 mDatas.add(item);26 }
再就是利用mData建立Adapter
1 private void set_mListView_adapter() 2 { 3 mListView = (ListView) findViewById(R.id.mListView); 4 5 getmData(mData); 6 7 adapter = new SimpleAdapter(this,mData,android.R.layout.simple_list_item_2, 8 new String[]{title,text},new int[]{android.R.id.text1,android.R.id.text2}); 9 10 mListView.setAdapter(adapter);11 }
到此,程式開始的狀態是顯示出來了的。如果沒有搜尋方塊,到此就可以了。
第三步:添加EditText的文本改變的監聽器
因為我們要動態修改ListView的顯示,所以就必須去監聽,然後做相應的動作。當監聽到文本改變時,就用Handler post一個Runnable去做相應的改變。
1 private void set_eSearch_TextChanged() 2 { 3 eSearch = (EditText) findViewById(R.id.etSearch); 4 5 eSearch.addTextChangedListener(new TextWatcher() { 6 7 @Override 8 public void onTextChanged(CharSequence arg0, int arg1, int arg2, int arg3) { 9 // TODO Auto-generated method stub10 //這個應該是在改變的時候會做的動作吧,具體還沒用到過。11 }12 13 @Override14 public void beforeTextChanged(CharSequence arg0, int arg1, int arg2,15 int arg3) {16 // TODO Auto-generated method stub17 //這是文字框改變之前會執行的動作18 }19 20 @Override21 public void afterTextChanged(Editable s) {22 // TODO Auto-generated method stub23 /**這是文字框改變之後 會執行的動作24 * 因為我們要做的就是,在文字框改變的同時,我們的listview的資料也進行相應的變動,並且如一的顯示在介面上。25 * 所以這裡我們就需要加上資料的修改的動作了。26 */27 if(s.length() == 0){28 ivDeleteText.setVisibility(View.GONE);//當文字框為空白時,則叉叉消失29 }30 else {31 ivDeleteText.setVisibility(View.VISIBLE);//當文字框不為空白時,出現叉叉32 myhandler.post(eChanged);33 }34 }35 });36 37 }
Handler在此體現了巨大的用途,我們可以根據Handler的這樣的一個post功能,可以對介面神馬的做自己想要的改變,可以不僅僅只是ListView的修改,像每輸入個字,字型就改變成另一種顏色什麼的,都可以。
第四步:利用notifyDataSetChanged()動態更新ListView
迴歸正題,這裡是最關鍵得一步,我們post出來了,那麼我們就要根據搜尋文字框的文本然後對中繼資料進行篩選,再讓符合的資料顯示在ListView上。
(/*丫的,頂著S4在寫部落格,是不是一種罪過...*/)
adapter有一個notifyDataSetChanged()的方法,在資料更新的時候就使用此方法即可更新綁定的ListView.
這裡可能會遇到一些問題:
1、notifyDataSetChanged(),這個更新了,mData資料集也確實改變了,但是ListView卻沒有更新。我之前就是這樣,後來發現時mData資料集的引用改變了,所以Adapter再notify也沒用,因為Adapter是和mData的引用綁定的,引用一變,那麼資料是不會更新到ListView上的。這也是我使用get函數參數是傳遞引用進來的原因,如果直接返回一個引用回去,那麼就會出現這個問題,因此這一點需要注意下。可以參考http://www.2cto.com/kf/201401/273017.html
2、關於介面UI的更新,可以使用Handler,通過Post一個Runnable去更新,Runnable會去根據搜尋方塊的文本對mData裡的資料進行更新。
代碼如下:
1 Runnable eChanged = new Runnable() { 2 3 @Override 4 public void run() { 5 // TODO Auto-generated method stub 6 String data = eSearch.getText().toString(); 7 8 mData.clear(); 9 10 getmDataSub(mData, data);11 12 adapter.notifyDataSetChanged();13 14 }15 };
3、可能對mData的理解會有點問題,因為資料更新完後,每一次的篩選資料都是放在mData裡,那麼原本的資料呢,當然就是在mListTitle和mListText裡。根據獲得資料的getmDataSub的代碼即可知。
1 private void getmDataSub(ArrayList<map<string, object="">> mDataSubs, String data) 2 { 3 int length = mListTitle.size(); 4 for(int i = 0; i < length; ++i){ 5 if(mListTitle.get(i).contains(data) || mListText.get(i).contains(data)){ 6 Map<string,object> item = new HashMap<string,object>(); 7 item.put(title, mListTitle.get(i)); 8 item.put(text, mListText.get(i)); 9 mDataSubs.add(item);10 }11 }12 } </string,object></string,object></map<string,>
4、因為文字框在第一個,所以程式一運行,文字框就會獲得焦點,然後彈出IME,這裡使用在xml檔案裡添加一個長寬為0的LinearLayout來獲得焦點,代碼如下:
1 <!-- to acquire focus -->2 <LinearLayout3 android:focusable="true"4 android:focusableInTouchMode="true"5 android:layout_width="0px"6 android:layout_height="0px"/>
綜上,這個動態方法,可能還需要待改進,比如篩選的方法,而且控制項這裡只是針對SampleAdapter的Listview,如果是自訂的ListView,應該是還可以再進行最佳化的。還有就是ListView的height的設定,設定成wrap_content和fill_parent兩種方法其實換成真機是可以體驗出兩種的差距的,比較明顯吧,就是往下劃的過程。
Android 根據EditText搜尋方塊ListView動態顯示資料