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> 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> getData()
        {
            List> list = new ArrayList>();
            Map map;
            for(int i=0;i<10;i++)
            {
                map = new HashMap();
                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.

实现效果如下

Android UI设计--ListView的item选中效果_第1张图片

你可能感兴趣的:(Android UI设计--ListView的item选中效果)