请参见最新代码:
http://blog.csdn.net/lfdfhl/article/details/50900530
http://blog.csdn.net/lfdfhl/article/details/50900497
http://blog.csdn.net/lfdfhl/article/details/50900423
mainActivity如下:
package cn.ifeng.com;
import java.util.ArrayList;
import android.app.Activity;
import android.os.Bundle;
import android.os.Parcelable;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.view.ViewGroup.LayoutParams;
import android.view.Window;
import android.widget.ImageView;
//笔记:
//利用ViewPager来实现一个应用程序的欢迎界面
//1 布局较简单.包含两个东西:ViewPager和几个小圆点的集合
//2 初始化所有用于展示的图片和所有的小圆点
//3 给ViewPager添加适配器并且对其滑动实现监听
//4 参考资料
// http://malong26.iteye.com/blog/1332730
// http://blog.csdn.net/notice520/article/details/7454568
// http://blog.csdn.net/wangkuifeng0118/article/details/7388166
public class ViewPagerTestActivity extends Activity {
private ViewPager viewPager;
//ViewPager要显示的所有View
private ArrayList<View> viewsList;
private ViewGroup contentView,dotsGroup;
//显示所有的小圆点
private ImageView [] dotImageViews;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
this.requestWindowFeature(Window.FEATURE_NO_TITLE);
//初始化所有用于展示的图片
LayoutInflater inflater=this.getLayoutInflater();
viewsList=new ArrayList<View>();
ViewPageItemView view1 = new ViewPageItemView(this,R.drawable.guide01);
viewsList.add(view1);
ViewPageItemView view2 = new ViewPageItemView(this,R.drawable.guide02);
viewsList.add(view2);
ViewPageItemView view3 = new ViewPageItemView(this,R.drawable.guide03);
viewsList.add(view3);
ViewPageItemView view4 = new ViewPageItemView(this,R.drawable.guide04);
viewsList.add(view4);
ViewPageItemView view5 = new ViewPageItemView(this,R.drawable.guide05);
viewsList.add(view5);
dotImageViews=new ImageView[viewsList.size()];
contentView=(ViewGroup) inflater.inflate(R.layout.main, null);
dotsGroup=(ViewGroup) contentView.findViewById(R.id.dotsGroup);
viewPager=(ViewPager) contentView.findViewById(R.id.viewPager);
//初始化所有的小圆点
for(int i=0;i<viewsList.size();i++){
ImageView imageView=new ImageView(ViewPagerTestActivity.this);
//LayoutParams(10, 10)设置imageView的宽和高
imageView.setLayoutParams(new LayoutParams(10, 10));
//左,上,右,下的padding
imageView.setPadding(10, 0, 10, 0);
dotImageViews[i]=imageView;
if(i==0){
// 默认进入程序后第一张图片被选中,所以第一个小圆点显示为亮白色
dotImageViews[i].setBackgroundResource(R.drawable.guide_dot_white);
}else{
dotImageViews[i].setBackgroundResource(R.drawable.guide_dot_black);
}
//将每个点都存入dotsGroup中
dotsGroup.addView(dotImageViews[i]);
}
//初始化完成View列表和dotsGroup后才 setContentView()
setContentView(contentView);
viewPager.setAdapter(new MyPagerAdapter());
viewPager.setOnPageChangeListener(new MyOnPageChangeListener());
}
//自定义适配器继承自PagerAdapter
//当滑动时每次都会摧毁前一个界面,然后新建一个界面
class MyPagerAdapter extends PagerAdapter{
@Override
public void startUpdate(View arg0) {}
@Override
public int getCount() {
return viewsList.size();
}
//初始化arg1位置的界面
@Override
public Object instantiateItem(View arg0, int arg1) {
((ViewPager)arg0).addView(viewsList.get(arg1));
return viewsList.get(arg1);
}
//摧毁arg1位置的界面
@Override
public void destroyItem(View arg0, int arg1, Object arg2) {
((ViewPager)arg0).removeView(viewsList.get(arg1));
}
//判断是否由对象生成界面
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0==arg1;
}
@Override
public void finishUpdate(View arg0) {}
@Override
public void restoreState(Parcelable arg0, ClassLoader arg1) {}
@Override
public Parcelable saveState() {return null;}
}
//监听ViewPager实现图片滑动的过程
class MyOnPageChangeListener implements OnPageChangeListener{
//arg0==1的时候表示正在滑动,arg0==2的时候表示滑动完毕了
//arg0==0的时候表示什么都没做,就是停在那
@Override
public void onPageScrollStateChanged(int arg0) {}
//表示在前一个页面滑动到后一个页面的时候,在前一个页面滑动前调用的方法
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {}
//arg0是表示当前选中的页面,此方法是在页面跳转完毕的时候调用的
@Override
public void onPageSelected(int arg0) {
//滑动时改变小圆点的显示.循环很巧妙
for(int i=0;i<dotImageViews.length;i++){
//当前已经选中的.
dotImageViews[arg0].setBackgroundResource(R.drawable.guide_dot_white);
if(arg0!=i){
//当前未选中的.
dotImageViews[i].setBackgroundResource(R.drawable.guide_dot_black);
}
}
}
}
}
ViewPageItemView如下:
package cn.ifeng.com;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.Toast;
public class ViewPageItemView extends RelativeLayout {
private Context mContext;
private ImageView mImageView;
private RelativeLayout mLayout;
private int mResoureId;
public ViewPageItemView(Context context,int resoureId) {
super(context);
mContext=context;
mResoureId=resoureId;
init();
}
private void init() {
LayoutInflater inflater = (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
mLayout = (RelativeLayout)inflater.inflate(R.layout.viewpage_item, null);
addView(mLayout);
mImageView = (ImageView)mLayout.findViewById(R.id.viewPage_item_imageView);
mImageView.setImageResource(mResoureId);
mImageView.setOnClickListener(new OnClickListener() {
public void onClick(View v) {
Toast.makeText(mContext, ""+mResoureId, Toast.LENGTH_SHORT).show();
}
});
}
}
main.xml如下:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
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/viewPager"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:id="@+id/dotsGroup"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="30dp"
android:gravity="center_horizontal">
</LinearLayout>
</RelativeLayout>
</FrameLayout>
viewPager_item.xml如下:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ImageView
android:id="@+id/viewPage_item_imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" />
</RelativeLayout>
