天天看點

Android倒計時控件實作

效果圖如下:

Android倒計時控件實作

那麼如何實作這個倒計時功能?需要圍繞核心功能來延伸開發:

Android倒計時控件實作

不論是全屏還是縮小,都需要選擇時間之後才能開始倒計時,那麼首先實作自定義滑動時間。

實作一個如此功能的自定義view,需要如下為步驟:以選擇中的時間字型為軸心,分上、下2部分時間,和上下滑動選擇時間,首先繪制時間顯示字型:

Android倒計時控件實作

Paint.FontMetricsInt 繪制文本對象。fmi.top,fmi.bottom 擷取最高字元和最低字元到基準點的值。 因為選擇和未選擇的時間需要大小亮度區分出來,所有上下方的時間需要另行繪制:

Android倒計時控件實作

如此顯示時間繪制完畢,之後再定義随手勢拖動來選擇時間,這裡需要定義 onTouch 事件:

  • MotionEvent.ACTION_DOWN:紀錄 y 坐标
  • MotionEvent.ACTION_MOVE:根據先前手勢按下時的坐标,再與移動時的坐标對比來判斷是向上還是向下滑動
Android倒計時控件實作
  • MotionEvent.ACTION_UP:
Android倒計時控件實作

當擡手的時候紀錄目前選中時間,定義接口擷取時間。

完成自定義滑動時間後,可以來建立正常形态下的倒計時界面了,因為要滿足所有環境下能使用倒計時,是以這裡 3個view 都是用 WindowManager 來建立懸浮窗:

Android倒計時控件實作

接下來在建立 TimerStandardView 時需要設定滑動條的時間:

Android倒計時控件實作

這裡設定的是一個小時的倒計時,足夠滿足大部分的需求,另外在這裡需要注意在縮小和全屏下切換回正常形态的倒計時,需要判斷是否計時結束切換回來:

Android倒計時控件實作

Create view 之後當點選開始倒計時之後,如果使用者不進行操作,這裡設計4秒之後自動切換至縮小形态,這裡使用 CountDownTimer 來倒計時執行。

CountDownTimer 的相關知識網上很多這裡就不再贅述。這麼設計之後,那麼問題來了,如果使用者拖動了這個懸浮窗,是不是這裡倒計時就不能再執行4秒切換,使用者不再拖動,又需要重新開始4秒倒計時,這裡可以使用 handle 來傳遞停止和開始的指令:

Android倒計時控件實作
Android倒計時控件實作

在使用者拖動懸浮窗改變位置後需要注意,如果切換形态是需要記錄互相位置的,以此來提高使用者體驗,比如在TV上如果不記錄位置還得重新點選拖動,是以使用本地存儲來儲存x,y的坐标,在拖動懸浮窗時存儲位置:

Android倒計時控件實作

在建立懸浮窗時再擷取位置:

Android倒計時控件實作

以上基本就完成大部分的功能需求,然後就隻剩下開始和暫停功能了:

Android倒計時控件實作
Android倒計時控件實作

倒計時計算非常簡單,這裡我就不再浪費時間了,具體可以看源碼,至于剩下的縮小和全屏倒計時界面基本是一樣的流程。另外需要注意的是如果是在TV和平闆上是不會出現适配不佳的問題,要是用手機調試的話需要修改下 dimens。那麼到這裡這篇部落格就告一段落了。第一次寫部落格也不知道品質如何,歡迎大家拍磚,謝謝。代碼位址:

http://download.csdn.net/download/qq654115417/9854122

更多

繼續閱讀