Android自定義TabHost擴展控件TabView

最近項目中需要實現TabHost,鑒於TabHost不能實現想要的功能,所以決定自定義一個控件,用於替代TabHost,實現拖拽,Tab之間的替換等功能.剛整合了一份簡單的代碼,第一次發表文章,寫的不好的地方,望見諒.廢話補多少,貼代碼

.

代碼實現共2個類,TabView和Tab

TabView的繪制方法.

1. @Override
2. protected void onDraw(Canvas canvas) {
3. super.onDraw(canvas);
4. canvas.translate(tabViewStart_x, 0);
5. if (tabs == null)
6. return;
7. if (!initTabRegion) {
8. // 給每個Tab分配區域.
9. initTabRegion();
10. // 設置第一個Tab選中.
11. setTabFocus(tabs.get(0));
12. }
13. for (Tab tab : tabs) {
14. if (currentTab != tab || !scrollTab) {
15. // 調用每個Tab的draw方法.
16. tab.draw(canvas);
17. }
18. }
19. if (currentTab != null && scrollTab) {
20. // 移動狀態時調用.
21. currentTab.drawMovement(canvas, currentTabStart_x + currentTabMove_x);
22. }
23. canvas.translate(-tabViewStart_x, 0);
24. tempRegion.set(0, 55, currentTabStart_x + getWidth(), 60);
25. canvas.drawBitmap(TabUtil.tab_band, null, tempRegion, null);
26. }

TabView的事件

1. @Override
2. public boolean onTouchEvent(MotionEvent event) {
3. event.setLocation(event.getX() - tabViewStart_x, event.getY());
4. switch (event.getAction()) {
5. case MotionEvent.ACTION_DOWN:
6. // 獲取選中Tab.
7. currentTab = getCurrentTab(event, false);
8. if (currentTab != null) {
9. longPress = true;
10. // 長按事件.
11. onLongPress();
12. currentTabStart_x = currentTab.getRegion().left;
13. currentTabMove_x = 0;
14. setTabFocus(currentTab);
15. }
16. x = (int) event.getX();
17. y = (int) event.getY();
18. break;
19. case MotionEvent.ACTION_MOVE:
20. if (Math.abs(event.getX() - x) > 10 || Math.abs(event.getY() - y) >10) {
21. longPress = false;
22. }
23. if (currentTab == null) {
24. break;
25. }
26. if (scrollTab) {
27. Tab tab = getCurrentTab(event, true);
28. // 長按Tab移動,實現Tab之間的替換.
29. if (tab != null && currentTab != tab) {
30. int tabID = tabs.indexOf(tab);
31. int currentTabID = tabs.indexOf(currentTab);
32. tabs.set(tabID, currentTab);
33. tabs.set(currentTabID, tab);
34. initTabRegion();
35. }
36. } else {
37. // 整個View的拖拽.
38. tabViewStart_x += (int) event.getX() - x;
39. }
40. currentTabMove_x = (int) event.getX() - x;
41. break;
42. case MotionEvent.ACTION_UP:
43. longPress = false;
44. scrollTab = false;
45. if (task != null) {
46. task.cancel();
47. }
48. // 拖拽松開時開啟一個Timer,實現自定義動畫效果.
49. task = new TimerTask() {
50. @Override
51. public void run() {
52. animateHandler.sendEmptyMessage(1);
53. }
54. };
55. if (tabViewStart_x > 0) {
56. start = 0;
57. timer.schedule(task, 0, 20);
58. }
59. break;
60. }
61. event.setLocation(event.getX() + tabViewStart_x, event.getY());
62. invalidate();
63. return true;
64. }

Handler接受Timer發送的消息.

1. private Handler animateHandler = new Handler() {
2. public void dispatchMessage(Android.os.Message msg) {
3. // 自定義動畫效果.
4. startAnimation(600);
5. if (tabViewStart_x <= 0 && task != null) {
6. task.cancel();
7. tabViewStart_x = 0;
8. }
9. invalidate();
10. };
11. };

Tab的繪制方法.

1. public void draw(Canvas canvas) {
2. canvas.setDrawFilter(pdf);
3. if (sheetTabAdd) {
4. this.tab_left = TabUtil.tab_off_left;
5. this.tab_mid = TabUtil.tab_off_mid;
6. this.tab_right = TabUtil.tab_off_right;
7. drawBitmap(canvas, region, null);
8. } else {
9. if (thisFocus) {
10. this.tab_left = TabUtil.tab_on_left;
11. this.tab_mid = TabUtil.tab_on_mid;
12. this.tab_right = TabUtil.tab_on_right;
13. } else {
14. this.tab_left = TabUtil.tab_off_left;
15. this.tab_mid = TabUtil.tab_off_mid;
16. this.tab_right = TabUtil.tab_off_right;
17. }
18. // 繪制圖片.
19. drawBitmap(canvas, region, null);
20. // 繪制文字.
21. canvas.drawText(title, region.left + 45, region.bottom - 12, textPaint);
22. }
23. }

Tab移動時的繪制方法.

1. public void drawMovement(Canvas canvas, int currentMove_x) {
2. canvas.setDrawFilter(pdf);
3. if (paint == null) {
4. paint = new Paint();
5. paint.setAlpha(200);
6. }
7. if (moveRegion == null) {
8. moveRegion = new Rect(currentMove_x, region.top, currentMove_x + getTabWidth(), region.bottom);
9. } else {
10. moveRegion.left = currentMove_x;
11. moveRegion.right = currentMove_x + getTabWidth();
12. }
13. drawBitmap(canvas, moveRegion, paint);
14. canvas.drawText(title, currentMove_x + 45, region.bottom - 12, textPaint);
15. }