[应用妹 --第三篇 主界面Tab搭建2] android应用市场之快速开发

应用市场之，顶部游戏分类tab游戏以及软件分类,是用viewpage实现的。

具体实现代码如下。

public class MyTabView extends LinearLayout {
	
	/** The context. */
	private Context context;
	
	/** The m tab selector. */
	private Runnable mTabSelector;
    
    /** The m listener. */
    private ViewPager.OnPageChangeListener mListener;
    
    /** The m max tab width. */
    public int mMaxTabWidth;
    
    /** The m selected tab index. */
    private int mSelectedTabIndex;
    
    /** tab的背景. */
    private int tabBackgroundResource = -1;
    
    /** tab的文字大小. */
	private int tabTextSize = 30;
	
	/** tab的文字颜色. */
	private int tabTextColor = Color.BLACK;
	
	/** tab的选中文字颜色. */
	private int tabSelectColor = Color.BLACK;
	
	/** tab的线性布局. */
	private LinearLayout mTabLayout = null;
	
	/** tab的线性布局父. */
	private HorizontalScrollView mTabScrollView  = null;
	
	/** The m view pager. */
	private MyViewPage mViewPager;
	
	
	/** tab的文字. */
	private List<String> tabItemTextList = null;
	
	/** tab的图标. */
	private List<Drawable> tabItemDrawableList = null;
	
	/** 内容的View. */
	private ArrayList<Fragment> pagerItemList = null;
	
	/** tab的列表. */
	private ArrayList<TextView> tabItemList = null;
	
	/** 内容区域的适配器. */
	private AbFragmentPagerAdapter mFragmentPagerAdapter = null;
    
    /** The m tab click listener. */
    private OnClickListener mTabClickListener = new OnClickListener() {
        public void onClick(View view) {
        	AbTabItemView tabView = (AbTabItemView)view;
            mViewPager.setCurrentItem(tabView.getIndex());
        }
    };

    /**
     * Instantiates a new ab sliding tab view.
     *
     * @param context the context
     */
    public AbSlidingTabView(Context context) {
        this(context, null);
    }

    /**
     * Instantiates a new ab sliding tab view.
     *
     * @param context the context
     * @param attrs the attrs
     */
    public <span style="font-family: Arial, Helvetica, sans-serif;">MyTabView </span><span style="font-family: Arial, Helvetica, sans-serif;">(Context context, AttributeSet attrs) {</span>
        super(context, attrs);
        this.context = context;
        
        this.setOrientation(LinearLayout.VERTICAL);
		this.setBackgroundColor(Color.rgb(255, 255, 255));
		
		mTabScrollView  = new HorizontalScrollView(context);
		mTabScrollView.setHorizontalScrollBarEnabled(false);
		mTabScrollView.setSmoothScrollingEnabled(true);
		
		mTabLayout = new LinearLayout(context);
		mTabLayout.setOrientation(LinearLayout.HORIZONTAL);
		mTabLayout.setGravity(Gravity.CENTER);
		
		//mTabLayout是内容宽度
		mTabScrollView.addView(mTabLayout, new ViewGroup.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.FILL_PARENT));
		
		this.addView(mTabScrollView,new ViewGroup.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT));
        
		//内容的View的适配
  		mViewPager = new MyViewPage(context);
  		//手动创建的ViewPager,必须调用setId()方法设置一个id
  		mViewPager.setId(1985);
  		pagerItemList = new ArrayList<Fragment>();
  	    //定义Tab栏
  		tabItemList = new ArrayList<TextView>();
  		tabItemTextList = new ArrayList<String>();
  		tabItemDrawableList = new ArrayList<Drawable>();
 
    
    }
    
    public void initChilldManager(FragmentManager mFragmentManager){
    	//要求必须是FragmentActivity的实例，
    		
    			if(mFragmentManager==null){  //如果上面一个是fragment请传递，childSupport过来
    				mFragmentManager= ((FragmentActivity)this.context).getSupportFragmentManager();
    			}
    			mFragmentPagerAdapter = new AbFragmentPagerAdapter(mFragmentManager, pagerItemList);
    			mViewPager.setAdapter(mFragmentPagerAdapter);
    			mViewPager.setOnPageChangeListener(new MyOnPageChangeListener());
    			mViewPager.setOffscreenPageLimit(3);
    	  		
    			this.addView(mViewPager,new LinearLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));
    }
    
    /**
     * The listener interface for receiving myOnPageChange events.
     * The class that is interested in processing a myOnPageChange
     * event implements this interface, and the object created
     * with that class is registered with a component using the
     * component's <code>addMyOnPageChangeListener<code> method. When
     * the myOnPageChange event occurs, that object's appropriate
     * method is invoked.
     *
     * @see MyOnPageChangeEvent
     */
    public class MyOnPageChangeListener implements OnPageChangeListener{

		/* (non-Javadoc)
		 * @see android.support.v4.view.ViewPager.OnPageChangeListener#onPageScrollStateChanged(int)
		 */
		@Override
		public void onPageScrollStateChanged(int arg0) {
			if (mListener != null) {
	            mListener.onPageScrollStateChanged(arg0);
	        }
		}

		/* (non-Javadoc)
		 * @see android.support.v4.view.ViewPager.OnPageChangeListener#onPageScrolled(int, float, int)
		 */
		@Override
		public void onPageScrolled(int arg0, float arg1, int arg2) {
			if (mListener != null) {
	            mListener.onPageScrolled(arg0, arg1, arg2);
	        }
		}

		/* (non-Javadoc)
		 * @see android.support.v4.view.ViewPager.OnPageChangeListener#onPageSelected(int)
		 */
		@Override
		public void onPageSelected(int arg0) {
			setCurrentItem(arg0);
	        if (mListener != null) {
	            mListener.onPageSelected(arg0);
	        }
		}
		
	}

    /* (non-Javadoc)
     * @see android.widget.LinearLayout#onMeasure(int, int)
     */
    @Override
    public void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        final int widthMode = MeasureSpec.getMode(widthMeasureSpec);
        final boolean lockedExpanded = widthMode == MeasureSpec.EXACTLY;
        mTabScrollView.setFillViewport(lockedExpanded);

        final int childCount = mTabLayout.getChildCount();
        if (childCount > 1 && (widthMode == MeasureSpec.EXACTLY || widthMode == MeasureSpec.AT_MOST)) {
            if (childCount > 2) {
                mMaxTabWidth = (int)(MeasureSpec.getSize(widthMeasureSpec) * 0.4f);
            } else {
                mMaxTabWidth = MeasureSpec.getSize(widthMeasureSpec) / 2;
            }
        } else {
            mMaxTabWidth = -1;
        }

        final int oldWidth = getMeasuredWidth();
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        final int newWidth = getMeasuredWidth();

        if (lockedExpanded && oldWidth != newWidth) {
            // Recenter the tab display if we're at a new (scrollable) size.
            setCurrentItem(mSelectedTabIndex);
        }
    }

    /**
     *  滚动动画
     *
     * @param position the position
     */
    private void animateToTab(final int position) {
        final View tabView = mTabLayout.getChildAt(position);
        if (mTabSelector != null) {//前面选择的tab不为null才把它移除掉
            removeCallbacks(mTabSelector); 
        }
        mTabSelector = new Runnable() { //tab滚动效果
            public void run() {
                final int scrollPos = tabView.getLeft() - (getWidth() - tabView.getWidth()) / 2;
                mTabScrollView.smoothScrollTo(scrollPos, 0);
                mTabSelector = null;
            }
        };
        post(mTabSelector);
    }

    /* (non-Javadoc)
     * @see android.view.View#onAttachedToWindow()
     */
    @Override
    public void onAttachedToWindow() {
        super.onAttachedToWindow();
        if (mTabSelector != null) {
            // Re-post the selector we saved
            post(mTabSelector);
        }
    }

    /* (non-Javadoc)
     * @see android.view.View#onDetachedFromWindow()
     */
    @Override
    public void onDetachedFromWindow() {
        super.onDetachedFromWindow();
        if (mTabSelector != null) {
            removeCallbacks(mTabSelector);
        }
    }
    
    /**
     * 描述：创造一个Tab.
     *
     * @param text the text
     * @param index the index
     */
    private void addTab(String text, int index) {
    	addTab(text,index,null);
    }
    
    /**
     * 描述：创造一个Tab.
     *
     * @param text the text
     * @param index the index
     * @param top the top
     */
    private void addTab(String text, int index,Drawable top) {
   	
    	AbTabItemView tabView = new AbTabItemView(this.context);
        if(tabBackgroundResource!=-1){
        	tabView.setTabBackgroundResource(tabBackgroundResource);
        }
        if(top!=null){
        	tabView.setTabCompoundDrawables(null, top, null, null);
        }
    	tabView.setTabTextColor(tabTextColor);
    	tabView.setTabTextSize(tabTextSize);
        
        tabView.init(index,text);
        tabItemList.add(tabView.getTextView());
        tabView.setOnClickListener(mTabClickListener);
        mTabLayout.addView(tabView, new LayoutParams(0,LayoutParams.MATCH_PARENT,1));
    }

    /**
     * 描述：tab有变化刷新.
     */
    public void notifyTabDataSetChanged() {
        mTabLayout.removeAllViews();
        tabItemList.clear();
        final int count = mFragmentPagerAdapter.getCount();
        for (int i = 0; i < count; i++) {
        	if(tabItemDrawableList.size()>0){
        		addTab(tabItemTextList.get(i), i,tabItemDrawableList.get(i));
        	}else{
        		addTab(tabItemTextList.get(i), i);
        	}
            
        }
        if (mSelectedTabIndex > count) {
            mSelectedTabIndex = count - 1;
        }
        setCurrentItem(mSelectedTabIndex);
        requestLayout();
    }

    /**
     * 描述：设置显示哪一个.
     *
     * @param item the new current item
     */
    public void setCurrentItem(int item) {
        if (mViewPager == null) {
            throw new IllegalStateException("ViewPager has not been bound.");
        }
        mSelectedTabIndex = item;
        final int tabCount = mTabLayout.getChildCount();
        for (int i = 0; i < tabCount; i++) {
            final AbTabItemView child = (AbTabItemView)mTabLayout.getChildAt(i);
            final boolean isSelected = (i == item);
            child.setSelected(isSelected);
            if (isSelected) {
            	child.setTabTextColor(tabSelectColor);
                animateToTab(item);
            }else{
            	child.setTabTextColor(tabTextColor);
            }
        }
    }

    /**
     * 描述：设置一个外部的监听器.
     *
     * @param listener the new on page change listener
     */
    public void setOnPageChangeListener(ViewPager.OnPageChangeListener listener) {
        mListener = listener;
    }

	/**
	 * 描述：设置tab文字的颜色.
	 *
	 * @param tabColor the new tab text color
	 */
	public void setTabTextColor(int tabColor) {
		this.tabTextColor = tabColor;
	}

	/**
	 * 描述：设置选中的颜色.
	 *
	 * @param tabColor the new tab select color
	 */
	public void setTabSelectColor(int tabColor) {
		this.tabSelectColor = tabColor;
	}

	/**
	 * 描述：设置文字大小.
	 *
	 * @param tabTextSize the new tab text size
	 */
	public void setTabTextSize(int tabTextSize) {
		this.tabTextSize = tabTextSize;
	}
	
	/**
	 * 描述：设置单个tab的背景选择器.
	 *
	 * @param resid the new tab background resource
	 */
	public void setTabBackgroundResource(int resid) {
    	tabBackgroundResource = resid;
    }
	
	/**
	 * 描述：设置Tab的背景.
	 *
	 * @param resid the new tab layout background resource
	 */
	public void setTabLayoutBackgroundResource(int resid) {
		this.mTabLayout.setBackgroundResource(resid);
	}
	
	/**
	 * 描述：增加一组内容与tab.
	 *
	 * @param tabTexts the tab texts
	 * @param fragments the fragments
	 */
	public void addItemViews(List<String> tabTexts,List<Fragment> fragments){
		
		tabItemTextList.addAll(tabTexts);
		pagerItemList.addAll(fragments);
		mFragmentPagerAdapter.notifyDataSetChanged();
		notifyTabDataSetChanged();
	}
	
	/**
	 * 描述：增加一组内容与tab.
	 *
	 * @param tabTexts the tab texts
	 * @param fragments the fragments
	 * @param drawables the drawables
	 */
	public void addItemViews(List<String> tabTexts,List<Fragment> fragments,List<Drawable> drawables){
		
		tabItemTextList.addAll(tabTexts);
		pagerItemList.addAll(fragments);
		tabItemDrawableList.addAll(drawables);
		mFragmentPagerAdapter.notifyDataSetChanged();
		notifyTabDataSetChanged();
	}
	
	/**
	 * 描述：增加一个内容与tab.
	 *
	 * @param tabText the tab text
	 * @param fragment the fragment
	 */
	public void addItemView(String tabText,Fragment fragment){
		tabItemTextList.add(tabText);
		pagerItemList.add(fragment);
		mFragmentPagerAdapter.notifyDataSetChanged();
		notifyTabDataSetChanged();
	}
	
	/**
	 * 描述：增加一个内容与tab.
	 *
	 * @param tabText the tab text
	 * @param fragment the fragment
	 * @param drawable the drawable
	 */
	public void addItemView(String tabText,Fragment fragment,Drawable drawable){
		tabItemTextList.add(tabText);
		pagerItemList.add(fragment);
		tabItemDrawableList.add(drawable);
		mFragmentPagerAdapter.notifyDataSetChanged();
		notifyTabDataSetChanged();
	}
	
	
	/**
	 * 描述：删除某一个.
	 *
	 * @param index the index
	 */
	public void removeItemView(int index){
		
		mTabLayout.removeViewAt(index);
		pagerItemList.remove(index);
		tabItemList.remove(index);
		tabItemDrawableList.remove(index);
		tabItemTextList.remove(index); 
		mFragmentPagerAdapter.notifyDataSetChanged();
		notifyTabDataSetChanged();
	}
	
	/**
	 * 描述：删除所有.
	 */
	public void removeAllItemViews(){
		mTabLayout.removeAllViews();
		pagerItemList.clear();
		tabItemList.clear();
		tabItemDrawableList.clear();
		tabItemTextList.clear(); 
		mFragmentPagerAdapter.notifyDataSetChanged();
		notifyTabDataSetChanged();
	}
	
	/**
	 * 描述：获取这个View的ViewPager.
	 *
	 * @return the view pager
	 */
	public ViewPager getViewPager() {
		return mViewPager;
	}
	
	/**
	 * 描述：设置每个tab的边距.
	 *
	 * @param left the left
	 * @param top the top
	 * @param right the right
	 * @param bottom the bottom
	 */
	public void setTabPadding(int left, int top, int right, int bottom) {
		for(int i = 0;i<tabItemList.size();i++){
			TextView tv = tabItemList.get(i);
			tv.setPadding(left, top, right, bottom);
		}
	}
    
}

解决  viewpage 嵌套viewpage

package com.ferris.view;

import android.content.Context;
import android.support.v4.view.ViewPager;
import android.util.AttributeSet;
import android.view.View;

public class MyViewPage extends ViewPager {
	public MyViewPage(Context context) {
		super(context);
		// TODO Auto-generated constructor stub
	}
	public MyViewPage(Context context, AttributeSet attrs) {
		super(context, attrs);
		// TODO Auto-generated constructor stub
		
	}
	@Override
	protected boolean canScroll(View v, boolean checkV, int dx, int x, int y) {
	   if(v != this && v instanceof AbSlidingPlayView) {//解决  viewpage 嵌套viewpage
	      return true;
	   }
	   return super.canScroll(v, checkV, dx, x, y);
	}
	
//	//If the child viewpager is at the end, scroll the parent
//
//	protected boolean canScroll(View v, boolean checkV, int dx, int x, int y) {
//	    if(v != this && v instanceof ViewPager) {
//	        int currentItem = ((ViewPager) v).getCurrentItem();
//	        int countItem = ((ViewPager) v).getAdapter().getCount();
//	        if((currentItem==(countItem-1) && dx<0) || (currentItem==0 && dx>0)){
//	            return false;
//	        }
//	        return true;
//	    }
//	    return super.canScroll(v, checkV, dx, x, y);
//	}


}