android自定义TabView实现圆角列表

看到很多应用的设置界面都有圆角效果的列表，类似下面的

下面说说我的实现原理：继承LinearLayout，然后设置一个自定义的TabAdapter,类似于listview，添加一个setAdapter()方法，这个方法就是将子视图加入，然后设置背景选择器效果；还可以添加风格不同的视图，通过addview方法，最后一定要调用commit方法，设置子视图的背景,对于背景有三种情况，中间项四角都是圆角，顶部圆角和顶部圆角效果

自定义TabAdapter抽象类，是要继承即可：

package com.allen.tabview;



import android.view.View;



/**

 * @package：com.allen.tabview

 * @author：Allen

 * @email：[email protected]

 * @data：2013-7-26 下午2:49:51

 * @description：适配器

 */

public abstract class TabAdapter {

      public abstract int getCount();

      public abstract Object getItem(int position);

      public abstract View getView(int position);

}

接下来是自定义的TabView

package com.allen.tabview;



import android.content.Context;

import android.util.AttributeSet;

import android.view.View;

import android.view.ViewGroup;

import android.widget.LinearLayout;



/**

 * @package：com.allen.tabview

 * @author：Allen

 * @email：[email protected]

 * @data：2013-7-26 下午2:48:36

 * @description：圆角表格

 */

public class TabView extends LinearLayout {



    TabAdapter adapter;

    /** 子视图数量 */

    int size = 0;



    public TabView(Context context) {

        super(context);

        init();

    }



    public TabView(Context context, AttributeSet attrs) {

        super(context, attrs);

        init();

    }



    void init() {

        this.setOrientation(LinearLayout.VERTICAL);

        this.setDescendantFocusability(ViewGroup.FOCUS_BLOCK_DESCENDANTS);

        this.setBackgroundResource(R.drawable.background_view_rounded_container);

    }



    /** 设置适配器 */

    public void setAdapter(TabAdapter adapter) {

        this.adapter = adapter;

        // 遍历当前的adapter

        if (adapter != null) {

            size = adapter.getCount();

            for (int i = 0; i < size; i++) {

                View child = adapter.getView(i);

                this.addView(child);

            }

            commit();

        }



    }



    @Override

    public void addView(View child) {

        // TODO Auto-generated method stub

        super.addView(child);

        child.setClickable(true);

    }



    /** 调用addView之后执行的方法 */

    public void commit() {

        int len = this.getChildCount();

        if (len > 1) {// 多项内容

            for (int i = 0; i < len; i++) {

                View child = this.getChildAt(i);

                if (i == 0) {// 顶部

                    child.setBackgroundResource(R.drawable.background_view_rounded_top);

                } else if (i > 0 && i < len - 1) {// 中间

                    child.setBackgroundResource(R.drawable.background_view_rounded_middle);

                } else if (i == len - 1) {// 底部

                    child.setBackgroundResource(R.drawable.background_view_rounded_bottom);

                }

            }

        } else if (len == 1) {// 一项内容

            View child = this.getChildAt(0);

            child.setBackgroundResource(R.drawable.background_view_rounded_single);

        }

    }



    public interface TabItemClickListener {

        void onClick(int position, View v);

    }



    TabItemClickListener itemClick;



    public void setOnItemClickListener(final TabItemClickListener itemClick) {

        this.itemClick = itemClick;

        // 绑定监听事件

        for (int i = 0; i < size; i++) {

            final int index = i;

            View childView = this.getChildAt(i);

            childView.setOnClickListener(new OnClickListener() {



                @Override

                public void onClick(View v) {

                    // TODO Auto-generated method stub

                    if (itemClick != null) {

                        itemClick.onClick(index, v);

                    }

                }

            });

        }

    }

}

View Code

最后有一点，对于整个最外层的圆角背景是使用inset，那样自动加入了分隔线效果

整个项目在github上面， 需要的可以clone和fok。。。