在Android是如何使用ViewPager

　　Android中的ViewPager有点像微信或qq等里面的滑动屏幕切换顶部的选项效果，其中附带有一条灰色的底线，且在选中的第一个选卡底部会出现一条深色的线。

　　ViewPager使用的数据源有两个形式：List<View>和List<Fragment>两种

　　下面来看一下，是如何实现它的效果的（以代码为例）

----------------------------------------------------------java代码部分---------------------------------------------------

MainActivity.java

 1 package com.cn.viewpager;
 2 
 3 import java.util.ArrayList;
 4 import java.util.List;
 5 
 6 import android.app.Activity;
 7 import android.os.Bundle;
 8 import android.support.v4.view.ViewPager;
 9 import android.view.View;
10 
11 public class MainActivity extends Activity {
12 
13     private List<View> viewList;
14     private ViewPager pager;
15     
16     @Override
17     protected void onCreate(Bundle savedInstanceState) {
18         // TODO Auto-generated method stub
19         super.onCreate(savedInstanceState);
20         setContentView(R.layout.main);
21          View view1 = View.inflate(this, R.layout.view1, null);
22             View view2 = View.inflate(this, R.layout.view2, null);
23             View view3 = View.inflate(this, R.layout.view3, null);
24             View view4 = View.inflate(this, R.layout.view4, null);
25             
26             viewList=new ArrayList<View>();
27             viewList.add(view1);
28             viewList.add(view2);
29             viewList.add(view3);
30             viewList.add(view4);
31         
32         pager=(ViewPager) findViewById(R.id.pager);
33         MyPagerAdapter adapter=new MyPagerAdapter(viewList);
34         pager.setAdapter(adapter);
35         
36     }
37 }

MyPagerAdapter.java

 1 package com.cn.viewpager;
 2 
 3 import java.util.List;
 4 
 5 import android.support.v4.view.PagerAdapter;
 6 import android.view.View;
 7 import android.view.ViewGroup;
 8 
 9 public class MyPagerAdapter extends PagerAdapter{
10 
11     private List<View>viewList;
12     private List<String>titleList;
13     
14     public MyPagerAdapter(List<View>viewList)
15     {
16         this.viewList=viewList;
17         this.titleList=titleList;
18     }
19     
20     //返回所有视图的数量
21     @Override
22     public int getCount() {
23         // TODO Auto-generated method stub
24         return viewList.size();
25     }
26   
27     //判断视图是否由对象产生
28     @Override
29     public boolean isViewFromObject(View arg0, Object arg1) {
30         // TODO Auto-generated method stub
31         return arg0==arg1;
32     }
33     
34     //实例化页面
35     @Override
36     public Object instantiateItem(ViewGroup container, int position) {
37         // TODO Auto-generated method stub
38         container.addView(viewList.get(position));
39         return viewList.get(position);
40     }
41     
42     //删除页面
43     @Override
44     public void destroyItem(ViewGroup container, int position, Object object) {
45         // TODO Auto-generated method stub
46         container.removeView(viewList.get(position));
47     }
48     
49 }

--------------------------------------------------------------------------xml文件--------------------------------------------------------------

main.xml

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:orientation="vertical" >
 6     
 7     <android.support.v4.view.ViewPager
 8         android:id="@+id/pager"
 9         android:layout_width="wrap_content"
10         android:layout_height="wrap_content"
11         android:layout_gravity="center" ></android.support.v4.view.ViewPager>
12 </LinearLayout>

view*.xml

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:orientation="vertical" >
 6     
 7     <TextView 
 8         android:text="第一个界面"
 9         android:layout_width="wrap_content"
10         android:layout_height="wrap_content"
11         />
12 
13 </LinearLayout>

AndroidManifest.xml文件中的配置与一般的android配置一样。

 

 

时间：2014年10月5日 10:49:28，天气：晴，地市：gz-gy

posted on 2014-10-05 10:52  LeeWill  阅读(92)  评论(0)    收藏  举报

导航