安卓开发之使用viewpager+fragment实现滚动tab页

闲着。用viewpager+fragment实现了个滚动tab。。轻拍，以后会陆续发先小东西出来。。爱分享，才快乐。demo见附件。。

1. package com.example.demo;
2. import java.util.ArrayList;
3. import java.util.List;
4. import android.os.Bundle;
5. import android.support.v4.app.Fragment;
6. import android.support.v4.app.FragmentActivity;
7. import android.support.v4.app.FragmentManager;
8. import android.support.v4.app.FragmentPagerAdapter;
9. import android.support.v4.view.ViewPager;
10. import android.support.v4.view.ViewPager.OnPageChangeListener;
11. import android.view.View;
12. import android.view.View.OnClickListener;
13. import android.widget.TextView;
14. public class MainActivity extends FragmentActivity {
15. private TextView chatView, address, findView;
16. private ViewPager mViewPager;
17. private TextView mBottomLine;
18. private int screenWidth = 0;
19. private int currentIndex = 0;
20. private MyPagerAdapter myPagerAdapter;
21. private List<Fragment> mFragmentList = new ArrayList<Fragment>();
22. private List<String> mTitleList = new ArrayList<String>();
23. MyFragment chatFragment;
24. MyFragment findFragment;
25. MyFragment addressFragment;
26. @Override
27. protected void onCreate(Bundle savedInstanceState) {
28. super.onCreate(savedInstanceState);
29. setContentView(R.layout.activity_main);
30. initComponents();
31. }
32. private void initComponents() {
33. this.mBottomLine = (TextView) findViewById(R.id.bottom_line);
34. this.screenWidth = getWindowManager().getDefaultDisplay().getWidth();
35. this.chatView = (TextView) findViewById(R.id.chat_top_info);
36. this.findView = (TextView) findViewById(R.id.find_top_info);
37. this.address = (TextView) findViewById(R.id.address_top_info);
38. TopTabClickListener clickListener = new TopTabClickListener();
39. this.chatView.setOnClickListener(clickListener);
40. this.findView.setOnClickListener(clickListener);
41. this.address.setOnClickListener(clickListener);
42. this.mViewPager = (ViewPager)findViewById(R.id.viewPager);
43. chatFragment = new MyFragment();
44. Bundle b = new Bundle();
45. b.putInt("index", 0);
46. chatFragment.setArguments(b);
47. mFragmentList.add(chatFragment);
48. findFragment = new MyFragment();
49. b = new Bundle();
50. b.putInt("index", 1);
51. findFragment.setArguments(b);
52. mFragmentList.add(findFragment);
53. addressFragment = new MyFragment();
54. b = new Bundle();
55. b.putInt("index", 2);
56. addressFragment.setArguments(b);
57. mFragmentList.add(addressFragment);
58. myPagerAdapter = new MyPagerAdapter(getSupportFragmentManager(), mFragmentList, mTitleList);
59. mViewPager.setAdapter(myPagerAdapter);
60. mViewPager.setOnPageChangeListener(new OnPageChangeListener() {
61. @Override
62. public void onPageSelected(int index) {}
63. @Override
64. public void onPageScrolled(int index, float arg1, int pixes) {
65. if(pixes != 0){
66. mBottomLine.layout((int) ((index + arg1) * screenWidth / 3), 0, (int) ((index + 1 + arg1) * screenWidth / 3), mBottomLine.getWidth());
67. }
68. if (pixes == 0) {
69. currentIndex = index;
70. changeIndex(currentIndex);
71. }
72. System.out.println("the state is : " + arg1 + "   and index is " + index);
73. }
74. @Override
75. public void onPageScrollStateChanged(int state) {}
76. });
77. }
78. public void onLeftBtnClick(View view){
79. this.finish();
80. }
81. private class TopTabClickListener implements OnClickListener{
82. @Override
83. public void onClick(View view) {
84. if (view.getId() == chatView.getId()) {
85. mViewPager.setCurrentItem(0);
86. }else if(view.getId() == findView.getId()){
87. mViewPager.setCurrentItem(1);
88. }else{
89. mViewPager.setCurrentItem(2);
90. }
91. changeIndex(mViewPager.getCurrentItem());
92. }
93. }
94. private void changeIndex(int index){
95. if(index == 0){
96. chatView.setTextColor(getResources().getColor(R.color.green));
97. findView.setTextColor(getResources().getColor(R.color.black));
98. address.setTextColor(getResources().getColor(R.color.black));
99. }else if(index == 1){
100. findView.setTextColor(getResources().getColor(R.color.green));
101. chatView.setTextColor(getResources().getColor(R.color.black));
102. address.setTextColor(getResources().getColor(R.color.black));
103. }else {
104. address.setTextColor(getResources().getColor(R.color.green));
105. findView.setTextColor(getResources().getColor(R.color.black));
106. chatView.setTextColor(getResources().getColor(R.color.black));
107. }
108. mBottomLine.layout((int) (index * screenWidth / 3), 0, (int) ((index + 1) * screenWidth / 3), mBottomLine.getWidth());
109. }
110. private class MyPagerAdapter extends FragmentPagerAdapter {
111. private List<Fragment> fragmentList;
112. private List<String> titleList;
113. public MyPagerAdapter(FragmentManager fm, List<Fragment> fragmentList,
114. List<String> titleList) {
115. super(fm);
116. this.fragmentList = fragmentList;
117. this.titleList = titleList;
118. }
119. /**
120. * 得到每个页面
121. */
122. @Override
123. public Fragment getItem(int arg0) {
124. return (fragmentList == null || fragmentList.size() == 0) ? null
125. : fragmentList.get(arg0);
126. }
127. /**
128. * 每个页面的title
129. */
130. @Override
131. public CharSequence getPageTitle(int position) {
132. return (titleList.size() > position) ? titleList.get(position) : "";
133. }
134. @Override
135. public int getCount() {
136. return fragmentList == null ? 0 : fragmentList.size();
137. }
138. }
139. }
140. package com.example.demo;
141. import android.os.Bundle;
142. import android.support.v4.app.Fragment;
143. import android.view.LayoutInflater;
144. import android.view.View;
145. import android.view.ViewGroup;
146. import android.widget.TextView;
147. public class MyFragment extends Fragment {
148. private int index = 0;
149. private LayoutInflater mInflater;
150. @Override
151. public void onCreate(Bundle savedInstanceState) {
152. super.onCreate(savedInstanceState);
153. index = getArguments().getInt("index", 0);
154. }
155. @Override
156. public View onCreateView(LayoutInflater inflater, ViewGroup container,
157. Bundle savedInstanceState) {
158. mInflater = inflater;
159. TextView v = (TextView) mInflater.inflate(R.layout.fragment, null);
160. v.setText("第" + index);
161. return v;
162. }
163. }

demo.zip (1.4 MB)