Android ViewPager实现应用启动界面

         Android应用启动界面可以使用Google提供的ViewPager来实现。ViewPager的使用可以对比ListView的使用，即设计UI、构造数据源、创建适配器，设置适配器。启动页面上显示的一般是版本、宣传等信息，因此不需要构造数据源，只需创建适配器，设置适配器。详细内容如下：

1、UI设计

        启动页面的设计分为两部分，一部分是宿主页面即ViewPager所在页面，另一部分是滑动页面，首先设计ViewPager的宿主页面activity_main.xml，代码如下：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    tools:context=".MainActivity" >

    <android.support.v4.view.ViewPager
        android:id="@+id/vpage"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_above="@+id/ll_dot"/>

    <LinearLayout 
        android:id="@+id/ll_dot"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="40dp"
        android:gravity="center_horizontal"
        android:orientation="horizontal">
        
        <ImageView 
            android:id="@+id/iv_01"
            android:layout_width="14dp"
            android:layout_height="14dp"
            android:src="@drawable/blue"/>
        <ImageView 
            android:id="@+id/iv_02"
            android:layout_width="14dp"
            android:layout_height="14dp"
            android:layout_marginLeft="10dp"
            android:src="@drawable/gray"/>
        <ImageView 
            android:id="@+id/iv_03"
            android:layout_width="14dp"
            android:layout_height="14dp"
            android:layout_marginLeft="10dp"
            android:src="@drawable/gray"/>
        
    </LinearLayout>
    
</RelativeLayout>

        该页面为上下布局，上面是一个ViewPager，下面是滑动对应的小圆点，ViewPager中滑动的页面不会太多，可以直接写在xml布局文件中。滑动页面就是一张图片的展示，分为item1.xml、item2.xml、item3.xml，三个页面布局一样，item1.xml的代码如下：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    
	<LinearLayout 
	    android:layout_width="fill_parent"
	    android:layout_height="fill_parent"
	    android:layout_marginLeft="6dp"
	    android:layout_marginRight="6dp"
	    android:layout_marginTop="50dp"
	    android:layout_marginBottom="50dp">
	    
	    <ImageView 
	        android:layout_width="wrap_content"
	        android:layout_height="wrap_content"
	        android:src="@drawable/img1"/>
	</LinearLayout>
</LinearLayout>

2、创建适配器

        新建ViewPagerAdapter类继承PagerAdapter，重写destoryItem和instantiateItem，适配器需要传入刚才创建的滑动页面，在此创建了一个viewList私用变量用来保存滑动页面。ViewPagerAdapter.java代码如下：

package com.example.myloadview;

import java.util.ArrayList;

import android.os.Parcelable;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.View;

public class ViewPagerAdapter extends PagerAdapter {

	private ArrayList<View> viewList;
	
	public ViewPagerAdapter(ArrayList<View> _viewList) {
		this.viewList=_viewList;
	}
	
	@Override
	public int getCount() {
		return viewList.size();
	}

	@Override
	public boolean isViewFromObject(View arg0, Object arg1) {
		return arg0==arg1;
	}
	
	@Override
	public void destroyItem(View container, int position, Object object) {
		((ViewPager) container).removeView(viewList.get(position));
	}
	
	@Override
	public Object instantiateItem(View container, int position) {
		((ViewPager) container).addView(viewList.get(position));
		return viewList.get(position);
	}
	
}

3、设置适配器

       适配器在MainActivity.java中设置。MainActivity.java中要做的是创建滑动视图列表，创建小圆点列表，实例化ViewPager，给ViewPager设置适配器。页面滑动切换时对应的小圆点也需要切换，在此需要给ViewPager注册事件。详细代码如下：

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		// 设置无标题窗口
        requestWindowFeature(Window.FEATURE_NO_TITLE);
		setContentView(R.layout.activity_main);
		
		LayoutInflater inflater=getLayoutInflater();
		views=new ArrayList<View>();
		views.add(inflater.inflate(R.layout.item1, null));
		views.add(inflater.inflate(R.layout.item2, null));
		views.add(inflater.inflate(R.layout.item3, null));
		
		images=new ArrayList<ImageView>();
		images.add((ImageView)findViewById(R.id.iv_01));
		images.add((ImageView)findViewById(R.id.iv_02));
		images.add((ImageView)findViewById(R.id.iv_03));
		
		viewPager=(ViewPager)findViewById(R.id.vpage);
		viewPager.setAdapter(new ViewPagerAdapter(views));
		viewPager.setOnPageChangeListener(new ViewPagerChangeListener());
	}

ViewPagerChangeListener继承OnPageChangeListener在onPageSelected做小圆点图片的切换，详细代码如下：

class ViewPagerChangeListener implements OnPageChangeListener{

		@Override
		public void onPageScrollStateChanged(int arg0) {
			// TODO Auto-generated method stub
			
		}

		@Override
		public void onPageScrolled(int arg0, float arg1, int arg2) {
			// TODO Auto-generated method stub
			
		}

		@Override
		public void onPageSelected(int arg0) {
			for (int i = 0; i < images.size(); i++) {
				images.get(i).setImageResource(R.drawable.gray);
				if (arg0==i) {
					images.get(i).setImageResource(R.drawable.blue);
				}
			}
		}
		
	}

到此一个简单的android应用启动界面就实现了，最终效果如图：

Demo源码链接