Android 使用 ViewPager 实现左右滑动 View

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <android.support.v4.view.ViewPager
        android:id="@+id/vpSlideView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center" >

        <android.support.v4.view.PagerTabStrip
            android:id="@+id/ptsSlideView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="top" />
    </android.support.v4.view.ViewPager>

</LinearLayout>

/**
 *Copyright(C) 2014 Beijing Oradt Ltd.
                For Digital Visiting Card 1.0
 *File Name:SlideViewActivity.java
 *Description：滑动视图主界面
 *Author: Xiao JinLai
 *Date:2014-12-19下午3:52:50
 *History：
    Date:      Author:      Depiction:
 */
public class SlideViewActivity extends Activity {

    private View mView1, mView2, mView3;
    private ViewPager mViewPager;
    private PagerTitleStrip mPagerTitleStrip; // viewpager的标题
    private PagerTabStrip mPagerTabStrip; // 一个viewpager的指示器，效果就是一个横的粗的下划线
    private List<View> mViews;// 把需要滑动的页卡添加到这个list中
    private List<String> mTitleList; // viewpager的标题

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        initControl();
    }

    private void initControl() {

        setContentView(R.layout.activity_slide_view);

        mViewPager=(ViewPager) findViewById(R.id.vpSlideView);
        
        mPagerTabStrip=(PagerTabStrip) findViewById(R.id.ptsSlideView); 
        mPagerTabStrip.setTabIndicatorColor(getResources().getColor(android.R.color.holo_green_dark));  
        mPagerTabStrip.setDrawFullUnderline(false); 
        mPagerTabStrip.setBackgroundColor(getResources().getColor(android.R.color.holo_green_light)); 
//        mPagerTabStrip.setTextSpacing(550);
        
        LayoutInflater tLayoutInflater = getLayoutInflater().from(this);
        mView1 = tLayoutInflater.inflate(R.layout.slide_view1, null);
        mView2 = tLayoutInflater.inflate(R.layout.slide_view2, null);
        mView3 = tLayoutInflater.inflate(R.layout.slide_view3, null);

        mViews = new ArrayList<View>();// 将要分页显示的View装入数组中
        mViews.add(mView1);
        mViews.add(mView2);
        mViews.add(mView3);

        mTitleList = new ArrayList<String>();// 每个页面的Title数据
        mTitleList.add("评级");
        mTitleList.add("时间");
        mTitleList.add("日期");

        mViewPager.setAdapter(new SlideViewAdapter(mViews,mTitleList));
    }
}

/**
 *Copyright(C) 2014 Beijing Oradt Ltd.
                For Digital Visiting Card 1.0
 *File Name:SlideViewAdapter.java
 *Description：滑动视图适配器
 *Author: Xiao JinLai
 *Date:2014-12-19下午3:52:16
 *History：
    Date:      Author:      Depiction:
 */
public class SlideViewAdapter extends PagerAdapter {

    private List<View> mViews;
    private List<String> mTitleList;

    public SlideViewAdapter(List<View> views, List<String> titleList) {

        this.mViews = views;
        this.mTitleList = titleList;
    }

    /**
     * 返回可用的视图的总数
     */
    @Override
    public int getCount() {

        return mViews.size();
    }

    @Override
    public boolean isViewFromObject(View view, Object object) {

        return view == object;
    }

    /**
     * PagerAdapter只缓存三张要显示的图片，如果滑动的图片超出了缓存的范围，就会调用这个方法，将图片销毁 View：是
     * instantiateItem 中已添加的 view position：0 object：是 ViewGroup view
     * 子View的第0个元素。
     */
    @Override
    public void destroyItem(ViewGroup view, int position, Object object) {

        view.removeView(mViews.get(position));

    }

    /**
     * 当要显示的图片可以进行缓存的时候，会调用这个方法进行显示图片的初始化， 我们将要显示的 ImageView 加入到 ViewGroup
     * 中，然后作为返回值返回即可
     */
    @Override
    public Object instantiateItem(ViewGroup container, int position) {

        container.addView(mViews.get(position));

        return mViews.get(position);
    }

    /**
     * 设置当前的标题
     */
    @Override
    public CharSequence getPageTitle(int position) {

        return mTitleList.get(position);
    }
}

总结：

1.mPagerTabStrip.setTextSpacing(int textSpacing); //用来设置标题的间距

此方法中的 textSpacing 值必须大于 64 dp ,否则按 64 dp 处理，看源码

    private static final int TAB_PADDING = 16; // dp
    private static final int TAB_SPACING = 32; // dp
    private static final int MIN_TEXT_SPACING = TAB_SPACING + TAB_PADDING * 2; // dp

    public PagerTabStrip(Context context, AttributeSet attrs) {
        super(context, attrs);

        mIndicatorColor = mTextColor;
        mTabPaint.setColor(mIndicatorColor);

        // Note: this follows the rules for Resources#getDimensionPixelOffset/Size:
        //       sizes round up, offsets round down.
        final float density = context.getResources().getDisplayMetrics().density;
        mIndicatorHeight = (int) (INDICATOR_HEIGHT * density + 0.5f);
        mMinPaddingBottom = (int) (MIN_PADDING_BOTTOM * density + 0.5f);
        mMinTextSpacing = (int) (MIN_TEXT_SPACING * density);
        mTabPadding = (int) (TAB_PADDING * density + 0.5f);
        mFullUnderlineHeight = (int) (FULL_UNDERLINE_HEIGHT * density + 0.5f);
        mMinStripHeight = (int) (MIN_STRIP_HEIGHT * density + 0.5f);
        mTouchSlop = ViewConfiguration.get(context).getScaledTouchSlop();

        // Enforce restrictions
        setPadding(getPaddingLeft(), getPaddingTop(), getPaddingRight(), getPaddingBottom());
        setTextSpacing(getTextSpacing());

        setWillNotDraw(false);

        mPrevText.setFocusable(true);
        mPrevText.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                mPager.setCurrentItem(mPager.getCurrentItem() - 1);
            }
        });

        mNextText.setFocusable(true);
        mNextText.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                mPager.setCurrentItem(mPager.getCurrentItem() + 1);
            }
        });

        if (getBackground() == null) {
            mDrawFullUnderline = true;
        }
    }

    @Override
    public void setTextSpacing(int textSpacing) {
        if (textSpacing < mMinTextSpacing) {
            textSpacing = mMinTextSpacing;
        }
        super.setTextSpacing(textSpacing);
    }


2.PagerTabStrip 继承自 PagerTitleStrip ，所以用一个就够了。