Android主页导航：fragment+viewpager

简单实现Fragment+ViewPager实现主页导航控制，效果如下：

一、activity_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/viewpager_main"
 9         android:layout_width="match_parent"
10         android:layout_height="0dp"
11         android:layout_weight="7" />
12 
13     <LinearLayout
14         android:layout_width="match_parent"
15         android:layout_height="0dp"
16         android:layout_weight="1"
17         android:orientation="horizontal" >
18 
19         <RelativeLayout
20             android:id="@+id/rel_signin"
21             android:layout_width="0dp"
22             android:layout_height="match_parent"
23             android:background="@color/tab_select_bg"
24             android:layout_weight="1" >
25 
26             <Button
27                 style="@style/tab_style"
28                 android:id="@+id/tab_signin"
29                 android:drawableTop="@drawable/my"
30                 android:text="@string/signin"/>
31         </RelativeLayout>
32 
33         <RelativeLayout
34              android:id="@+id/rel_contact"
35             android:layout_width="0dp"
36             android:layout_height="match_parent"
37             android:layout_weight="1" >
38 
39             <Button
40                 android:id="@+id/tab_contact"
41                 style="@style/tab_style"
42                 android:drawableTop="@drawable/my"
43                 android:text="@string/contact"></Button>
44         </RelativeLayout>
45 
46         <RelativeLayout
47              android:id="@+id/rel_search"
48             android:layout_width="0dp"
49             android:layout_height="match_parent"
50             android:layout_weight="1" >
51 
52             <Button
53                 android:id="@+id/tab_search"
54                 style="@style/tab_style"
55                 android:drawableTop="@drawable/my"
56                 android:text="@string/searrch"></Button>
57         </RelativeLayout>
58 
59         <RelativeLayout
60              android:id="@+id/rel_earning"
61             android:layout_width="0dp"
62             android:layout_height="match_parent"
63             android:layout_weight="1" >
64 
65             <Button
66                 android:id="@+id/tab_earning"
67                 style="@style/tab_style"
68                 android:drawableTop="@drawable/my"
69                 android:text="@string/earning"
70                  />
71         </RelativeLayout>
72 
73         <RelativeLayout
74             android:id="@+id/rel_my"
75             android:layout_width="0dp"
76             android:layout_height="match_parent"
77             android:layout_weight="1" >
78 
79             <Button
80                  android:id="@+id/tab_my"
81                  style="@style/tab_style"
82                 android:drawableTop="@drawable/my"
83                 android:text="@string/my"
84                  />
85         </RelativeLayout>
86     </LinearLayout>
87 
88 </LinearLayout>

二、MainActivity主文件:

  1 package com.fragmentviewpagerdemo;
  2 
  3 import java.util.ArrayList;
  4 import java.util.List;
  5 
  6 import android.os.Bundle;
  7 import android.support.v4.app.Fragment;
  8 import android.support.v4.app.FragmentActivity;
  9 import android.support.v4.app.FragmentManager;
 10 import android.support.v4.app.FragmentPagerAdapter;
 11 import android.support.v4.view.ViewPager;
 12 import android.view.View;
 13 import android.widget.Button;
 14 import android.widget.RelativeLayout;
 15 
 16 import com.fragmentviewpagerdemo.fragment.MyFragment;
 17 
 18 public class MainActivity extends FragmentActivity {
 19     ViewPager viewpager_main;
 20     RelativeLayout rel_signin;
 21     RelativeLayout rel_contact;
 22     RelativeLayout rel_search;
 23     RelativeLayout rel_earning;
 24     RelativeLayout rel_my;
 25     Button tab_signin;
 26     Button tab_contact;
 27     Button tab_search;
 28     Button tab_earning;
 29     Button tab_my;
 30 
 31     private int currentPage = 0;
 32     private MyFragment signInFragment;
 33     private MyFragment searchFragment;
 34     private MyFragment contactFragment;
 35     private MyFragment earningFragment;
 36     private MyFragment myFragment;
 37 
 38     private List<RelativeLayout> mRelTabs;
 39     private List<Fragment> fragments;
 40     private List<Button> mTabs;// 按钮
 41 
 42     @Override
 43     protected void onCreate(Bundle savedInstanceState) {
 44         super.onCreate(savedInstanceState);
 45         setContentView(R.layout.activity_main);
 46         init();
 47         controlViewPager();
 48     }
 49 
 50     // 控制viewpager
 51     private void controlViewPager() {
 52         FragmentManager fm = getSupportFragmentManager();
 53         viewpager_main.setAdapter(new ViewPagerAdapter(fm));
 54         viewpager_main.setOnPageChangeListener(new pageChangeListener());
 55         for (int i = 0; i < mTabs.size(); i++) {
 56             final int index = i;
 57             mTabs.get(i).setOnClickListener(new View.OnClickListener() {
 58 
 59                 @Override
 60                 public void onClick(View v) {
 61                     setcurrent(index);
 62                     viewpager_main.setCurrentItem(index);
 63                 }
 64             });
 65         }
 66     }
 67 
 68     private void init() {
 69         viewpager_main = (ViewPager) findViewById(R.id.viewpager_main);
 70         rel_signin = (RelativeLayout) findViewById(R.id.rel_signin);
 71         rel_contact = (RelativeLayout) findViewById(R.id.rel_contact);
 72         rel_search = (RelativeLayout) findViewById(R.id.rel_search);
 73         rel_earning = (RelativeLayout) findViewById(R.id.rel_earning);
 74         rel_my = (RelativeLayout) findViewById(R.id.rel_my);
 75         tab_signin = (Button) findViewById(R.id.tab_signin);
 76         tab_contact = (Button) findViewById(R.id.tab_contact);
 77         tab_search = (Button) findViewById(R.id.tab_search);
 78         tab_earning = (Button) findViewById(R.id.tab_earning);
 79         tab_my = (Button) findViewById(R.id.tab_my);
 80 
 81         currentPage = 0;
 82         mTabs = new ArrayList<Button>();
 83         mTabs.add(tab_signin);
 84         mTabs.add(tab_contact);
 85         mTabs.add(tab_search);
 86         mTabs.add(tab_earning);
 87         mTabs.add(tab_my);
 88         mRelTabs = new ArrayList<RelativeLayout>();
 89         mRelTabs.add(rel_signin);
 90         mRelTabs.add(rel_contact);
 91         mRelTabs.add(rel_search);
 92         mRelTabs.add(rel_earning);
 93         mRelTabs.add(rel_my);
 94 
 95         signInFragment = new MyFragment("考勤", getResources().getColor(
 96                 R.color.fragment_1));
 97         searchFragment = new MyFragment("通讯录", getResources().getColor(
 98                 R.color.fragment_2));
 99         contactFragment = new MyFragment("查单", getResources().getColor(
100                 R.color.fragment_3));
101         earningFragment = new MyFragment("收入", getResources().getColor(
102                 R.color.fragment_4));
103         myFragment = new MyFragment("我的", getResources().getColor(
104                 R.color.fragment_5));
105         fragments = new ArrayList<Fragment>();
106         fragments.add(signInFragment);
107         fragments.add(contactFragment);
108         fragments.add(searchFragment);
109         fragments.add(earningFragment);
110         fragments.add(myFragment);
111 
112     }
113 
114     /**
115      * 设置导航图标均为未选中
116      */
117     private void setTabNotSelect() {
118         rel_signin.setBackgroundColor(getResources().getColor(R.color.white));
119         rel_contact.setBackgroundColor(getResources().getColor(R.color.white));
120         rel_search.setBackgroundColor(getResources().getColor(R.color.white));
121         rel_earning.setBackgroundColor(getResources().getColor(R.color.white));
122         rel_my.setBackgroundColor(getResources().getColor(R.color.white));
123 
124     }
125 
126     // viewpager适配器
127     class ViewPagerAdapter extends FragmentPagerAdapter {
128 
129         public ViewPagerAdapter(FragmentManager fm) {
130             super(fm);
131         }
132 
133         @Override
134         public Fragment getItem(int arg0) {
135             return fragments.get(arg0);
136         }
137 
138         @Override
139         public int getCount() {
140             return fragments.size();
141         }
142 
143     }
144 
145     // viewpager监听器
146     class pageChangeListener implements ViewPager.OnPageChangeListener {
147 
148         @Override
149         public void onPageScrollStateChanged(int arg0) {
150         }
151 
152         @Override
153         public void onPageScrolled(int arg0, float arg1, int arg2) {
154         }
155 
156         @Override
157         public void onPageSelected(int arg0) {
158             setcurrent(arg0);
159 
160         }
161     }
162 
163     // viewpager改变后更改其他控件
164     private void setcurrent(int position) {
165         currentPage = position;
166         setTabNotSelect();
167         mRelTabs.get(position).setBackgroundColor(
168                 getResources().getColor(R.color.tab_select_bg));
169     }
170 }

三、百度云下载地址：http://pan.baidu.com/s/1gdyFGKb