Android界面篇[仿QQ的滑動Tab]

使用瞭ActivityGroup。

[java]  

1. public class MainActivity extends ActivityGroup {
2.  
3.  
4.  
5.  
6. private RelativeLayout layout;
7.  
8.  
9.  
10. private RelativeLayout layout1;
11.  
12. private RelativeLayout layout2;
13.  
14. private RelativeLayout layout3;
15.  
16.  
17.  
18. private RelativeLayout bodylayout;
19.  
20.  
21.  
22. private ImageView tab1;
23.  
24. private ImageView tab2;
25.  
26. private ImageView tab3;
27.  
28.  
29.  
30. private ImageView first;
31.  
32. private int current = 1; //默認選中第一個，可以動態的改變此參數值
33.  
34.  
35.  
36. public void onCreate(Bundle savedInstanceState) {
37.  
38. super.onCreate(savedInstanceState);
39.  
40. setContentView(R.layout.main);
41.  
42. initUI();
43.  
44. }
45.  
46.  
47.  
48. private void initUI(){
49.  
50. layout = (RelativeLayout) findViewById(R.id.root);
51.  
52.  
53.  
54. layout1 = (RelativeLayout) findViewById(R.id.layout1);
55.  
56. layout2 = (RelativeLayout) findViewById(R.id.layout2);
57.  
58. layout3 = (RelativeLayout) findViewById(R.id.layout3);
59.  
60. bodylayout = (RelativeLayout) findViewById(R.id.bodylayout);
61.  
62.  
63.  
64. tab1 = (ImageView) findViewById(R.id.tab1);
65.  
66. tab1.setOnClickListener(onClickListener);
67.  
68. tab2 = (ImageView) findViewById(R.id.tab2);
69.  
70. tab2.setOnClickListener(onClickListener);
71.  
72. tab3 = (ImageView) findViewById(R.id.tab3);
73.  
74. tab3.setOnClickListener(onClickListener);
75.  
76.  
77.  
78. RelativeLayout.LayoutParams rl = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
79.  
80. rl.addRule(RelativeLayout.CENTER_IN_PARENT, RelativeLayout.TRUE);
81.  
82. first = new ImageView(this);
83.  
84. first.setTag(first);
85.  
86. first.setImageResource(R.drawable.topbar_select);
87.  
88.  
89.  
90. // 默認選中項
91.  
92. switch (current) {
93.  
94. case 1:
95.  
96. layout1.addView(first, rl);
97.  
98. current = R.id.tab1;
99.  
100. break;
101.  
102. case 2:
103.  
104. layout2.addView(first, rl);
105.  
106. current = R.id.tab2;
107.  
108. break;
109.  
110. case 3:
111.  
112. layout3.addView(first, rl);
113.  
114. current = R.id.tab3;
115.  
116. break;
117.  
118. default:
119.  
120. break;
121.  
122. }
123.  
124. View view = getLocalActivityManager().startActivity(index,
125.  
126. new Intent(MainActivity.this, Tab1.class))
127.  
128. .getDecorView();
129.  
130. bodylayout.addView(view);
131.  
132.  
133.  
134. }
135.  
136.  
137.  
138.  
139. private boolean isAdd = false; // 是否添加過 top_select
140.  
141. private int select_width; // top_select_width
142.  
143. private int select_height; // top_select_height
144.  
145. private int firstLeft; // 第一次添加後的左邊距*****
146.  
147. private int startLeft; // 起始左邊距
148.  
149.  
150.  
151. // 添加一個view，移除一個view
152.  
153. private void replace() {
154.  
155. switch (current) {
156.  
157. case R.id.tab1:
158.  
159. changeTop(layout1);
160.  
161. break;
162.  
163. case R.id.tab2:
164.  
165. changeTop(layout2);
166.  
167. break;
168.  
169. case R.id.tab3:
170.  
171. changeTop(layout3);
172.  
173. break;
174.  
175. default:
176.  
177. break;
178.  
179. }
180.  
181. }
182.  
183.  
184.  
185. private void changeTop(RelativeLayout relativeLayout){
186.  
187. ImageView old = (ImageView) relativeLayout.findViewWithTag(first);;
188.  
189. select_width = old.getWidth();
190.  
191. select_height = old.getHeight();
192.  
193.  
194.  
195. RelativeLayout.LayoutParams rl = new RelativeLayout.LayoutParams(select_width, select_height);
196.  
197. rl.leftMargin = old.getLeft() + ((RelativeLayout)old.getParent()).getLeft();
198.  
199. rl.topMargin = old.getTop() + ((RelativeLayout)old.getParent()).getTop();
200.  
201.  
202.  
203. // 獲取起始位置
204.  
205. firstLeft = old.getLeft() + ((RelativeLayout)old.getParent()).getLeft();
206.  
207.  
208.  
209. ImageView iv = new ImageView(this);
210.  
211. iv.setTag(move);
212.  
213. iv.setImageResource(R.drawable.topbar_select);
214.  
215.  
216.  
217. layout.addView(iv , rl);
218.  
219. relativeLayout.removeView(old);
220.  
221. }
222.  
223.  
224.  
225. private OnClickListener onClickListener = new OnClickListener(){
226.  
227. public void onClick(View v) {
228.  
229. if(!isAdd){
230.  
231. replace(); // 初次使用移除old 添加新的top_select為RelativeLayout所使用
232.  
233. isAdd = true;
234.  
235. }
236.  
237.  
238.  
239. ImageView top_select = (ImageView) layout.findViewWithTag(move);
240.  
241. int tabLeft;
242.  
243. int endLeft = 0;
244.  
245.  
246.  
247. boolean run = false;
248.  
249.  
250.  
251.  
252. switch (v.getId()) {
253.  
254. case R.id.tab1:
255.  
256. if (current != R.id.tab1) {
257.  
258. // 中心位置
259.  
260. tabLeft = ((RelativeLayout) tab1.getParent()).getLeft() + tab1.getLeft() + tab1.getWidth() / 2;
261.  
262. // 最終位置
263.  
264. endLeft = tabLeft – select_width / 2;
265.  
266. current = R.id.tab1;
267.  
268. run = true;
269.  
270. bodylayout.removeAllViews();
271.  
272. View view = getLocalActivityManager().startActivity(index,
273.  
274. new Intent(MainActivity.this, Tab1.class))
275.  
276. .getDecorView();
277.  
278. bodylayout.addView(view);
279.  
280. }
281.  
282. break;
283.  
284. case R.id.tab2:
285.  
286. if (current != R.id.tab2) {
287.  
288. tabLeft = ((RelativeLayout) tab2.getParent()).getLeft() + tab2.getLeft() + tab2.getWidth() / 2;
289.  
290. endLeft = tabLeft – select_width / 2;
291.  
292. current = R.id.tab2;
293.  
294. run = true;
295.  
296. bodylayout.removeAllViews();
297.  
298. View view = getLocalActivityManager().startActivity(index,
299.  
300. new Intent(MainActivity.this, Tab2.class))
301.  
302. .getDecorView();
303.  
304. bodylayout.addView(view);
305.  
306. }
307.  
308. break;
309.  
310. case R.id.tab3:
311.  
312. if (current != R.id.tab3) {
313.  
314. tabLeft = ((RelativeLayout) tab3.getParent()).getLeft() + tab3.getLeft() + tab3.getWidth() / 2;
315.  
316. endLeft = tabLeft – select_width/2;
317.  
318. current = R.id.tab3;
319.  
320. run = true;
321.  
322. bodylayout.removeAllViews();
323.  
324. View view = getLocalActivityManager().startActivity(index,
325.  
326. new Intent(MainActivity.this, Tab3.class))
327.  
328. .getDecorView();
329.  
330. bodylayout.addView(view);
331.  
332. }
333.  
334. break;
335.  
336. default:
337.  
338. break;
339.  
340. }
341.  
342.  
343.  
344. if(run){
345.  
346. TranslateAnimation animation = new TranslateAnimation(startLeft, endLeft – firstLeft, 0, 0);
347.  
348. startLeft = endLeft – firstLeft; // 重新設定起始位置
349.  
350. animation.setDuration(400);
351.  
352. animation.setFillAfter(true);
353.  
354. top_select.bringToFront();
355.  
356. top_select.startAnimation(animation);
357.  
358. }
359.  
360.  
361.  
362. }
363.  
364.  
365.  
366.  
367. };
368.  
369.  
370.  
371.  
372. }

      

     [html]

     2.  
     4. xmlns:android=https://schemas.android.com/apk/res/android
     5.  
     6. android:id=@+id/root
     7.  
     8. android:layout_width=fill_parent
     9.  
     10. android:layout_height=fill_parent
     11.  
     12. >
     13.  
     15. android:orientation=vertical
     16.  
     17. android:layout_width=fill_parent
     18.  
     19. android:layout_height=fill_parent
     20.  
     21. android:background=@drawable/default_bg
     22.  
     23. >
     24.  
     26. android:orientation=horizontal
     27.  
     28. android:layout_width=fill_parent
     29.  
     30. android:layout_height=fill_parent
     31.  
     32. android:layout_weight=6.0
     33.  
     34. >
     35.  
     37. android:id=@+id/layout1
     38.  
     39. android:layout_width=fill_parent
     40.  
     41. android:layout_height=wrap_content
     42.  
     43. android:layout_weight=1.0
     44.  
     45. android:layout_gravity=center_vertical
     46.  
     47. >
     48.  
     50. android:id=@+id/tab1
     51.  
     52. android:layout_width=wrap_content
     53.  
     54. android:layout_height=wrap_content
     55.  
     56. android:src=@drawable/tab1
     57.  
     58. android:layout_centerInParent=true
     59.  
     60. />
     61.  
     62.  
     63.  
     65. android:id=@+id/layout2
     66.  
     67. android:layout_width=fill_parent
     68.  
     69. android:layout_height=wrap_content
     70.  
     71. android:layout_weight=1.0
     72.  
     73. android:layout_gravity=center_vertical
     74.  
     75. >
     76.  
     78. android:id=@+id/tab2
     79.  
     80. android:layout_width=wrap_content
     81.  
     82. android:layout_height=wrap_content
     83.  
     84. android:src=@drawable/tab2
     85.  
     86. android:layout_centerInParent=true
     87.  
     88. />
     89.  
     90.  
     91.  
     93. android:id=@+id/layout3
     94.  
     95. android:layout_width=fill_parent
     96.  
     97. android:layout_height=wrap_content
     98.  
     99. android:layout_weight=1.0
     100.  
     101. android:layout_gravity=center_vertical
     102.  
     103. >
     104.  
     106. android:id=@+id/tab3
     107.  
     108. android:layout_width=wrap_content
     109.  
     110. android:layout_height=wrap_content
     111.  
     112. android:src=@drawable/tab3
     113.  
     114. android:layout_centerInParent=true
     115.  
     116. />
     117.  
     118.  
     119.  
     120.  
     121.  
     123. android:orientation=horizontal
     124.  
     125. android:layout_width=fill_parent
     126.  
     127. android:layout_height=fill_parent
     128.  
     129. android:layout_weight=1.0
     130.  
     131. android:background=#ffffff
     132.  
     133. android:gravity=center
     134.  
     135. android:id=@+id/bodylayout
     136.  
     137. >
     138.  
     139.  
     140.  
     141.  
     142.  
     143.  
     144.  
     145.