簡介
最近項目需要繪製一批圖表控件,於是使用了MPChatAndroid
框架,但是裏面沒有漏斗圖,網上也沒有合適的漏斗圖。於是,只能自己造輪子咯。已開源至github:FunnelView,感興趣的可以fork,star
效果
直接放圖:
效果 | 圖片 |
---|---|
默認效果 | |
自定義描述文字 | |
自定義寬度伸縮策略 |
使用
Step1
在你的root build.gradle中添加:
allprojects {
repositories {
...
maven { url 'https://jitpack.io' }
}
}
在你的app build.gradle中添加:
dependencies {
implementation 'com.github.Jay-huangjie:FunnelView:v1.1'
}
最新版本去github看
Step2
如果你只需要默認樣式,只需兩步即可使用:
- 數據源繼承
IFunnelData
接口 - 調用
setChartData
方法將數據源設置進去即可
注意:繪製的順序是從下往上,所以如果你希望你的數據源是從上往下排列,需要調用Collections.reverse(List<?> list);
方法將集合結果反轉
關於高級用法見README
原理
大概的一個思路是,先確定好漏斗的最下方的中心點centerX
,然後往兩邊繪製,利用path
逐級往上繪製。通過每次增加一個halfWidth
的寬度來達到漏斗的效果,而這個寬度完全可以自定義,所以在適配上有無限的可能,從而達到適配目的。