利用ViewPager+Fragment+slidingmenu側滑組件實(shí)現
加入技術(shù)交流群
最近折騰了很久，經(jīng)過(guò)三番五次的推倒重來(lái)，總算是弄出了一個(gè)效果比較滿(mǎn)意的側滑demo。把主要的實(shí)現流程mark下來(lái)，方便日后翻閱，實(shí)現的效果圖(手動(dòng)錄制的，不流暢)：
本文引用地址：http://dyxdggzs.com/article/201610/306013.htm
從圖上可以看到，demo上面有三個(gè)按鈕和一個(gè)包含3個(gè)Fragment頁(yè)面的ViewPager，另外左側滑能拉出一個(gè)左頁(yè)面。剛開(kāi)始做的demo是直接用FragmentTabHost來(lái)實(shí)現的，并在這個(gè)基礎上繼承RelativeLayout寫(xiě)了個(gè)布局，來(lái)實(shí)現頁(yè)面的側滑效果。那個(gè)demo的效果跟這個(gè)的主要差距就是三個(gè)tab之間只能通過(guò)點(diǎn)擊切換，沒(méi)有viewpager這樣的滑動(dòng)切換效果。這個(gè)demo下面的三個(gè)按鈕其實(shí)是三個(gè)RadioButton，只是把它前面的圓點(diǎn)隱藏了(demo里面沒(méi)好好弄按鈕上的背景效果了)。之前嘗試過(guò)利用PagerTitleStrip來(lái)實(shí)現三個(gè)Tab的標簽，但結果是它們會(huì )隨著(zhù)ViewPager不停滾動(dòng)，沒(méi)法固定下來(lái)。
demo主要的布局文件如下：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
xmlns:tools=http://schemas.android.com/tools
android:layout_width=match_parent
android:layout_height=match_parent >
android:id=@+id/pager
android:layout_width=fill_parent
android:layout_height=wrap_content
android:layout_above=@+id/titlelayout >
android:id=@+id/titlelayout
android:layout_width=fill_parent
android:layout_height=wrap_content
android:layout_alignParentBottom=true >
android:id=@+id/tab_menu
android:layout_width=fill_parent
android:layout_height=wrap_content
android:background=@drawable/tab_bg_normal
android:orientation=horizontal >
android:id=@+id/title1
style=@style/tab_style
android:checked=true
android:drawableTop=@drawable/tab_activity_selector
android:text=活動(dòng) />
android:id=@+id/title2
style=@style/tab_style
android:drawableTop=@drawable/tab_friend
android:text=工作 />
android:id=@+id/title3
style=@style/tab_style
android:drawableTop=@drawable/tab_friend
android:text=圈子 />
要實(shí)現ViewPager+Fragment的滑動(dòng)效果，必須繼承FragmentActivity，同時(shí)要給ViewPager設置Adapter。由于ViewPager上面要加載Fragment(需要繼承Fragment類(lèi))，所以不是重載PagerAdapter,而是重寫(xiě)FragmentPagerAdapter類(lèi)：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
public class MyViewPagerAdapter extends FragmentPagerAdapter {
private ArrayList
public MyViewPagerAdapter(FragmentManager fm) {
super(fm);
}
/**
* 自定義的構造函數
* @param fm
* @param fragments ArrayList
*/
public MyViewPagerAdapter(FragmentManager fm,ArrayList
super(fm);
this.fragments = fragments;
}
@Override
public Fragment getItem(int arg0) {
return fragments.get(arg0);//返回Fragment對象
}
@Override
public int getCount() {
return fragments.size();//返回Fragment的個(gè)數
}
}
寫(xiě)好了adapter，在主函數的onCreate()函數里面初始化ViewPager,同時(shí)給它配置adapter和設置滑動(dòng)事件監聽(tīng)(這需要實(shí)現OnPageChangeListener接口)：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
/**
* 初始化視圖
*/
private void initView() {
// TODO Auto-generated method stub
評論