最近由于项目加急，手里有好多看了差不多的开源项目，其中好多是大家经常用到的。图片的缓存BitmapFun(Android的文档中)，AfinalMap,下拉刷新PullToRefresh等等吧，不过由于项目需要，我要就简要说下今天我要讲的这个组件，这个组件的项目地址.

看着左边的猪脚是不是觉得这个很像IOS中的UITableView，不过我告诉这是Android的ListView。

没看代码前，我看到作者说这个是a customized ListView，这是不敢相信，ListView是每一项都基本上一样，看看我们猪脚，怎么看都不像，不过后来一看代码，这不用ListView还用什么呢。

    在开始前，先扯远点，在Android中感觉组件中最常用且最有个性且最复杂的就是ListView了，你想想PullToRefreshListView,SwipToDismiss 以及后来的点击展开的那个叫ExpandableList，无一不是ListView的杰出代表。貌似GoogleMail客户端的ListView挺有意思，有兴趣看看他是怎么实现的。

      对了，我的3DListView翻译也是ListView开始的，尽管没写完剩下的文章，不过我会补上的。

 

     为什么要用到UITableView

因为要做一个定位选择机构的页面，和美团、糯米的客户端定位很相似，上面是个定位的Item，下面显示的各位城市的Item，这个在IOS那肯定是用UITableView，且我的IOS同时也在做这个页面，的确就是用UITableView。

一个分组下，是几个Item。如热门城市：北京 武汉 信阳    全部城市：A 鞍山市 安庆市……信阳市……资阳市

实现原理

看看这个UITableView样式,其实就两种Item，每个分组（Group）的顶部标题（Header）和每个分组的列表选项（Cell）。

为了使ListVIew的positiom和UITableView中对应的分组（Group）和分组中的位置（Row），我们需要一个对应二者的一个数据结构，我们把它定为IndexPath。

我们需要根据数据分组，每个分组里都要一个Header和多个Cell，而在Listview中无论Cell亦或是Header我们统一认为它是一个Item，只是这个Item的IndexPath的属性不一样，他可能是一个Header，那个对应他的View就是一个HeaderView，同理Cell对应的是CellView，这个是不是可以理解呢。

用法

先去Github上现在UITableViewUI库：下载地址

建立一个自己的项目。

public class MainActivity extends Activity implements OnClickListener {

    UITableView tableView;

    private Button btnChange = null;

    SimpleUITableViewAdapter tableViewAdapter;

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);

         tableViewAdapter = new SimpleUITableViewAdapter();

        tableView = (UITableView) findViewById(R.id.listView);

        tableView.setAdapter(tableViewAdapter);

        tableView.setOnCellClickListener(tableViewAdapter);

        tableView.setOnCellLongClickListener(tableViewAdapter);

        tableView.setOnCellAccessoryClickListener(tableViewAdapter);

        tableView.setOnHeaderClickListener(tableViewAdapter);

        tableView.setOnHeaderLongClickListener(tableViewAdapter);

        btnChange = (Button) findViewById(R.id.btnChange);

        btnChange.setOnClickListener(this);

    }

    @Override

    public void onClick(View v) {

        int id = v.getId();

        if(id == R.id.btnChange){

            tableViewAdapter.setChange();

        }

    }

    class SimpleUITableViewAdapter extends UITableViewAdapter implements OnCellClickListener, OnCellLongClickListener, OnCellAccessoryClickListener, OnHeaderClickListener, OnHeaderLongClickListener {

        private int[] color_line1_default;

        private int[] color_line2_default;

        private int[] color_line1_pressed;

        private int[] color_line2_pressed;

        public SimpleUITableViewAdapter() {

            // Prepare two sets of colors for odd and even lines

            color_line1_default = new int[] { getResources().getColor(R.color.base_start_color_line1_default), getResources().getColor(R.color.base_start_color_line1_default) };

            color_line2_default = new int[] { getResources().getColor(R.color.base_start_color_line2_default), getResources().getColor(R.color.base_start_color_line2_default) };

            color_line1_pressed = new int[] { getResources().getColor(R.color.base_start_color_line1_pressed), getResources().getColor(R.color.base_start_color_line1_pressed) };

            color_line2_pressed = new int[] { getResources().getColor(R.color.base_start_color_line2_pressed), getResources().getColor(R.color.base_start_color_line2_pressed) };

        }

        int number = 4;

        int rad = 1;

        public void setChange(){

            number = 3;

            rad = 2;

        }

        @Override

        public int numberOfGroups() {

            return number;

        }

        @Override

        public int numberOfRows(int group) {

            return (group + rad) * 2;

        }

        @Override

        public UITableHeaderItem headerItemForGroup(Context context, IndexPath indexPath) {

            return new UITableHeaderItem("Group " + indexPath.getGroup());

        }

        @Override

        public UITableCellItem cellItemForRow(Context context, IndexPath indexPath) {

            String title = "Cell number " + indexPath.getRow() + " in group " + indexPath.getGroup();

            String subtitle = (indexPath.getRow() % 2 == 0) ? "Subtitle " + indexPath.getRow() : null;

            return new UITableCellItem(title, subtitle);

        }

        @Override

        public UITableHeaderView headerViewForGroup(Context context, IndexPath indexPath, UITableHeaderItem headerItem, UITableHeaderView convertView) {

            UITableHeaderView headerView;

            if (convertView == null) {

                // If the recycled view is null, we just creating one

                headerView = new UITableHeaderView(context, indexPath);

            } else {

                headerView = (UITableHeaderView) convertView;

            }

            headerView.setTitle(headerItem.title);

            return headerView;

        }

        @Override

        public UITableCellView cellViewForRow(Context context, IndexPath indexPath, UITableCellItem cellItem, UITableCellView convertView) {

            UITableCellView cellView;

            if (convertView == null) {

                // If the recycled view is null, we just creating one with cell's commons parameters

                cellView = new UITableCellView(context, indexPath);

                cellView.setMinimumHeight(80);

                cellView.setAccessory(AccessoryType.DISCLOSURE);

            } else {

                cellView = (UITableCellView) convertView;

            }

            cellView.setTitle(cellItem.title);

            cellView.setSubtitle(cellItem.subtitle);

            // Set alternated background color

            if (indexPath.getRow() % 2 == 0) {

                cellView.setBackgroundColor(color_line1_default, color_line1_pressed);

            } else {

                cellView.setBackgroundColor(color_line2_default, color_line2_pressed);

            }

            return cellView;

        }

        @Override

        public void onCellClick(IndexPath indexPath) {

            Toast.makeText(getApplicationContext(), "Cell clicked : " + indexPath, 1000).show();

        }

        @Override

        public boolean onCellLongClick(IndexPath indexPath) {

            Toast.makeText(getApplication(), "Cell long clicked : " + indexPath, 1000).show();

            return indexPath.getRow() % 2 == 0; // Consume the long click one row out of two

        }

        @Override

        public void onCellAccessoryClick(IndexPath indexPath) {

            Toast.makeText(getApplication(), "Cell accessory clicked : " + indexPath, 1000).show();

        }

        @Override

        public void onHeaderClick(IndexPath indexPath) {

            Toast.makeText(getApplicationContext(), "Header clicked : " + indexPath, 1000).show();

        }

        @Override

        public boolean onHeaderLongClick(IndexPath indexPath) {

            Toast.makeText(getApplicationContext(), "Header long clicked : " + indexPath, 1000).show();

            return indexPath.getGroup() % 2 == 0;   // Consume the long click one row out of two

        }

    }

}

    看下这个SimpleUITableViewAdapter 的实现，headerItemForGroup （）和cellItemForRow （）这个是需要的item数据，headerViewForGroup（）和cellViewForRow是为分组的顶部标题和分组中的列表选项的试图展示。numberOfGroups（）numberOfRows(int group)则表示每个分组的个数和对应group分组下的选项个数。

         

这个例子看着你不是觉得这个很有意思啊。

下一篇我们就可以看一下他的项目设计详细设计吧。