ViewPager加载欢迎界面的特效

<好像图片有点大张,由于找不到合适的制作效果的工具所以这是一张静态图片看不出效果大致效果是：如上图的效果是云想出现，上面的俩情侣后面出现并且是从左边滑进来，俩张图片在同一个界面但是确实异步显示出来的。>

     1.ViewPager的用法

ViewPager的效果类似于手机的Launcher界面效果可左右滑动来切换界面的效果，通常我们需要实现onPageChangedListener事件来监听他的滑动。

解释下onPageChangedListener中的方法用法。

public class MainActivity extends Activity implements OnPageChangeListener { 
public void onPageScrollStateChanged(int state) {

		/**
		 *state表示的是当前的状态
		 *state的取值有三种可能  分别是 0 1 2；
		 *0： 代表什么都没做
		 *1： 代表正在滑动
		 *2： 代表滑动完成
		 */
	}

	@Override
	public void onPageScrolled(int position, float positionOffset, int positionOffsetPixel) {
		
		/**
		 * 方法中参数的意思：
		 * position：当前要滑动界面的position
		 * positionoffset： 代表当前界面滑动的百分比
		 * positionOffsetPixel： 代表当前界面滑动过的像素
		 */
	}


	@Override
	public void onPageSelected(int position) {
		/**
		 * 此方法在跳到当前页面的时候才会调用,position即表示当前的位置
		 */
	}
}

2.PagerAdapter的用法

每一个ViewPager都需要一个PagerAdapter来给他滑动提供数据适配，如代码所示：

class MyAdapter extends PagerAdapter {

		@Override
		public int getCount() {
			return 2;
		}

		@Override
		public boolean isViewFromObject(View arg0, Object arg1) {
			return arg0 == arg1;
		}

		@Override
		public void destroyItem(ViewGroup container, int position, Object object) {
			((ViewPager) container).removeView((View) object);
		}

		@Override
		public Object instantiateItem(ViewGroup container, int position) {

			//用来初始化显示数据
			View view = LayoutInflater.from(_this).inflate(R.layout.pager_,
					null);
			LinearLayout layout = (LinearLayout) view
					.findViewById(R.id.gallery_image_item_view);
			if (position == 0) {
				layout.removeAllViews();
			}
			if (position == 1) {
				layout.removeAllViews();
				View childView = LayoutInflater.from(_this).inflate(
						R.layout.pager_layout, null);
				layout.addView(childView);
			}
			((ViewPager) container).addView(view);
			return view;
		}

	}

回到正题，我们的效果就是使用ViewPager和HorizontalScrollview结合使用的。

通过布局给HorizontalScrollView提供滑动所需要的背景和给ViewPager提供PagerAdapter，且ViewPager放置于HorizontalScrollView上，通过滑动Viewpager的滑动过程中

HorizontalScrollView调用scrollTo方法，这样即可达到云先到达然后才是情侣到达的异步效果。

	// 实现OnPageChangedListener的滑动方法
	public void onPageScrolled(int position, float positionOffset, int positionOffsetPixel) {
		
		/**
		 * 方法中参数的意思：
		 * position：当前要滑动界面的position
		 * positionoffset： 代表当前界面滑动的百分比
		 * positionOffsetPixel： 代表当前界面滑动过的像素
		 */
		
		 int total_page = adapter.getCount();
		 float layerRealOffset = easeIn(positionOffset, 0, 1, 1);
		 System.out.println("----layerRealOffset---" + layerRealOffset);
		 System.out.println("---positionOffset--- " + positionOffset);
                float layerOffset = (float) ((float)(position + layerRealOffset / 2)*1.0/total_page);
        	 int layerOffsetPositon = (int)(backgoundWidth*layerOffset);
         	mScrollView.scrollTo(layerOffsetPositon,0);
	}

 这个效果我是在CSDN的code里面的一个项目发现的，忘了那项目叫什么来着，所以提供个链接下载我的Demo源码。
源码请搓链接：点击打开链接