Android 中的通過 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
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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/viewpagerLayout" android:layout_height="fill_parent" android:layout_width="fill_parent"/>
</LinearLayout>layout1.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" android:orientation="vertical">
<TextView android:textAppearance="?android:attr/textAppearanceLarge" android:layout_height="wrap_content" android:id="@+id/textView1" android:layout_width="fill_parent" android:text="第一頁"></TextView>
<EditText android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/editText1">
<requestFocus></requestFocus>
</EditText>
</LinearLayout>layout2.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" android:orientation="vertical">
<TextView android:textAppearance="?android:attr/textAppearanceLarge" android:layout_height="wrap_content" android:id="@+id/textView1" android:layout_width="fill_parent" android:text="第二頁"></TextView>
<EditText android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/editText1">
<requestFocus></requestFocus>
</EditText>
</LinearLayout>layout3.xml <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" android:orientation="vertical">
<TextView android:textAppearance="?android:attr/textAppearanceLarge" android:layout_height="wrap_content" android:id="@+id/textView1" android:layout_width="fill_parent" android:text="第三頁"></TextView>
<EditText android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/editText1">
<requestFocus></requestFocus>
</EditText>
</LinearLayout>主程序 package a.b;
import java.util.ArrayList;
import java.util.List;
import android.app.Activity;
import android.os.Bundle;
import android.os.Parcelable;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.EditText;
public class TestViewPager extends Activity {
private ViewPager myViewPager;
private MyPagerAdapter myAdapter;
private LayoutInflater mInflater;
private List<View> mListViews;
private View layout1 = null;
private View layout2 = null;
private View layout3 = null;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.viewpager_layout);
myAdapter = new MyPagerAdapter();
myViewPager = (ViewPager) findViewById(R.id.viewpagerLayout);
myViewPager.setAdapter(myAdapter);
mListViews = new ArrayList<View>();
mInflater = getLayoutInflater();
layout1 = mInflater.inflate(R.layout.layout1, null);
layout2 = mInflater.inflate(R.layout.layout2, null);
layout3 = mInflater.inflate(R.layout.layout3, null);
mListViews.add(layout1);
mListViews.add(layout2);
mListViews.add(layout3);
//初始化當前顯示的view
myViewPager.setCurrentItem(1);
//初始化第二個view的信息
EditText v2EditText = (EditText)layout2.findViewById(R.id.editText1);
v2EditText.setText("動態設置第二個view的值");
myViewPager.setOnPageChangeListener(new OnPageChangeListener() {
@Override
public void onPageSelected(int arg0) {
Log.d("k", "onPageSelected - " + arg0);
//activity從1到2滑動,2被加載后掉用此方法
View v = mListViews.get(arg0);
EditText editText = (EditText)v.findViewById(R.id.editText1);
editText.setText("動態設置#"+arg0+"edittext控件的值");
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
Log.d("k", "onPageScrolled - " + arg0);
//從1到2滑動,在1滑動前調用
}
@Override
public void onPageScrollStateChanged(int arg0) {
Log.d("k", "onPageScrollStateChanged - " + arg0);
//狀態有三個0空閑,1是增在滑行中,2目標加載完畢
/**
* Indicates that the pager is in an idle, settled state. The current page
* is fully in view and no animation is in progress.
*/
//public static final int SCROLL_STATE_IDLE = 0;
/**
* Indicates that the pager is currently being dragged by the user.
*/
//public static final int SCROLL_STATE_DRAGGING = 1;
/**
* Indicates that the pager is in the process of settling to a final position.
*/
//public static final int SCROLL_STATE_SETTLING = 2;
}
});
}
private class MyPagerAdapter extends PagerAdapter{
@Override
public void destroyItem(View arg0, int arg1, Object arg2) {
Log.d("k", "destroyItem");
((ViewPager) arg0).removeView(mListViews.get(arg1));
}
@Override
public void finishUpdate(View arg0) {
Log.d("k", "finishUpdate");
}
@Override
public int getCount() {
Log.d("k", "getCount");
return mListViews.size();
}
@Override
public Object instantiateItem(View arg0, int arg1) {
Log.d("k", "instantiateItem");
((ViewPager) arg0).addView(mListViews.get(arg1),0);
return mListViews.get(arg1);
}
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
Log.d("k", "isViewFromObject");
return arg0==(arg1);
}
@Override
public void restoreState(Parcelable arg0, ClassLoader arg1) {
Log.d("k", "restoreState");
}
@Override
public Parcelable saveState() {
Log.d("k", "saveState");
return null;
}
@Override
public void startUpdate(View arg0) {
Log.d("k", "startUpdate");
}
}
}在實機上測試后,非常流暢,這也就是說官方版的左右滑屏控件已經實現 目前,關于viewpager的文章非常少,本文是通過閱讀viewpager源代碼分析出的寫法
當然此文章僅是拋磚引玉,而且屬于框架式程序,目的就是讓讀者了解API的基本用法
希望這篇原創文章對大家有幫助
歡迎感興趣的朋友一起討論
共同學習,共同進步
另外,ViewPager的注釋上有這么一段話,大體意思是該控件目前屬于早期實現,后續會有修改
/**
* Layout manager that allows the user to flip left and right
* through pages of data. You supply an implementation of a
* {@link PagerAdapter} to generate the pages that the view shows.
*
* <p>Note this class is currently under early design and
* development. The API will likely change in later updates of
* the compatibility library, requiring changes to the source code
* of apps when they are compiled against the newer version.</p>
*/ 本文由用戶 fmms 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!