圓形進度條ProgressBar 的實現方式

2021-07-04 15:44:53 字數 3533 閱讀 1366

一、通過動畫實現

定義res/anim/loading.xml如下:

[html]view plain

copy

print?

xmlversion

="1.0"

encoding

="utf-8"

?>

<

animation-list

android:oneshot

="false"

xmlns:android

="">

<

item

android:duration

="150"

android:drawable

="@drawable/loading_01"

/>

<

item

android:duration

="150"

android:drawable

="@drawable/loading_02"

/>

<

item

android:duration

="150"

android:drawable

="@drawable/loading_03"

/>

<

item

android:duration

="150"

android:drawable

="@drawable/loading_04"

/>

<

item

android:duration

="150"

android:drawable

="@drawable/loading_05"

/>

<

item

android:duration

="150"

android:drawable

="@drawable/loading_06"

/>

<

item

android:duration

="150"

android:drawable

="@drawable/loading_07"

/>

animation-list

>

二、通過自定義顏色實現

定義res/drawable/progress_small.xml如下:

[html]view plain

copy

print?

xmlversion

="1.0"

encoding

="utf-8"

?>

<

rotate

xmlns:android

=""android:fromdegrees

="0"

android:pivotx

="50%"

android:pivoty

="50%"

android:todegrees

="360"

>

<

shape

android:innerradiusratio

="3"

android:shape

="ring"

android:thicknessratio

="8"

android:uselevel

="false"

>

<

gradient

android:centercolor

="#ffffff"

android:centery

="0.50"

android:endcolor

="#1e90ff"

android:startcolor

="#000000"

android:type

="sweep"

android:uselevel

="false"

/>

shape

>

rotate

>

三、使用一張進行自定義

定義res/drawable/progress_small.xml如下:

[html]view plain

copy

print?

<

rotate

xmlns:android

=""android:drawable

="@drawable/spinner_black_16"

android:pivotx

="50%"

android:pivoty

="50%"

android:fromdegrees

="0"

android:todegrees

="360"

/>

使用方法都一樣, 如下:

[html]view plain

copy

print?

<

progressbar

android:layout_width

="wrap_content"

android:layout_height

="wrap_content"

android:indeterminatedrawable

="@drawable/progress_small"

/>

也可以根據需要通過設定style來設定其大小! 一般只有使用預設的progrressbar的時候採用。對於上述三種自定義的方式,建議修改直接修改大小,或者shape;

[html]view plain

copy

print?

<

progressbar

android:layout_width

="wrap_content"

android:layout_height

="wrap_content"

android:layout_centerinparent

="true"

style

="?android:attr/progressbarstylesmall"

android:indeterminatedrawable

="@drawable/progress_small"

/>

設定成progressbarstylesmall後,圖示變小。 

設定成progressbarstylelarge後,圖示變大

參考:

圓形進度條

public class circleprogress extends view public int getmheight public void setmheight int mheight public int getmwidth public void setmwidth int mwidt...

canvas圓形進度條

canvas中沒有直接繪製圓的方法,但有乙個繪製弧線的context.arc方法,下面講下用該方法如何繪製出效果。引數說明 看到這裡,大家就會明白怎麼畫圓了把,只要讓起始角和結束角度為乙個圓周就可以了。下面開始畫圖咯!環形進度條主要兩部分組成,一是灰色圓,另一是藍色弧度。也就是說灰色圓圈和藍色弧同圓...

IOS 圓形進度條

demo created by leao on 2017 8 7.import typedef ns enum nsinteger,ccprogressviewstyle inte ce ccprogressview uiview property nonatomic,assign,setter s...