OSC首发：android中的左右滑屏实现By ViewPager

 

先看效果，就是左右滑屏的效果

具体实现详解

android compatibility package, revision 3在7月份发布后，其中有个ViewPager引起了我的注意

官方的描述：

 请参考：http://developer.android.com/sdk/compatibility-library.html#Notes

ViewPager的下载与安装

首先通过SDK Manager更新最新版android compatibility package, revision 3

更新后，在eclipse中工程上点击右键，选择android tools -> add compatibility library即可完成安装

实际上就是一个jar包，手工导到工程中也可

jar包所在位置是\android-sdk\extras\android\compatibility\v4\android-support-v4.jar

至此准备环境已经ok

下边还是通过代码进行说话吧

准备布局文件

viewpager_layout.xml

1 <?xml version="1.0" encoding="utf-8"?>
2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
3     android:layout_width="fill_parent"
4     android:layout_height="fill_parent" android:orientation="vertical">
5 <!-- 此处需要给出全路径 -->
6 <android.support.v4.view.ViewPager
7     android:id="@+id/viewpagerLayout" android:layout_height="fill_parent"android:layout_width="fill_parent"/>
8 </LinearLayout>

layout1.xml

1 <?xml version="1.0" encoding="utf-8"?>
2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
3     android:layout_width="fill_parent"
4     android:layout_height="fill_parent" android:orientation="vertical">
5     <TextView android:textAppearance="?android:attr/textAppearanceLarge"android:layout_height="wrap_content" android:id="@+id/textView1"android:layout_width="fill_parent" android:text="第一页"></TextView>
6     <EditText android:layout_width="match_parent" android:layout_height="wrap_content"android:id="@+id/editText1">
7         <requestFocus></requestFocus>
8     </EditText>
9 </LinearLayout>

layout2.xml

1 <?xml version="1.0" encoding="utf-8"?>
2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
3     android:layout_width="fill_parent"
4     android:layout_height="fill_parent" android:orientation="vertical">
5     <TextView android:textAppearance="?android:attr/textAppearanceLarge"android:layout_height="wrap_content" android:id="@+id/textView1"android:layout_width="fill_parent" android:text="第二页"></TextView>
6     <EditText android:layout_width="match_parent" android:layout_height="wrap_content"android:id="@+id/editText1">
7         <requestFocus></requestFocus>
8     </EditText>
9 </LinearLayout>

layout3.xml

1 <?xml version="1.0" encoding="utf-8"?>
2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
3     android:layout_width="fill_parent"
4     android:layout_height="fill_parent" android:orientation="vertical">
5     <TextView android:textAppearance="?android:attr/textAppearanceLarge"android:layout_height="wrap_content" android:id="@+id/textView1"android:layout_width="fill_parent" android:text="第三页"></TextView>
6     <EditText android:layout_width="match_parent" android:layout_height="wrap_content"android:id="@+id/editText1">
7         <requestFocus></requestFocus>
8     </EditText>
9 </LinearLayout>

主程序

001 package a.b;
002
003 import java.util.ArrayList;
004 import java.util.List;
005
006 import android.app.Activity;
007 import android.os.Bundle;
008 import android.os.Parcelable;
009 import android.support.v4.view.PagerAdapter;
010 import android.support.v4.view.ViewPager;
011 import android.support.v4.view.ViewPager.OnPageChangeListener;
012 import android.util.Log;
013 import android.view.LayoutInflater;
014 import android.view.View;
015 import android.widget.EditText;
016
017 public class TestViewPager extends Activity {
018     private ViewPager myViewPager;
019
020     private MyPagerAdapter myAdapter;
021
022     private LayoutInflater mInflater;
023     private List<View> mListViews;
024     private View layout1 = null;
025     private View layout2 = null;
026     private View layout3 = null;
027
028     @Override
029     protected void onCreate(Bundle savedInstanceState) {
030         super.onCreate(savedInstanceState);
031         setContentView(R.layout.viewpager_layout);
032         myAdapter = new MyPagerAdapter();
033         myViewPager = (ViewPager) findViewById(R.id.viewpagerLayout);
034         myViewPager.setAdapter(myAdapter);
035
036         mListViews = new ArrayList<View>();
037         mInflater = getLayoutInflater();
038         layout1 = mInflater.inflate(R.layout.layout1, null);
039         layout2 = mInflater.inflate(R.layout.layout2, null);
040         layout3 = mInflater.inflate(R.layout.layout3, null);
041
042         mListViews.add(layout1);
043         mListViews.add(layout2);
044         mListViews.add(layout3);
045
046         //初始化当前显示的view
047         myViewPager.setCurrentItem(1);
048
049         //初始化第二个view的信息
050         EditText v2EditText = (EditText)layout2.findViewById(R.id.editText1);
051         v2EditText.setText("动态设置第二个view的值");
052
053         myViewPager.setOnPageChangeListener(new OnPageChangeListener() {
054
055             @Override
056             public void onPageSelected(int arg0) {
057                 Log.d("k", "onPageSelected - " + arg0);
058                 //activity从1到2滑动，2被加载后掉用此方法
059                 View v = mListViews.get(arg0);
060                 EditText editText = (EditText)v.findViewById(R.id.editText1);
061                 editText.setText("动态设置#"+arg0+"edittext控件的值");
062             }
063
064             @Override
065             public void onPageScrolled(int arg0, float arg1, int arg2) {
066                 Log.d("k", "onPageScrolled - " + arg0);
067                 //从1到2滑动，在1滑动前调用
068             }
069
070             @Override
071             public void onPageScrollStateChanged(int arg0) {
072                 Log.d("k", "onPageScrollStateChanged - " + arg0);
073                 //状态有三个0空闲，1是增在滑行中，2目标加载完毕