效果圖

前言

篇幅有限，本文只講解關鍵關鍵思路，伸手黨和想看詳細思路的請移步 傳送門點我點我?。?，如果喜歡，歡迎 Star 和 Fork ！

實現思路

本控件其實奔著雙向滑動的SeekBar實現的，不過兼容了單向滑動（隱藏一個拖動按鈕不就是單向的了嘛），所以我以 雙向滑動思路為例。

RangeSeekBar主要包括兩個類，一個是RangeSeekbar類，主要負責繪制進度條以及處理滑動相關邏輯，計算當前滑動值；另一個是SeekBar類，主要負責繪制拖動按鈕相關，如繪制背景以及提示信息等。我們用RangeSeekBar初始化控件的一些屬性，并且生成兩個SeekBar對象，協調他們之間的關系。

關鍵代碼及解析

主要包括控件繪制、兩個拖動按鈕的滑動邏輯及進度的計算。

控件繪制

繪制原理很簡單，計算 –> 定位 –> 繪制。講之前先放一張圖，你就能理解Android是如何定位的了。

繪制進度條

計算：

定位：

繪制：

繪制拖動條按鈕

這里只講解使用圖片如何繪制，自己填充的和進度條類似。

計算：

定位與繪制：

兩個拖動按鈕的滑動邏輯及進度的計算

首先要判斷當前手指拖動的是哪個按鈕，SeekBar類中這個方法可以判斷當前按鈕是否被拖動：

然后在RangeSeekbar的onTouchEvent中當手指按下時根據按鈕的位置和手指的當前坐標即可判斷當前按鈕

當手指移動時，我們根據坐標即可計算出按鈕當前位置占整個進度條的比例，從而可以算出兩個按鈕的值，至于兩個按鈕相遇時，我們可以根據兩個按鈕當前的值判斷，左邊的按鈕的值不能大于右邊的值，同理，右邊按鈕的值也不能小于左邊的值。

注意

進度提示的背景的繪制和拖動的按鈕原理類似，但是有一點不一樣的地方就是考慮到他可能會被拉伸，所以我用的是9Path文件，9Path的繪制和普通的bitmap繪制稍有不同，詳情請看另一篇文章 9path 繪制。如果你想改變它的背景圖片的話，請使用9Path文件！