當前位置:編程學習大全網 - 源碼下載 - 帶妳擼壹個帶加載功能的按鈕 (LoadingButton Android)

帶妳擼壹個帶加載功能的按鈕 (LoadingButton Android)

介紹壹個帶加載功能的按鈕控件的實現原理,加載動畫來自於 CircularProgressDrawable

圓環加載就是用setCompoundDrawables放到TextView的drawablewStart中,將文字的Gravity設置Center

結果效果是這個亞子的:

看來實際的效果與我們想象中的不太壹樣,原來Drawable在壹開始我們並沒有設置它的位置

那麽我們應該如何將drawable居中顯示文字的旁邊?

用壹張草圖表示大概是這個樣子的:

中間那部分就是我們想要的位移,通過下面的計算就可以得到所要的位移,

而getWidth()這些參數需要在Layout之後才可以得到,

所以我們幹脆在onDraw中對drawable進行位移

需要特別註意的壹點是,我們需要事先將Drawable的Bounds(尺寸和位置)保存起來作為參考,原因是如果在原來Drawable的Bounds基礎上偏移,在每次onDraw()時會不斷向右偏移。

例如第壹次onDraw()偏移是5,第二次onDraw()是在原來的5再次偏移5。

似乎看起來還是有壹點點別扭,從效果上看出文字和drawable是壹起居中的,

看了壹下TextView的源碼發現setCompoundDrawables後會先劃分出TextView左側及右側drawable需要的空間,

然後再按照剩余的空間來居中顯示,

所以最後得到通過位移得到的效果是文字和drawable壹起居中顯示的。

為了讓文字在整個布局的中間,我們可以通過平移畫布來實現文字的居中效果

主要也是通過 getLayoutParams().width和 getLayoutParams().height來改變布局的尺寸,

在開始收縮時先將文本設置為空字符、drawablePadding設為0,然後再開始收縮動畫,具體的方式可以自行嘗試

本文介紹了帶加載效果的按鈕實現整體思路,然鵝如果想要真正使用並沒有文中介紹的那麽簡單,還需要考慮各種細節和因素。(頭發又變少了呢~)

最後可以看下完整實現的效果,已經上傳到github上了( LoadingButton ),加了壹些功能(本來只是想簡單實現壹個按鈕旁邊有壹個Loading,結果功能越寫越多就變成這樣,苦笑~)

有興趣朋友可以給個星星,提提issue喝喝茶,我是新來的第壹次寫這種文章請多多包涵呀。

  • 上一篇:零基礎能學好程序員web前端培訓嗎
  • 下一篇:怎樣解決IntelliJ IDEA git操作報403的錯誤
  • copyright 2024編程學習大全網