ViewPager+PagerAdapter实现带指示器的引导页

一个简单的引导页,由ViewPager和PagerAdapter组成,供大家参考,具体内容如下

package com.xspacing.viewpager;

import java.util.ArrayList;
import java.util.List;

import android.app.Activity;
import android.os.Bundle;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.util.Log;
import android.view.View;
import android.view.ViewTreeObserver.OnGlobalLayoutListener;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.LinearLayout.LayoutParams;
import android.widget.RelativeLayout;
/**
 * 
 * @ClassName MainActivity.java
 * @Description TODO 引导页
 * @author Smile
 * @version v1.0
 * @date 2016年9月26日 
 */
public class MainActivity extends Activity {

  protected static final String TAG = "MainActivity";
  ViewPager mViewPager;
  List list;
  private LinearLayout mLinearLayout;

  // 两个小灰点的距离
  private int poitWidth;
  private ImageView mViewPress;
  private ImageView mViewNotPress;
  private Button btnStart;

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    initViews();
    initDatas();
  }

  private void initViews() {
    mViewPager = (ViewPager) findViewById(R.id.main_view_pager);
    mLinearLayout = (LinearLayout) findViewById(R.id.main_point);
    mViewPress = (ImageView) findViewById(R.id.main_red_point_press);
    btnStart = (Button) findViewById(R.id.main_btn);
  }

  private void initDatas() {
    list = new ArrayList();
    final int imageId[] = { R.drawable.a, R.drawable.b, R.drawable.c };
    for (int i = 0; i < imageId.length; i++) {
      ImageView imageView = new ImageView(this);
      imageView.setBackgroundResource(imageId[i]);
      list.add(imageView);
      mViewNotPress = new ImageView(this);
      mViewNotPress.setImageResource(R.drawable.shape_grey_point_not_press);
      LayoutParams layoutParams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT,
          LinearLayout.LayoutParams.WRAP_CONTENT);
      if (i != 0) {
        layoutParams.leftMargin = 20;
      }
      mLinearLayout.addView(mViewNotPress, layoutParams);

    }

    // 由于在执行onCreate()的时候,界面还没有被绘制完成,所有拿不到poitWidth,
    // 要拿到视图树,监听视图的绘制完成,才能拿到poitWidth
    mViewPress.getViewTreeObserver().addOnGlobalLayoutListener(new OnGlobalLayoutListener() {

      @Override
      public void onGlobalLayout() {
        poitWidth = mLinearLayout.getChildAt(1).getLeft() - mLinearLayout.getChildAt(0).getLeft();
        Log.i(TAG, poitWidth + "");
      }
    });
    mViewPager.setAdapter(new ViewPgerAdapter(this, list));

    mViewPager.addOnPageChangeListener(new OnPageChangeListener() {

      // 当前选中的是第几个界面
      @Override
      public void onPageSelected(int position) {
        if (position==imageId.length-1) {
          btnStart.setVisibility(View.VISIBLE);
        }
        else {
          btnStart.setVisibility(View.GONE);
        }
      }

      // 界面滑动的时候,会不断地回调这个方法
      // 第二个参数是当前页面滑过的百分比(0.0到1.0)
      @Override
      public void onPageScrolled(int position, float offset, int arg2) {
        Log.i(TAG, "arg1:" + offset);
        // 小红点当前滑动的距离
        int width = (int) (poitWidth * offset + position * poitWidth);
        RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) mViewPress.getLayoutParams();
        layoutParams.leftMargin = width;
        mViewPress.setLayoutParams(layoutParams);
      }

      @Override
      public void onPageScrollStateChanged(int arg0) {

      }
    });
  }

}
package com.xspacing.viewpager;

import java.util.List;

import android.content.Context;
import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;

public class ViewPgerAdapter extends PagerAdapter {

  Context mContext;
  List list;

  public ViewPgerAdapter(Context context, List list) {
    this.mContext = context;
    this.list = list;
  }

  // 页数
  @Override
  public int getCount() {
    return list.size();
  }

  // 复用页卡
  @Override
  public boolean isViewFromObject(View view, Object obj) {
    return view == obj;
  }

  // 销毁页卡
  @Override
  public void destroyItem(ViewGroup container, int position, Object object) {
    container.removeView(list.get(position));
  }

  // 生成页卡
  @Override
  public Object instantiateItem(ViewGroup container, int position) {
    View view = list.get(position);
    container.addView(view);
    return view;
  }

}

shape文件




  
  




  
  



  
  

  

    
    

    
  

  

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

你可能感兴趣的:(ViewPager+PagerAdapter实现带指示器的引导页)