最近在看ViewPager，于是乎弄个引导界面来玩玩.....
引导界面，采用现在比较主流的方式：左右滑动加载；小圆点提示；在最后一个页面，点击button，进入功能界面
第一种： ViewFlipper + GestureDetector
第二种： ActivityGroup + GestureDetector
第三种： ViewPager (Android3.0+)
第四种： ViewFlow (开源项目)
这里弄的是第三种，
一、先看的效果图
二、编码前准备
ViewPager是Android3.0之后提供的新特性，所以要想让你的应用向下兼容就必须要android-support-v4.jar这个包的支持，这是一个来自google提供的一个附加包。
项目结构图:
1、布局界面,加入ViewPager组件，以及底部的引导小点，guide_layout.xml:
[html]view plaincopy <RelativeLayoutxmlns:android="/apk/res/android"xmlns:tools="/tools"android:layout_width="wrap_content"android:layout_height="wrap_content"><android.support.v4.view.ViewPagerandroid:id="@+id/viewpager"android:layout_width="fill_parent"android:layout_height="fill_parent"/><LinearLayoutandroid:id="@+id/point"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignParentBottom="true"android:layout_centerHorizontal="true"android:layout_marginBottom="24.0dip"android:orientation="horizontal"><ImageViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_vertical"android:clickable="true"android:padding="15.0dip"android:src="@drawable/point"/><ImageViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_vertical"android:clickable="true"android:padding="15.0dip"android:src="@drawable/point"/><ImageViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_vertical"android:clickable="true"android:padding="15.0dip"android:src="@drawable/point"/><ImageViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_vertical"android:clickable="true"android:padding="15.0dip"android:src="@drawable/point"/></LinearLayout></RelativeLayout> guide_page1.xml 注guide_page2.xml，guide_page3.xml布局一样
[html]view plaincopy <?xmlversion="1.0"encoding="utf-8"?><LinearLayoutxmlns:android="/apk/res/android"android:id="@+id/guide1"android:layout_width="match_parent"android:layout_height="match_parent"android:background="@drawable/view_guide1"android:orientation="vertical"></LinearLayout> guide_page4.xml[html]view plaincopy <?xmlversion="1.0"encoding="utf-8"?><RelativeLayoutxmlns:android="/apk/res/android"android:id="@+id/guide4"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"android:background="@drawable/view_guide4"><LinearLayoutandroid:id="@+id/layout1"android:layout_width="match_parent"android:layout_height="100dp"android:layout_alignParentBottom="true"android:orientation="vertical"android:gravity="center_vertical"><Buttonandroid:id="@+id/ok"android:layout_width="fill_parent"android:layout_height="wrap_content"android:layout_marginLeft="5dp"android:layout_marginRight="5dp"android:layout_marginTop="5dp"android:gravity="center"android:layout_gravity="center_vertical|center_horizontal"android:text="马上体验"android:background="@drawable/start_btn"/></LinearLayout></RelativeLayout>
point.xml：控制小点的图片，用一个selector来控制颜色[html]view plaincopy <?xmlversion="1.0"encoding="UTF-8"?><selectorxmlns:android="/apk/res/android"><itemandroid:state_enabled="true"android:drawable="@drawable/point_normal"/><itemandroid:state_enabled="false"android:drawable="@drawable/point_select"/></selector>
三、主程序入口类，MainActivity.java：[html]view plaincopy publicclassMainActivityextendsActivityimplementsOnClickListener,OnPageChangeListener{//定义ViewPager对象privateViewPagerviewPager;//定义ViewPager适配器privateViewPagerAdaptervpAdapter;//定义一个ArrayList来存放ViewprivateArrayList<View>views;//定义各个界面View对象privateViewview1,view2,view3,view4;//底部小点的图片privateImageView[]points;//记录当前选中位置privateintcurrentIndex;@OverrideprotectedvoidonCreate(BundlesavedInstanceState){super.onCreate(savedInstanceState);setContentView(R.layout.guide_layout);initView();initData();}/***初始化组件*/privatevoidinitView(){//实例化各个界面的布局对象LayoutInflatermLi=LayoutInflater.from(this);view1=mLi.inflate(R.layout.guide_page1,null);view2=mLi.inflate(R.layout.guide_page2,null);view3=mLi.inflate(R.layout.guide_page3,null);view4=mLi.inflate(R.layout.guide_page4,null);//实例化ViewPagerviewPager=(ViewPager)findViewById(R.id.viewpager);//实例化ArrayList对象views=newArrayList<View>();//实例化ViewPager适配器vpAdapter=newViewPagerAdapter(views);//实例化开始按钮//startBt=(Button)view4.findViewById(R.id.startBtn);}/***初始化数据*/privatevoidinitData(){//设置监听viewPager.setOnPageChangeListener(this);//设置适配器数据viewPager.setAdapter(vpAdapter);//将要分页显示的View装入数组中views.add(view1);views.add(view2);views.add(view3);views.add(view4);//初始化底部小点initPoint(views.size());}/***初始化底部小点*/privatevoidinitPoint(intviews){LinearLayoutlinearLayout=(LinearLayout)findViewById(R.id.point);points=newImageView[views];//循环取得小点图片for(inti=0;i<views;i++){//得到一个LinearLayout下面的每一个子元素points[i]=(ImageView)linearLayout.getChildAt(i);//默认都设为灰色points[i].setEnabled(true);//给每个小点设置监听points[i].setOnClickListener(this);//设置位置tag，方便取出与当前位置对应points[i].setTag(i);}//设置当面默认的位置currentIndex=0;//设置为白色，即选中状态points[currentIndex].setEnabled(false);}/***当滑动状态改变时调用*/@OverridepublicvoidonPageScrollStateChanged(intarg0){}/***当当前页面被滑动时调用*/@OverridepublicvoidonPageScrolled(intarg0,floatarg1,intarg2){}/***当新的页面被选中时调用*/@OverridepublicvoidonPageSelected(intposition){//设置底部小点选中状态setCurDot(position);}/***通过点击事件来切换当前的页面*/@OverridepublicvoidonClick(Viewv){intposition=(Integer)v.getTag();setCurView(position);setCurDot(position);}/***设置当前页面的位置*/privatevoidsetCurView(intposition){if(position<0||position>=4){return;}viewPager.setCurrentItem(position);}/***设置当前的小点的位置*/privatevoidsetCurDot(intpositon){if(positon<0||positon>3||currentIndex==positon){return;}points[positon].setEnabled(false);points[currentIndex].setEnabled(true);currentIndex=positon;}
ViewPager适配器代码，ViewPagerAdapter.java：[java]view plaincopy publicclassViewPagerAdapterextendsPagerAdapter{//界面列表privateArrayList<View>views;publicViewPagerAdapter(ArrayList<View>views){this.views=views;}/***获得当前界面数*/@OverridepublicintgetCount(){if(views!=null){returnviews.size();}return0;}/***初始化position位置的界面*/@OverridepublicObjectinstantiateItem(Viewview,intposition){((ViewPager)view).addView(views.get(position),0);returnviews.get(position);}/***判断是否由对象生成界面*/@OverridepublicbooleanisViewFromObject(Viewview,Objectarg1){return(view==arg1);}/***销毁position位置的界面*/@OverridepublicvoiddestroyItem(Viewview,intposition,Objectarg2){((ViewPager)view).removeView(views.get(position));}
