Android Tab切换表格头

Android Tab切换表格，如图：

1.横向：

2.竖向：

xml：布局

    <com.example.momo.myconcept.view.SegmentControl xmlns:segmentcontrol="http://schemas.android.com/apk/res-auto"        android:id="@+id/segment_control"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:textSize="13sp"        segmentcontrol:colors="#0099CC"        segmentcontrol:cornerRadius="6dp"        segmentcontrol:direction="horizon"        segmentcontrol:gaps="10dp"        segmentcontrol:horizonGap="20dp"        segmentcontrol:texts="语文|数学|外语/>

attrs.xml：

<?xml version="1.0" encoding="utf-8"?><resources>    <declare-styleable name="SegmentControl">        <attr name="cornerRadius" format="dimension|reference" />        <attr name="colors" format="color|reference" />        <attr name="texts" format="string|reference" />        <attr name="android:textSize" />        <attr name="direction" format="enum">            <enum name="horizon" value="0" />            <enum name="vertical" value="1" />        </attr>        <attr name="gaps" format="dimension|reference" />        <attr name="horizonGap" format="dimension|reference" />        <attr name="verticalGap" format="dimension|reference" />    </declare-styleable></resources>

java：

package com.example.momo.myconcept.view;import android.content.Context;import android.content.res.ColorStateList;import android.content.res.TypedArray;import android.graphics.Canvas;import android.graphics.Paint;import android.graphics.Rect;import android.os.Build;import android.util.AttributeSet;import android.util.TypedValue;import android.view.MotionEvent;import android.view.View;import android.view.ViewConfiguration;import com.example.momo.myconcept.R;public class SegmentControl extends View {    private String[] mTexts;    private Rect[] mCacheBounds;    private Rect[] mTextBounds;    private RadiusDrawable mBackgroundDrawable;    private RadiusDrawable mSelectedDrawable;    private int mCurrentIndex;    private int mTouchSlop;    private boolean inTapRegion;    private float mStartX;    private float mStartY;    private float mCurrentX;    private float mCurrentY;    private int mHorizonGap;    private int mVerticalGap;    private int mCenterX;    private int mCenterY;    private int mChildrenWidth;    private int mChildrenHeight;    private int mSingleChildWidth;    private int mSingleChildHeight;    private Paint mPaint;    public enum Direction{        HORIZON(0), VERTICAL(1);        int mV;        private Direction(int v){            mV = v;        }    }    private Direction mDirection;    private int mTextSize;    private ColorStateList mColors;    private int mCornerRadius;    public interface OnSegmentControlClickListener{        public void onSegmentControlClick(int index);    }    private OnSegmentControlClickListener mOnSegmentControlClickListener;    public SegmentControl(Context context){        this(context, null);    }    public SegmentControl(Context context,AttributeSet attrs){        this(context, attrs, 0);    }    public SegmentControl(Context context, AttributeSet attrs, int defStyle){        super(context, attrs, defStyle);        TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.SegmentControl);        String textArray = ta.getString(R.styleable.SegmentControl_texts);        if(textArray != null){            mTexts = textArray.split("\\|");        }        mTextSize = ta.getDimensionPixelSize(R.styleable.SegmentControl_android_textSize, (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, 14, context.getResources().getDisplayMetrics()));        mColors = ta.getColorStateList(R.styleable.SegmentControl_colors);        mCornerRadius = ta.getDimensionPixelSize(R.styleable.SegmentControl_cornerRadius, (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 5, context.getResources().getDisplayMetrics()));        mDirection = Direction.values()[ta.getInt(R.styleable.SegmentControl_direction, 0)];        mHorizonGap = ta.getDimensionPixelSize(R.styleable.SegmentControl_horizonGap, 0);        mVerticalGap = ta.getDimensionPixelSize(R.styleable.SegmentControl_verticalGap, 0);        int gap = ta.getDimensionPixelSize(R.styleable.SegmentControl_gaps, (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 2, context.getResources().getDisplayMetrics()));        if(mHorizonGap == 0) mHorizonGap = gap;        if(mVerticalGap == 0) mVerticalGap = gap;        ta.recycle();        mBackgroundDrawable = new RadiusDrawable(mCornerRadius, true, 0);        mBackgroundDrawable.setStrokeWidth(2);        if(mColors == null){            mColors = new ColorStateList(new int[][]{{}}, new int[]{0xFF0099CC});        }        mBackgroundDrawable.setStrokeColor(mColors.getDefaultColor());        if(Build.VERSION.SDK_INT < 16){            setBackgroundDrawable(mBackgroundDrawable);        }else{            setBackground(mBackgroundDrawable);        }        mSelectedDrawable = new RadiusDrawable(mCornerRadius, false, mColors.getDefaultColor());        mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);        mPaint.setTextSize(mTextSize);        mPaint.setColor(mColors.getDefaultColor());        //here's the tricky thing, when you doing a click detect on a capacitive touch screen,        //sometimes the touch points of touchDown and touchUp are different(it's call slop) even when you didn't actually move your finger,        //so we set a distance limit for the distance of this two touch points to create a better user experience;        int touchSlop = 0;        if(context == null){            touchSlop = ViewConfiguration.getTouchSlop();        }else{            final ViewConfiguration config = ViewConfiguration.get(context);            touchSlop = config.getScaledTouchSlop();        }        mTouchSlop = touchSlop * touchSlop;        inTapRegion = false;    }    public void setOnSegmentControlClickListener(OnSegmentControlClickListener onSegmentControlClickListener){        mOnSegmentControlClickListener = onSegmentControlClickListener;    }    public OnSegmentControlClickListener getOnSegmentControlClicklistener(){        return mOnSegmentControlClickListener;    }    public void setText(String... texts){        mTexts = texts;        if(mTexts != null){            requestLayout();        }    }    public void setColors(ColorStateList colors){        mColors = colors;        if(mBackgroundDrawable != null){            mBackgroundDrawable.setStrokeColor(colors.getDefaultColor());        }        if(mSelectedDrawable != null){            mSelectedDrawable.setColor(colors.getDefaultColor());        }        mPaint.setColor(colors.getDefaultColor());        invalidate();    }    public void setCornerRadius(int cornerRadius){        mCornerRadius = cornerRadius;        if(mBackgroundDrawable != null){            mBackgroundDrawable.setRadius(cornerRadius);        }        invalidate();    }    public void setDirection(Direction direction){        Direction tDirection = mDirection;        mDirection = direction;        if(tDirection != direction){            requestLayout();            invalidate();        }    }    public void setTextSize(int textSize){        setTextSize(TypedValue.COMPLEX_UNIT_SP, textSize);    }    public void setTextSize(int unit, int textSize){        mPaint.setTextSize((int) (TypedValue.applyDimension(unit, textSize, getContext().getResources().getDisplayMetrics())));        if(textSize != mTextSize){            mTextSize = textSize;            requestLayout();        }    }    @Override    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec){        super.onMeasure(widthMeasureSpec, heightMeasureSpec);        int widthMode = MeasureSpec.getMode(widthMeasureSpec);        int heightMode = MeasureSpec.getMode(heightMeasureSpec);        int widthSize = MeasureSpec.getSize(widthMeasureSpec);        int heightSize = MeasureSpec.getSize(heightMeasureSpec);        int width = 0;        int height = 0;        if(mTexts != null && mTexts.length > 0){            if(mCacheBounds == null || mCacheBounds.length != mTexts.length){                mCacheBounds = new Rect[mTexts.length];            }            if(mTextBounds == null || mTextBounds.length != mTexts.length){                mTextBounds = new Rect[mTexts.length];            }            for(int i = 0; i < mTexts.length; i++){                String text = mTexts[i];                if(text != null){                    if(mTextBounds[i] == null) mTextBounds[i] = new Rect();                    mPaint.getTextBounds(text, 0, text.length(), mTextBounds[i]);                    if(mSingleChildWidth < mTextBounds[i].width() + mHorizonGap * 2) mSingleChildWidth = mTextBounds[i].width() + mHorizonGap * 2;                    if(mSingleChildHeight < mTextBounds[i].height() + mVerticalGap * 2) mSingleChildHeight = mTextBounds[i].height() + mVerticalGap * 2;                }            }            for(int i = 0; i < mTexts.length; i++){                if (mCacheBounds[i] == null) mCacheBounds[i] = new Rect();                if(mDirection == Direction.HORIZON){                    mCacheBounds[i].left = i * mSingleChildWidth;                    mCacheBounds[i].top = 0;                }else{                    mCacheBounds[i].left = 0;                    mCacheBounds[i].top = i * mSingleChildHeight;                }                mCacheBounds[i].right = mCacheBounds[i].left + mSingleChildWidth;                mCacheBounds[i].bottom = mCacheBounds[i].top + mSingleChildHeight;            }            switch(widthMode){                case MeasureSpec.AT_MOST:                    if(mDirection == Direction.HORIZON){                        if(widthSize <= mSingleChildWidth * mTexts.length){                            mSingleChildWidth = widthSize / mTexts.length;                            width = widthSize;                        }else{                            width = mSingleChildWidth * mTexts.length;                        }                    }else{                        width = widthSize <= mSingleChildWidth ? widthSize : mSingleChildWidth;                    }                    break;                case MeasureSpec.EXACTLY:                    width = widthSize;                    break;                case MeasureSpec.UNSPECIFIED:                    if(mDirection == Direction.HORIZON){                        width = mSingleChildWidth * mTexts.length;                    }else{                        width = widthSize <= mSingleChildWidth ? widthSize : mSingleChildWidth;                    }                    break;            }            switch(heightMode){                case MeasureSpec.AT_MOST:                    if(mDirection == Direction.VERTICAL){                        if(heightSize <= mSingleChildHeight * mTexts.length){                            mSingleChildHeight = heightSize / mTexts.length;                            height = heightSize;                        }else{                            height = mSingleChildHeight * mTexts.length;                        }                    }else{                        height = heightSize <= mSingleChildHeight ? heightSize : mSingleChildHeight;                    }                    break;                case MeasureSpec.EXACTLY:                    height = heightSize;                    break;                case MeasureSpec.UNSPECIFIED:                    if(mDirection == Direction.VERTICAL){                        height = mSingleChildHeight * mTexts.length;                    }else{                        height = heightSize <= mSingleChildHeight ? heightSize : mSingleChildHeight;                    }                    break;            }            mChildrenWidth = mDirection == Direction.HORIZON ? mSingleChildWidth * mTexts.length : mSingleChildWidth;            mChildrenHeight = mDirection == Direction.VERTICAL ? mSingleChildHeight * mTexts.length : mSingleChildHeight;        }else{            width = widthMode == MeasureSpec.UNSPECIFIED ? 0 : widthSize;            height = heightMode == MeasureSpec.UNSPECIFIED ? 0 : heightSize;        }        mCenterX = width / 2;        mCenterY = height / 2;        setMeasuredDimension(width, height);    }    @Override    public boolean onTouchEvent(MotionEvent event){        switch(event.getAction() & MotionEvent.ACTION_MASK){            case MotionEvent.ACTION_DOWN:                inTapRegion = true;                mStartX = event.getX();                mStartY = event.getY();                break;            case MotionEvent.ACTION_MOVE:                mCurrentX = event.getX();                mCurrentY = event.getY();                int dx = (int) (mCurrentX - mStartX);                int dy = (int) (mCurrentY - mStartY);                int distance = dx * dx + dy * dy;                if(distance > mTouchSlop){                    inTapRegion = false;                }                break;            case MotionEvent.ACTION_UP:                if(inTapRegion){                    int index = 0;                    if(mDirection == Direction.HORIZON){                        index = (int) (mStartX / mSingleChildWidth);                    }else{                        index = (int) (mStartY / mSingleChildHeight);                    }                    if(mOnSegmentControlClickListener != null) mOnSegmentControlClickListener.onSegmentControlClick(index);                    mCurrentIndex = index;                    invalidate();                }                break;        }        return true;    }    public void setSelectedIndex(int index){        mCurrentIndex = index;        invalidate();    }    @Override    public void onDraw(Canvas canvas){        super.onDraw(canvas);        if(mTexts != null && mTexts.length > 0){            for(int i = 0; i < mTexts.length; i++){                //draw separate lines                if(i < mTexts.length - 1){                    mPaint.setColor(mColors.getDefaultColor());                    if(mDirection == Direction.HORIZON){                        canvas.drawLine(mCacheBounds[i].right, 0, mCacheBounds[i].right, getHeight(), mPaint);                    }else{                        canvas.drawLine(mCacheBounds[i].left, mSingleChildHeight * (i + 1), mCacheBounds[i].right, mSingleChildHeight * (i + 1), mPaint);                    }                }                //draw selected drawable                if(i == mCurrentIndex && mSelectedDrawable != null){                    int topLeftRadius = 0;                    int topRightRadius = 0;                    int bottomLeftRadius = 0;                    int bottomRightRadius = 0;                    if(mDirection == Direction.HORIZON){                        if(i == 0){                            topLeftRadius = mCornerRadius;                            bottomLeftRadius = mCornerRadius;                        }else if(i == mTexts.length - 1){                            topRightRadius = mCornerRadius;                            bottomRightRadius = mCornerRadius;                        }                    }else{                        if(i == 0){                            topLeftRadius = mCornerRadius;                            topRightRadius = mCornerRadius;                        }else if(i == mTexts.length - 1){                            bottomLeftRadius = mCornerRadius;                            bottomRightRadius = mCornerRadius;                        }                    }                    mSelectedDrawable.setRadiuses(topLeftRadius, topRightRadius, bottomLeftRadius, bottomRightRadius);                    mSelectedDrawable.setBounds(mCacheBounds[i]);                    mSelectedDrawable.draw(canvas);                    mPaint.setColor(0xFFFFFFFF);                }else{                    mPaint.setColor(mColors.getDefaultColor());                }                //draw texts                canvas.drawText(mTexts[i], mCacheBounds[i].left + (mSingleChildWidth - mTextBounds[i].width()) / 2, mCacheBounds[i].top + ((mSingleChildHeight + mTextBounds[i].height()) / 2), mPaint);            }        }    }}

用法 MainActivity：

public class MainActivity extends Activity  {    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        SegmentControl segmentControl = (SegmentControl)findViewById(R.id.segment_control);        segmentControl.setSelectedIndex(1);        segmentControl.setOnSegmentControlClickListener(new SegmentControl.OnSegmentControlClickListener() {            @Override            public void onSegmentControlClick(int index) {                Toast.makeText(MainActivity.this,"this "+index,Toast.LENGTH_LONG).show();            }        });    }}

参考：Git: SHSegmentControl

程序代码参考：点击打开链接