首先让大家有个全局的认识,直接上个项目,看看仅仅通过这几行代码,竟然就能完成如此强悍的功能。下篇再结合API仔细讲讲为什么要这么写。
效果图:
实现了三个view间的相互滑动
第一个VIEW向第二个VIEW滑动 第二个VIEW向第三个VIEW滑动
ViewPager。它是google SDk中自带的一个附加包的一个类,可以用来实现屏幕间的切换。
[html] view plain copy <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" tools:context="com.example.testviewpage_1.MainActivity" > <android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" /> </RelativeLayout>
其中 <Android.support.v4.view.ViewPager /> 是ViewPager对应的组件,要将其放到想要滑动的位置
从效果图中也可以看到,我们的三个视图都非常简单,里面没有任何的控件,大家当然可以往里添加各种控件,但这里是个DEMO,只详解原理即可,所以我这里仅仅用背景来区别不用layout布局。
布局代码分别如下:
layout1.xml
[html] view plain copy <?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:background="#ffffff" android:orientation="vertical" > </LinearLayout> layout2.xml
[html] view plain copy <?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:background="#ffff00" android:orientation="vertical" > </LinearLayout> layout3.xml [html] view plain copy <?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:background="#ff00ff" android:orientation="vertical" > </LinearLayout><span style="color:#660000;"> </span>
[java] view plain copy private View view1, view2, view3; private List<View> viewList;//view数组 private ViewPager viewPager; //对应的viewPager
首先viewPager对应 <android.support.v4.view.ViewPager/>控件。
view1,view2 ,view3对应我们的三个layout,即layout1.xml,layout2.xml,layout3.xmlviewList是一个View数组,盛装上面的三个VIEW
[java] view plain copy viewPager = (ViewPager) findViewById(R.id.viewpager); LayoutInflater inflater=getLayoutInflater(); view1 = inflater.inflate(R.layout.layout1, null); view2 = inflater.inflate(R.layout.layout2,null); view3 = inflater.inflate(R.layout.layout3, null); viewList = new ArrayList<View>();// 将要分页显示的View装入数组中 viewList.add(view1); viewList.add(view2); viewList.add(view3); 初始化过程难度不大,就是将资源与变量联系起来布局,最后将实例化的view1,view2,view3添加到viewList中
适配器这个东东想必大家都不莫生,在ListView中也有适配器,listView通过重写GetView()函数来获取当前要加载的Item。而PageAdapter不太相同,毕竟PageAdapter是单个VIew的合集。
PageAdapter 必须重写的四个函数:
boolean isViewFromObject(View arg0, Object arg1)int getCount() void destroyItem(ViewGroup container, int position,Object object)Object instantiateItem(ViewGroup container, int position)
先看看各个函数,我们上面都做了什么吧:
[java] view plain copy @Override public int getCount() { // TODO Auto-generated method stub return viewList.size(); } getCount():返回要滑动的VIew的个数
[java] view plain copy @Override public void destroyItem(ViewGroup container, int position, Object object) { // TODO Auto-generated method stub container.removeView(viewList.get(position)); } destroyItem():从当前container中删除指定位置(position)的View; [java] view plain copy @Override public Object instantiateItem(ViewGroup container, int position) { // TODO Auto-generated method stub container.addView(viewList.get(position)); return viewList.get(position); } }; instantiateItem():做了两件事,第一:将当前视图添加到container中,第二:返回当前View [java] view plain copy @Override public boolean isViewFromObject(View arg0, Object arg1) { // TODO Auto-generated method stub return arg0 == arg1; }
isViewFromObject():对于这个函数就先不做讲解,大家目前先知道它要这样重写就行了,后面我们会对它进行改写。
class GuidePageListener implements OnPageChangeListener{ @Override // view状态的改变 public void onPageScrollStateChanged(int arg0) { // TODO Auto-generated method stub } // view滚动时调用 @Override public void onPageScrolled(int arg0, float arg1, int arg2) { // TODO Auto-generated method stub } @Override // view被选中调用 public void onPageSelected(int arg0) { // TODO Auto-generated method stub } }