舉例講解Android中ViewPager中的PagerTitleStrip子控件
先看個(gè)簡(jiǎn)單的,先上個(gè)效果圖,吸引大家一下眼球。
三個(gè)頁(yè)面間的滑動(dòng),此時(shí)是帶著上面的標(biāo)題一塊滑動(dòng)的。
看一下android 對(duì)于PagerTitleStrip的官方解釋:
PagerTitleStrip是ViewPager的一個(gè)關(guān)于當(dāng)前頁(yè)面、上一個(gè)頁(yè)面和下一個(gè)頁(yè)面的一個(gè)非交互的指示器。它經(jīng)常作為ViewPager控件的一個(gè)子控件被被添加在XML布局文件中。在你的布局文件中,將它作為子控件添加在ViewPager中。而且要將它的 android:layout_gravity 屬性設(shè)置為T(mén)OP或BOTTOM來(lái)將它顯示在ViewPager的頂部或底部。每個(gè)頁(yè)面的標(biāo)題是通過(guò)適配器的getPageTitle(int)函數(shù)提供給ViewPager的。
著重講兩點(diǎn):
1、首先,文中提到:在你的布局文件中,將它作為子控件添加在ViewPager中。
2、第二,標(biāo)題的獲取,是重寫(xiě)適配器的getPageTitle(int)函數(shù)來(lái)獲取的。
根據(jù)這兩點(diǎn),我們就可以看代碼了:
1、XML布局文件:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.example.testviewpage_2.MainActivity" > <android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="wrap_content" android:layout_height="200dip" android:layout_gravity="center"> <android.support.v4.view.PagerTitleStrip android:id="@+id/pagertitle" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="top" /> </android.support.v4.view.ViewPager> </RelativeLayout>
清楚的看到我們將.PagerTitleStrip將其作為ViewPager的子控件直接嵌入其中;這是第一步;當(dāng)然android:layout_gravity=""的值要設(shè)置為top或bottom。將標(biāo)題欄顯示在頂部或底部。
2、重寫(xiě)適配器的getPageTitle()函數(shù)
便于大家有個(gè)整體認(rèn)識(shí),先貼全局代碼,然后再逐個(gè)講:
package com.example.testviewpage_2; import java.util.ArrayList; import java.util.List; import android.app.Activity; import android.os.Bundle; import android.support.v4.view.PagerAdapter; import android.support.v4.view.PagerTitleStrip; import android.support.v4.view.ViewPager; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; public class MainActivity extends Activity { private View view1, view2, view3; private List<View> viewList;// view數(shù)組 private ViewPager viewPager; // 對(duì)應(yīng)的viewPager private List<String> titleList; //標(biāo)題列表數(shù)組 @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); 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>();// 將要分頁(yè)顯示的View裝入數(shù)組中 viewList.add(view1); viewList.add(view2); viewList.add(view3); titleList = new ArrayList<String>();// 每個(gè)頁(yè)面的Title數(shù)據(jù) titleList.add("王鵬"); titleList.add("姜語(yǔ)"); titleList.add("結(jié)婚"); PagerAdapter pagerAdapter = new PagerAdapter() { @Override public boolean isViewFromObject(View arg0, Object arg1) { // TODO Auto-generated method stub //根據(jù)傳來(lái)的key,找到view,判斷與傳來(lái)的參數(shù)View arg0是不是同一個(gè)視圖 return arg0 == viewList.get((int)Integer.parseInt(arg1.toString())); } @Override public int getCount() { // TODO Auto-generated method stub return viewList.size(); } @Override public void destroyItem(ViewGroup container, int position, Object object) { // TODO Auto-generated method stub container.removeView(viewList.get(position)); } @Override public Object instantiateItem(ViewGroup container, int position) { // TODO Auto-generated method stub container.addView(viewList.get(position)); //把當(dāng)前新增視圖的位置(position)作為Key傳過(guò)去 return position; } @Override public CharSequence getPageTitle(int position) { // TODO Auto-generated method stub return titleList.get(position); } }; viewPager.setAdapter(pagerAdapter); } }
3、變量
private List<String> titleList; //標(biāo)題列表數(shù)組
申請(qǐng)了一個(gè)String數(shù)組,用來(lái)存儲(chǔ)三個(gè)頁(yè)面所對(duì)應(yīng)的標(biāo)題的
4、初始化
titleList = new ArrayList<String>();// 每個(gè)頁(yè)面的Title數(shù)據(jù) titleList.add("王鵬"); titleList.add("姜語(yǔ)"); titleList.add("結(jié)婚");
在初始化階段增加了這么一段初始化數(shù)組的代碼。
5、重寫(xiě)CharSequence getPageTitle(int )函數(shù)
@Override public CharSequence getPageTitle(int position) { // TODO Auto-generated method stub return titleList.get(position); }
根據(jù)位置返回當(dāng)前所對(duì)應(yīng)的標(biāo)題。
大家可以看到,其實(shí)這里僅僅只重寫(xiě)了getPageTitle()函數(shù),將其根據(jù)不同的位置返回不同的字符串就可以實(shí)現(xiàn)上面的標(biāo)題欄功能。第一和第二步有關(guān)數(shù)組和初始化,其實(shí)都是這了這一步,其實(shí)我們完全可以用下面這個(gè)代碼來(lái)取代它們:
@Override public CharSequence getPageTitle(int position) { // TODO Auto-generated method stub switch (position) { case 0: return "王鵬"; case 1: return "姜語(yǔ)"; case 2: return "結(jié)婚"; default: return ""; } }
這樣效果是一樣一樣的,只是代碼不好維護(hù)而已。
設(shè)置標(biāo)題
將Page的Title分離出來(lái)的一個(gè)自定義View,這樣可以靈活的設(shè)置title的樣式、文本。
效果:
xml使用:
<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/pager" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.v4.view.PagerTitleStrip android:id="@+id/pager_title_strip" android:layout_width="match_parent" android:layout_height="30dp" android:layout_gravity="bottom" android:paddingTop="4dp" android:paddingBottom="4dp" /> </android.support.v4.view.ViewPager>
android:layout_gravity 控制標(biāo)題的位置 一般取值為 bottom或top
看到開(kāi)源項(xiàng)目ImageLoader中使用了這個(gè),找了半天沒(méi)看到哪里findbyid的,
原來(lái)在它的源碼里就把它想成是ViewPager的子控件了。
部份源碼:
@Override protected void onAttachedToWindow() { super.onAttachedToWindow(); final ViewParent parent = getParent(); if (!(parent instanceof ViewPager)) { throw new IllegalStateException( "PagerTitleStrip must be a direct child of a ViewPager."); } final ViewPager pager = (ViewPager) parent; final PagerAdapter adapter = pager.getAdapter(); pager.setInternalPageChangeListener(mPageListener); pager.setOnAdapterChangeListener(mPageListener); mPager = pager; updateAdapter(mWatchingAdapter != null ? mWatchingAdapter.get() : null, adapter); }
分析:在onAttachedToWindow()時(shí),直接找出parent-view,如果是ViewPager才能使用,否則直接拋出異常。
設(shè)置title值:
PagerAdapter 里有一個(gè)getPageTitle(),需要重寫(xiě)它,然后可以根據(jù)不同的page返回不同的title。
@Override public CharSequence getPageTitle(int position) { switch (position) { case 0: return getString(R.string.title_list); case 1: return getString(R.string.title_grid); default: return null; } }
而在PageTitleStrip的updateText()源碼里,調(diào)用了viewPager的adapter.getPageTitle,拿到title并設(shè)置。
- 詳解Android中ViewPager的PagerTabStrip子控件的用法
- Android ScrollView只能添加一個(gè)子控件問(wèn)題解決方法
- Android控件之ToggleButton的使用方法
- android 自定義控件 自定義屬性詳細(xì)介紹
- Android控件系列之EditText使用方法
- android控件封裝 自己封裝的dialog控件
- android中webview控件和javascript交互實(shí)例
- Android控件系列之ImageView使用方法
- android自定義倒計(jì)時(shí)控件示例
- Android 控件(button)對(duì)齊方法實(shí)現(xiàn)詳解
- 如何讓安卓(Android)子控件超出父控件的范圍顯示
相關(guān)文章
Android實(shí)現(xiàn)BannerLayout圖文輪播功能
這篇文章主要為大家詳細(xì)介紹了Android實(shí)現(xiàn)BannerLayout圖文輪播功能,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-05-05Android控件ViewPager實(shí)現(xiàn)帶有動(dòng)畫(huà)的引導(dǎo)頁(yè)
這篇文章主要為大家詳細(xì)介紹了Android控件ViewPager實(shí)現(xiàn)帶有動(dòng)畫(huà)的引導(dǎo)頁(yè),文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-05-05android編程之menu按鍵功能實(shí)現(xiàn)方法
這篇文章主要介紹了android編程之menu按鍵功能實(shí)現(xiàn)方法,實(shí)例分析了Android實(shí)現(xiàn)menu的相關(guān)技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-04-04Android和PC端通過(guò)局域網(wǎng)文件同步
這篇文章主要為大家詳細(xì)介紹了Android和PC端通過(guò)局域網(wǎng)文件同步的方法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-07-07Android?LinearLayout快速設(shè)置每個(gè)item間隔
這篇文章主要介紹了Android?LinearLayout快速設(shè)置每個(gè)item間隔的相關(guān)資料,需要的朋友可以參考下2023-07-07android自定義View實(shí)現(xiàn)圓環(huán)顏色選擇器
這篇文章主要介紹了android自定義View實(shí)現(xiàn)圓環(huán)顏色選擇器,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-06-06Android開(kāi)發(fā)之splash界面下詳解及實(shí)例
這篇文章主要介紹了 Android開(kāi)發(fā)之splash界面下詳解及實(shí)例的相關(guān)資料,需要的朋友可以參考下2017-03-03