Android UI設計–ListView的item選中效果

有時app會需要點擊某個item並實現選中的效果，例如做pad時用Fragment實現的左側列表右側內容的效果，點擊左側某一個item後會高亮選中

有時簡單的使用setSelected(boolean b)或setSelection(int position)會不成功，需要重寫Adapter，並在getView中進行處理

package com.example.selectitemtest;import java.util.ArrayList;import java.util.HashMap;import java.util.List;import java.util.Map;import android.app.Activity;import android.content.Context;import android.graphics.Color;import android.os.Bundle;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.AbsListView;import android.widget.AdapterView;import android.widget.BaseAdapter;import android.widget.ImageView;import android.widget.ListView;import android.widget.TextView;import android.widget.Toast;public class MainActivity extends Activity {    private ListView lv;    private List<Map<String, Object>> data;    private MyAdapter adapter;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        lv = (ListView)findViewById(R.id.lv);        //擷取將要繫結資料設定到data中        data = getData();        adapter = new MyAdapter(this);        lv.setAdapter(adapter);        lv.setChoiceMode(AbsListView.CHOICE_MODE_SINGLE);        lv.setOnItemClickListener(new ListView.OnItemClickListener() {            @Override            public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,                    long arg3) {                Toast.makeText(getApplicationContext(), "click position:"+arg2, Toast.LENGTH_SHORT).show();                adapter.setSelectedItem(arg2);                //adapter.notifyDataSetInvalidated();            }        });    }     private List<Map<String, Object>> getData()        {            List<Map<String, Object>> list = new ArrayList<Map<String, Object>>();            Map<String, Object> map;            for(int i=0;i<10;i++)            {                map = new HashMap<String, Object>();                map.put("img", R.drawable.ic_launcher);                map.put("title", "花郎");                map.put("info", "動力源於興趣...");                list.add(map);            }            return list;        }                //ViewHolder靜態類        static class ViewHolder        {            public ImageView img;            public TextView title;            public TextView info;        }                public class MyAdapter extends BaseAdapter        {                private LayoutInflater mInflater = null;            private int selectedItem = -1;            private MyAdapter(Context context)            {                //根據context上下文載入布局，這裡的是Demo17Activity本身，即this                this.mInflater = LayoutInflater.from(context);            }            @Override            public int getCount() {                //How many items are in the data set represented by this Adapter.                //在此適配器中所代表的資料集中的條目數                return data.size();            }            @Override            public Object getItem(int position) {                // Get the data item associated with the specified position in the data set.                //擷取資料集中與指定索引對應的資料項目                return position;            }                        public void setSelectedItem(int selectedItem)            {                this.selectedItem = selectedItem;            }            @Override            public long getItemId(int position) {                //Get the row id associated with the specified position in the list.                //擷取在列表中與指定索引對應的行id                return position;            }                        //Get a View that displays the data at the specified position in the data set.            //擷取一個在資料集中指定索引的視圖來顯示資料            @Override            public View getView(int position, View convertView, ViewGroup parent) {                ViewHolder holder = null;                //如果緩衝convertView為空白，則需要建立View                if(convertView == null)                {                    holder = new ViewHolder();                    //根據自訂的Item布局載入布局                    convertView = mInflater.inflate(R.layout.list_item, null);                    holder.img = (ImageView)convertView.findViewById(R.id.img);                    holder.title = (TextView)convertView.findViewById(R.id.tv);                    holder.info = (TextView)convertView.findViewById(R.id.info);                    //將設定好的布局儲存到緩衝中，並將其設定在Tag裡，以便後面方便取出Tag                    convertView.setTag(holder);                }else                {                    holder = (ViewHolder)convertView.getTag();                }                holder.img.setBackgroundResource((Integer)data.get(position).get("img"));                holder.title.setText((String)data.get(position).get("title"));                holder.info.setText((String)data.get(position).get("info"));                if(position == selectedItem)                {                    //convertView.setBackgroundColor(Color.BLUE);                    //convertView.setSelected(true);                    convertView.setBackgroundResource(R.drawable.all_listentry_left_selected);                }else                {                    //convertView.setBackgroundColor(Color.GRAY);                    //convertView.setSelected(false);                    convertView.setBackgroundResource(R.drawable.lstview);                }                return convertView;            }                    }}

代碼中紅色標註處就是重點，lv.setChoiceMode(AbsListView.CHOICE_MODE_SINGLE);這句話必須要加

Defines the choice behavior for the List. By default, Lists do not have any choice behavior (CHOICE_MODE_NONE). By setting the choiceMode to CHOICE_MODE_SINGLE, the List allows up to one item to be in a chosen state. By setting the choiceMode to CHOICE_MODE_MULTIPLE, the list allows any number of items to be chosen.

實現效果如下