這次分享的代碼原型出自于兩年前自己為了應聘而寫的一個demo，今年趁著假期抽取成了可以復用的輪子供大家使用。目前是第一版，僅支持展示SQLite中存儲的數(shù)據(jù)，往后會支持直接傳入HashMap<String, Integer>類型的數(shù)據(jù)并更新到 github 上。開發(fā)者也可以根據(jù)現(xiàn)有代碼自行修改展示自己想要展示的數(shù)據(jù)類型，難度已經(jīng)不是很大。
一、首先還是簡單介紹一下實現(xiàn)邏輯，為了激發(fā)大家的學習欲望，首先pow兩張效果圖：
填充屏幕模式
支持左右滑動模式
1）首先，實現(xiàn)波浪統(tǒng)計曲線最大的坑就是如何避免二階貝塞爾曲線在連接的時候出現(xiàn)彎折。我們都知道，二階貝塞爾曲線的實現(xiàn)原理是由兩個基礎點和一個控制點實現(xiàn)波浪連接的，類似下圖：
而統(tǒng)計圖的數(shù)據(jù)則是千變?nèi)f化，所有的點也是隨機分布，如果我們直接將所有的統(tǒng)計數(shù)據(jù)描點，然后依次用二階貝塞爾曲線直接連接，則極有可能出現(xiàn)以下的曲線彎折現(xiàn)象：
因此直接用二階貝塞爾曲線連點的方式是不可取的，我們需要在已經(jīng)存在的數(shù)據(jù)點之間分別再取中點，然后把這些點加入到已經(jīng)存在的數(shù)據(jù)點中，最后依次用貝塞爾曲線連接，如下圖綠色粗線，這樣就可以避開所有可能的彎折點，實現(xiàn)順滑的曲線連接：
因此，我們只需要將獲取到的所有數(shù)據(jù)點取出，再分別求出其中兩點之間的中點坐標，然后按順序放入隊列中，除開第一個和最后一個點采取lineTo的方式直線連接之外，其它全部依次用二階貝塞爾曲線相連，即可獲得一條完美的曲線。
2）繪制統(tǒng)計圖背景色漸變背景（主要關(guān)注 LinearGradient這個類）：
3）繪制統(tǒng)計圖漸變背景色頂部遮蓋（上半部分保留純色遮蓋，曲線以下的部分露出第二步繪制的漸變色背景）：
以上代碼逐行理解也很簡單，首先創(chuàng)建畫筆，然后設置畫筆為填充模式，設置填充顏色，然后先繪制出統(tǒng)計曲線的軌跡，繪制完成之后，采用lineTo的方法將統(tǒng)計曲線和自定義View頂部的兩個點連接起來，并調(diào)用close方法封閉，這就行成了一個純色背景的頂部遮蓋，漸變色背景的統(tǒng)計圖效果就初步顯示出來了。
4）最后再用白色的畫筆在成圖上畫出白色的統(tǒng)計曲線，整個自定義View的效果就算是完成了。
二、以下介紹自定義View的使用方式和相關(guān)屬性，著急開發(fā)相關(guān)功能的開發(fā)者可以直接從 github 上拷貝代碼，根據(jù)其中已經(jīng)封裝好的相關(guān)屬性迅速實現(xiàn)自己想要的效果，項目地址：https://github.com/liuchenguangqnm/statisticsView.git
1）屬性介紹：
????? android:background：安卓自帶的背景屬性，這里代表統(tǒng)計圖下方日期展示的背景顏色
????? app:path_view_theme_color：曲線統(tǒng)計圖背景主題顏色
????? app:is_width_match：統(tǒng)計圖寬度是否剛好填充屏幕，如果設置為true，則曲線圖寬度和屏幕相等；如果設置為false，則曲線圖的寬度會根據(jù)數(shù)據(jù)量的大小而變化，同時支持左右滑動查看
????? app:is_big_interval_at_bottom_text：用于設置統(tǒng)計圖底部的日期是否五日顯示一次。如果設置為true，則底部的日期每五天才會顯示一次，如果設置為false，則統(tǒng)計圖底部的日期全部都會展示出來
????? app:istatistics_view_height：用于設置流線統(tǒng)計圖高度
????? app:date_text_view_height：用于設置底部日期文本展示的高度
????? app:per_date_width：用于設置每日數(shù)據(jù)展示所占據(jù)的dp寬度
????? app:date_text_size：用于設置日期文本的字體大小
2）使用方法：
????? 首先在布局 xml 中添加自定義視圖類 StatisticsViewGroup，并用HorizontalScrollView包裹。代碼如下：
????? 其次在代碼中設置需要展示的數(shù)據(jù)（注意：開發(fā)者在使用本自定義控件展示不同類型的數(shù)據(jù)時，只需改造setSaveDataBase方法里面的代碼就足夠適配所有類型的數(shù)據(jù)展示了）：
以上，完結(jié)撒花，后期會針對 setSaveDataBase 方法做更多的適配完善，方便更多的人使用，轉(zhuǎn)載請注明出處 ~
