成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

【自定義View】洋蔥數(shù)學(xué)同款雷達圖深入解析-RadarView

番茄西紅柿 / 966人閱讀

摘要:開箱即用的源碼地址洋蔥數(shù)學(xué)同款雷達圖支持自定義屬性雷達網(wǎng)的半徑該屬性決定了的寬高各屬性表示的最大進度雷達網(wǎng)的顏色雷達網(wǎng)的線寬各屬性文字的顏色各屬性文字和中心處名字的字體路徑中心連接區(qū)域的顏色中心連接區(qū)域的邊框顏色中心處的名字中

開箱即用的源碼地址

洋蔥數(shù)學(xué)同款雷達圖-RadarView

支持XML自定義屬性:

rv_webRadius:雷達網(wǎng)的半徑(該屬性決定了View的寬高)

rv_webMaxProgress:各屬性表示的最大進度

rv_webLineColor:雷達網(wǎng)的顏色

rv_webLineWidth:雷達網(wǎng)的線寬

rv_textArrayedColor:各屬性文字的顏色

rv_textArrayedFontPath:各屬性文字和中心處名字的字體路徑

rv_areaColor:中心連接區(qū)域的顏色

rv_areaBorderColor:中心連接區(qū)域的邊框顏色

rv_textCenteredName:中心處的名字

rv_textCenteredColor:中心文字的顏色

rv_textCenteredFontPath:中心數(shù)字文字的字體路徑

rv_animateTime:動畫執(zhí)行時間

rv_animateMode:動畫模式

TIME:時間一定,動畫執(zhí)行時間為rv_animateTime

SPEED:速度一定,動畫執(zhí)行速度為rv_webMaxProgress?rv_animateTime

支持代碼設(shè)置數(shù)據(jù)源:

setTextArray(textList: List):設(shè)置各屬性文字數(shù)組,元素個數(shù)不能小于3

setProgressList(progressList: List):設(shè)置各屬性對應(yīng)的進度數(shù)組,該數(shù)組元素默認都是0,元素個數(shù)必須與文字數(shù)組保持一致

setOldProgressList(oldProgressList: List):設(shè)置各屬性執(zhí)行動畫前,對應(yīng)的進度數(shù)組,該數(shù)組元素默認都是0,元素個數(shù)必須與文字數(shù)組保持一致

支持代碼執(zhí)行動畫:

doInvalidate():各個屬性的動畫一起執(zhí)行

doInvalidate(index: Int, block: ((Int) -> Unit));:指定某屬性執(zhí)行動畫,可傳入?yún)?shù)接收動畫結(jié)束的回調(diào)

起源

近來我司產(chǎn)品側(cè)在重構(gòu)一項業(yè)務(wù),連帶UI也有變動,其中就涉及到了雷達圖,所以也就有了這次封裝的RadarView,其主要特點是:

    有豐富的自定義屬性,可對雷達圖外觀進行設(shè)置

    支持自由設(shè)置屬性個數(shù)

    支持兩種動畫模式(時間一定、速度一定)

    支持指定某屬性執(zhí)行動畫(從而滿足UI稿的個性需求,見頭圖三)

頭圖三聯(lián)是演示了該View的主要特點,然后結(jié)合局部UI稿,大家可以對比看下(還原度99%,?(? ? ??)嘿嘿嘿)。

思考分析

NOTE

    我們把六角形抽象成N角形,后文統(tǒng)一使用N角形表示

    我們在繪制前會把坐標系原點移動到雷達圖中心,后文統(tǒng)一使用原點表示

我們先來思考下關(guān)鍵技術(shù)點:

繪制N角形雷達網(wǎng)

繪制虛線

虛線可以給Paint設(shè)置DashPathEffect實現(xiàn)

以雷達圖中心為原點,將坐標系每逆時針旋轉(zhuǎn)360/N度,從原點向上繪制長度為雷達網(wǎng)半徑的虛線

繪制實線

在繪制完一條虛線后,緊接著繪制實線

同樣以雷達圖中心為原點,將坐標系每向上移動雷達網(wǎng)半徑/4后,并且順時針旋轉(zhuǎn)360/N/2度(為什么是這個值?大家可自行

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/7057.html

相關(guān)文章

  • 手動擼個Android雷達(蜘蛛網(wǎng))RadarView

    摘要:原文鏈接公司產(chǎn)品需要一個雷達圖來展示各維度的比重,網(wǎng)上找了一波,學(xué)到不少,直接自己上手來擼一記無圖言虛空簡單分析一波,確定雷達圖正幾邊形的正五邊形,分為幾個層數(shù)層畫邊畫線描繪文字覆蓋區(qū)域主要這幾步,開擼自定義繼承確定需要使用的變量, 原文鏈接 https://mp.weixin.qq.com/s/Ms... 公司產(chǎn)品需要一個雷達圖來展示各維度的比重,網(wǎng)上找了一波,學(xué)到不少,直接自己上...

    forsigner 評論0 收藏0
  • 技術(shù)人攻略訪談三十五|小猴機器人:征途路上,星辰大海

    摘要:導(dǎo)語本期訪談對象小猴機器人,清華人工智能專業(yè)博士在讀?;蛟S因為成長于廣袤的內(nèi)蒙,小猴身上帶著大山和草原一般的灑脫與樂觀,在他鐘愛的無人車上,印上了一個美好的我們的征途是星辰大海。技術(shù)人攻略除了規(guī)則挖掘,人工智能遇到的難題還 showImg(https://segmentfault.com/img/bVc1yA); 文:Gracia,攝影:周振邦 (本文為原創(chuàng)內(nèi)容,部分或全文轉(zhuǎn)載均需經(jīng)作...

    siberiawolf 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<