ViewPager主要是实现图片的滚动播放,下面对该组件的基本函数进行阐述和实现新手引导页的代码实例
首先xml文件:
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="200dp"
android:id="@+id/viewpager">
</android.support.v4.view.ViewPager>
viewpager和listview类似,同样需要自己的适配器,在适配器中需要继承PagerAdapter类,并实现其中的四个基本方法
/**
* 返回多少page
*/
@Override
public int getCount() {
return Integer.MAX_VALUE;//尽可能的大,实现伪循环,返回的页数
}
/**
* 返回true:表示不创建,使用缓存。false:重新创建
* view:当前滑动的view
* object:将要进入的新创建view,由instantitateitem方法创建
*/
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0==arg1;
}
/**
* 销毁page
* position:当前需要销毁的第几个page
* object:当前需要销毁的page
*/
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View)object);
}
/**
* 类似BaseAdapter的getView方法,用来将数据设置给View
* 由于最多只能存在三个界面,所以不需要holderview
*/
@Override
public Object instantiateItem(ViewGroup container, int position) {
//将adapter填充到view当中
View view = View.inflate(MainActivity.this, R.layout.adapter, null);
//找到布局当中的控件,注意强转的时候添加view。
ImageView imageView = (ImageView)view.findViewById(R.id.iv);
//将获得的list集合元素填充到对象
adbean ad = list.get(position%list.size());
//从获得的对象中将数据填充到控件当中
imageView.setImageResource(ad.getIconResId());
//将view加入到viewpager中
container.addView(view);
//System.out.println("position"+position);
return view;
}
下面新手引导页实现原理,通过sharepreferences来存储是否访问,难点是通过页面滑动的百分比来计算小圆点的滑动位置。viewpager可以调用setOnPageChangeListener(new GuidePageListener());方法来获取页面的滑动百分比,其中new对象是继承OnPageChangeListener。
//viewpager的滑动监听
class GuidePageListener implements OnPageChangeListener{
//滑动状态变化
@Override
public void onPageScrollStateChanged(int arg0) {
}
//滑动事件
@Override
//参数1:当前位置,参数2:移动百分比,参数3:移动距离
public void onPageScrolled(int arg0, float arg1, int arg2) {
int len = (int)(mPointWidth * arg1) + arg0 * mPointWidth;
RelativeLayout.LayoutParams Params = (RelativeLayout.LayoutParams)viewRedPoint
.getLayoutParams();//获取红点的布局参数
Params.leftMargin = len;//设置左边距
viewRedPoint.setLayoutParams(Params);//重新给小红点布局参数
}
//页面选中
@Override
public void onPageSelected(int arg0) {
//如果是最后一个界面显示按钮
if(arg0 == mImageIds.length-1){
btStart.setVisibility(View.VISIBLE);
}else{
btStart.setVisibility(View.INVISIBLE);
}
}
}
完整代码实例
import java.util.ArrayList;
import com.lzz.zhihuibeijing.utils.PrefUtils;
import android.app.Activity;
import android.content.Intent;
import android.content.SharedPreferences;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.view.ViewTreeObserver.OnGlobalLayoutListener;
import android.view.Window;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;
public class GuideActivity extends Activity {
private static final int[] mImageIds = new int[]{R.drawable.guide_1,
R.drawable.guide_2,R.drawable.guide_3};
private ViewPager vpGuide;
private LinearLayout llpointgroup;//引导圆点的父控件
private ArrayList<ImageView> mImageViewList;
private int mPointWidth;
private View viewRedPoint;
private Button btStart;
@Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);//去掉标题
setContentView(R.layout.activity_guide);
vpGuide = (ViewPager) findViewById(R.id.vp_guide);
llpointgroup = (LinearLayout) findViewById(R.id.ll_point_group);
viewRedPoint = findViewById(R.id.view_red_point);
btStart = (Button) findViewById(R.id.bt_start);
btStart.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
//更新sp,表示已经展示过新手引导
PrefUtils.setBoolean(GuideActivity.this, "is_user_guide_showed", true);
startActivity(new Intent(GuideActivity.this,MainActivity.class));
finish();
}
});
initViews();
vpGuide.setAdapter(new GuideAdapter());
vpGuide.setOnPageChangeListener(new GuidePageListener());
}
/**
* 初始化界面
*/
private void initViews(){
mImageViewList = new ArrayList<ImageView>();
//初始化三個界面
for (int i = 0; i < mImageIds.length; i++) {
ImageView imageView = new ImageView(this);
imageView.setBackgroundResource(mImageIds[i]);
mImageViewList.add(imageView);
}
//初始化引导页的小圆点
for (int i = 0; i < mImageIds.length; i++) {
View point = new View(this);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(20,20);
point.setBackgroundResource(R.drawable.shape_point_gray);//设置默认圆点
if(i > 0){
params.leftMargin = 10;//设置圆点间隔
}
point.setLayoutParams( params);//设置圆点大小
llpointgroup.addView(point);//将小圆点设置到线性布局当中
}
//获取视图树,执行回调方法,对layout结束时间进行监听
llpointgroup.getViewTreeObserver().addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
@Override
public void onGlobalLayout() {
//关闭监听事件
llpointgroup.getViewTreeObserver().removeGlobalOnLayoutListener(this);
mPointWidth = llpointgroup.getChildAt(1).getLeft()
- llpointgroup.getChildAt(0).getLeft();
}
});
}
/**
* viewpager的适配
* @author lizezheng
*
*/
class GuideAdapter extends PagerAdapter{
@Override
public int getCount() {
// TODO Auto-generated method stub
return mImageIds.length;
}
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0==arg1;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
container.addView(mImageViewList.get(position));
return mImageViewList.get(position);
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View)object);
}
}
//viewpager的滑动监听
class GuidePageListener implements OnPageChangeListener{
//滑动状态变化
@Override
public void onPageScrollStateChanged(int arg0) {
}
//滑动事件
@Override
//参数1:当前位置,参数2:移动百分比,参数3:移动距离
public void onPageScrolled(int arg0, float arg1, int arg2) {
int len = (int)(mPointWidth * arg1) + arg0 * mPointWidth;
RelativeLayout.LayoutParams Params = (RelativeLayout.LayoutParams)viewRedPoint
.getLayoutParams();//获取红点的布局参数
Params.leftMargin = len;//设置左边距
viewRedPoint.setLayoutParams(Params);//重新给小红点布局参数
}
//页面选中
@Override
public void onPageSelected(int arg0) {
//如果是最后一个界面显示按钮
if(arg0 == mImageIds.length-1){
btStart.setVisibility(View.VISIBLE);
}else{
btStart.setVisibility(View.INVISIBLE);
}
}
}
}