Android应用程序介绍页面实现 (二)

在Android应用程序介绍页面实现 (一)中实现了介绍页面的滑动显示，但是在大多数介绍页面正下方会通过圆点标签来表示当前页面是第几个页面，每当页面滑动时，圆点标签也会随之切换。

界面布局：

<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/viewGroup"  
            android:layout_width="fill_parent"  
            android:layout_height="wrap_content"  
            android:layout_alignParentBottom="true" 
            android:layout_marginBottom="30dp"  
            android:gravity="center_horizontal"  
            android:orientation="horizontal" >  
        </LinearLayout>  
    </RelativeLayout>  

</FrameLayout>

每个滑动页面可以有自己的布局，也可以直接使用Imageview来显示一张图片，通过加载这里滑动页面的布局文件，并将这些视图添加到ViewPager中，使用ViewPager首先需要引入android-support-v4.jar这个jar包，通过ViewPager来实现页面滑动切换效果：

package com.example.viewpagerdemo;

import java.util.ArrayList;

import android.app.Activity;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.content.DialogInterface.OnClickListener;
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.KeyEvent;
import android.view.View;
import android.view.ViewGroup;
import android.view.ViewGroup.LayoutParams;
import android.widget.ImageView;

public class ShowActivity extends Activity implements OnPageChangeListener{
	/**
	 * ViewPager
	 */
	private ViewPager viewPager;
	
	/**
	 * 装点点的ImageView数组
	 */
	private ImageView[] tips;
	
	/**
	 * 装ImageView数组
	 */
	private ArrayList<View> mPagers;
	
	/**
	 * 图片资源id
	 */
	private int[] imgIdArray ;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		ViewGroup group = (ViewGroup)findViewById(R.id.viewGroup);
		viewPager = (ViewPager) findViewById(R.id.viewPager);
		
		//载入图片资源ID
		imgIdArray = new int[]{R.drawable.item01, R.drawable.item02,
/*				R.drawable.item03, R.drawable.item04,
				R.drawable.item05,R.drawable.item06, R.drawable.item07, R.drawable.item08*/
				};
		
		
		//将点点加入到ViewGroup中
		tips = new ImageView[imgIdArray.length];
		for(int i=0; i<tips.length; i++){
			ImageView imageView = new ImageView(this);
	    	imageView.setLayoutParams(new LayoutParams(10,10));
	    	tips[i] = imageView;
	    	if(i == 0){
	    		tips[i].setBackgroundResource(R.drawable.page_indicator_focused);
	    	}else{
	    		tips[i].setBackgroundResource(R.drawable.page_indicator_unfocused);
	    	}
	    	 group.addView(imageView);
		}
		
		
		//将图片装载到数组中
		mPagers = new ArrayList<View>();
		for(int i=0; i<imgIdArray.length; i++){
			ImageView imageView = new ImageView(this);
			mPagers.add(imageView);
			imageView.setBackgroundResource(imgIdArray[i]);
		}
		
		//设置Adapter
		viewPager.setAdapter(new MyAdapter());
		//设置监听，主要是设置点点的背景
		viewPager.setOnPageChangeListener(this);
		//设置ViewPager的默认项, 设置为长度的100倍，这样子开始就能往左滑动
		viewPager.setCurrentItem((mPagers.size()) * 100);
		
	}
	/**
	 * 返回按键处理
	 */
	@Override
	public void onBackPressed() {
		// TODO Auto-generated method stub
		//通过返回键向前翻页
		int index = viewPager.getCurrentItem();
		if ( index-- > 0) {
			viewPager.setCurrentItem(index);
		}else {//如果翻到第一页，则弹出退出对话框
			new AlertDialog.Builder(ShowActivity.this)
				.setTitle("确定退出")
				//.setIcon(R.drawable.ic_help)
				.setPositiveButton("确定", new OnClickListener() {
					
					@Override
					public void onClick(DialogInterface dialog, int which) {
						// TODO Auto-generated method stub
						finish();
					}
				})
				.setNegativeButton("取消", new OnClickListener() {
					
					@Override
					public void onClick(DialogInterface dialog, int which) {
						// TODO Auto-generated method stub
						dialog.dismiss();
					}
				})
				.show();				
		}
	}
	
    /**
     * 按键处理
     */
	@Override
	public boolean onKeyDown(int keyCode, KeyEvent event) {
		// TODO Auto-generated method stub
		return super.onKeyDown(keyCode, event);
	}
	
	public class MyAdapter extends PagerAdapter{

		@Override
		public int getCount() {
			return mPagers.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(mPagers.get(position % mPagers.size()));  
		}

		/**
		 * 载入图片进去，用当前的position 除以 图片数组长度取余数是关键
		 */
		@Override
		public Object instantiateItem(View container, int position) {		
			((ViewPager)container).addView(mPagers.get(position % mPagers.size()));  
			return mPagers.get(position % mPagers.size());  
		}
	}

	@Override
	public void onPageScrollStateChanged(int arg0) {
		
	}

	@Override
	public void onPageScrolled(int arg0, float arg1, int arg2) {
		
	}

	@Override
	public void onPageSelected(int arg0) {
		setImageBackground(arg0 % mPagers.size());
	}
	
	/**
	 * 设置选中的tip的背景
	 * @param selectItems
	 */
	private void setImageBackground(int selectItems){
		for(int i=0; i<tips.length; i++){
			if(i == selectItems){
				tips[i].setBackgroundResource(R.drawable.page_indicator_focused);
			}else{
				tips[i].setBackgroundResource(R.drawable.page_indicator_unfocused);
			}
		}
	}
}