Android studio圓形進(jìn)度條 百分?jǐn)?shù)跟隨變化
本文實(shí)例為大家分享了Android studio圓形進(jìn)度條展示的具體代碼,供大家參考,具體內(nèi)容如下
MainActivity
import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.view.View; import android.widget.Button; public class MainActivity extends AppCompatActivity implements View.OnClickListener{ private Gua mGua1; private Button play; private Button resele; private Button dao; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mGua1 = (Gua) findViewById(R.id.Circle); mGua1.setTargetPercent(0); play=(Button)findViewById(R.id.play); resele=(Button)findViewById(R.id.resele); dao=(Button)findViewById(R.id.dao); play.setOnClickListener(this); resele.setOnClickListener(this); dao.setOnClickListener(this); } @Override public void onClick(View view) { switch (view.getId()){ case R.id.play: //設(shè)置目標(biāo)百分比為100 mGua1.setTargetPercent(100); mGua1.invalidate(); break; case R.id.resele: //設(shè)置目標(biāo)百分比為0 mGua1.setTargetPercent(0); mGua1.invalidate(); break; case R.id.dao: //設(shè)置目標(biāo)百分比為100 mGua1.setTargetPercent(0); mGua1.invalidate(); break; } } }
Gua
import android.content.Context; import android.content.res.TypedArray; import android.graphics.Canvas; import android.graphics.Paint; import android.graphics.Paint.Align; import android.graphics.RectF; import android.util.AttributeSet; import android.view.View; public class Gua extends View{ private Paint mCirclePaint; private Paint mTextPaint; private Paint mArcPaint; private int mCircleX; private int mCircleY; private float mCurrentAngle; private RectF mArcRectF; private float mStartSweepValue; private float mTargetPercent; private float mCurrentPercent; private int mRadius; private int mCircleBackground; private int mRingColor; private int mTextSize; private int mTextColor; public Gua(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); init(context); } public Gua(Context context, AttributeSet attrs) { super(context, attrs); //自定義屬性 values/attr TypedArray typedArray = context.obtainStyledAttributes(attrs,R.styleable.PercentageRing); //中間圓的背景顏色 默認(rèn)為淺紫色 mCircleBackground = typedArray.getColor(R.styleable.PercentageRing_circleBackground, 0xffafb4db); //外圓環(huán)的顏色 默認(rèn)為深紫色 mRingColor = typedArray.getColor(R.styleable.PercentageRing_ringColor, 0xff6950a1); //中間圓的半徑 默認(rèn)為60 mRadius = typedArray.getInt(R.styleable.PercentageRing_radius, 60); //字體顏色 默認(rèn)為白色 mTextColor = typedArray.getColor(R.styleable.PercentageRing_textColor, 0xffffffff); //最后一定要調(diào)用這個(gè) 釋放掉TypedArray typedArray.recycle(); //初始化數(shù)據(jù) init(context); } public Gua(Context context) { super(context); init(context); } private void init(Context context){ //圓環(huán)開(kāi)始角度 -90° 正北方向 mStartSweepValue = -90; //當(dāng)前角度 mCurrentAngle = 0; //當(dāng)前百分比 mCurrentPercent = 0; //設(shè)置中心園的畫(huà)筆 mCirclePaint = new Paint(); mCirclePaint.setAntiAlias(true); mCirclePaint.setColor(mCircleBackground); mCirclePaint.setStyle(Paint.Style.FILL); //設(shè)置文字的畫(huà)筆 mTextPaint = new Paint(); mTextPaint.setColor(mTextColor); mTextPaint.setAntiAlias(true); mTextPaint.setStyle(Paint.Style.FILL); mTextPaint.setStrokeWidth((float) (0.025*mRadius)); mTextPaint.setTextSize(mRadius/2); mTextPaint.setTextAlign(Align.CENTER); //設(shè)置外圓環(huán)的畫(huà)筆 mArcPaint = new Paint(); mArcPaint.setAntiAlias(true); mArcPaint.setColor(mRingColor); mArcPaint.setStyle(Paint.Style.STROKE); mArcPaint.setStrokeWidth((float) (0.075*mRadius)); //獲得文字的字號(hào) 因?yàn)橐O(shè)置文字在圓的中心位置 mTextSize = (int) mTextPaint.getTextSize(); } //主要是測(cè)量wrap_content時(shí)候的寬和高,因?yàn)閷捀咭粯?,只需要測(cè)量一次寬即可,高等于寬 @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { setMeasuredDimension(measure(widthMeasureSpec), measure(widthMeasureSpec)); //設(shè)置圓心坐標(biāo) mCircleX = getMeasuredWidth()/2; mCircleY = getMeasuredHeight()/2; //如果半徑大于圓心橫坐標(biāo),需要手動(dòng)縮小半徑的值,否則就畫(huà)到外面去了 if (mRadius>mCircleX) { //設(shè)置半徑大小為圓心橫坐標(biāo)到原點(diǎn)的距離 mRadius = mCircleX; mRadius = (int) (mCircleX-0.075*mRadius); //因?yàn)榘霃礁淖兞?,所以要重新設(shè)置一下字體寬度 mTextPaint.setStrokeWidth((float) (0.025*mRadius)); //重新設(shè)置字號(hào) mTextPaint.setTextSize(mRadius/2); //重新設(shè)置外圓環(huán)寬度 mArcPaint.setStrokeWidth((float) (0.075*mRadius)); //重新獲得字號(hào)大小 mTextSize = (int) mTextPaint.getTextSize(); } //畫(huà)中心園的外接矩形,用來(lái)畫(huà)圓環(huán)用 mArcRectF = new RectF(mCircleX-mRadius, mCircleY-mRadius, mCircleX+mRadius, mCircleY+mRadius); } //當(dāng)wrap_content的時(shí)候,view的大小根據(jù)半徑大小改變,但最大不會(huì)超過(guò)屏幕 private int measure(int measureSpec){ int result=0; int specMode = MeasureSpec.getMode(measureSpec); int specSize = MeasureSpec.getSize(measureSpec); if (specMode == MeasureSpec.EXACTLY) { result = specSize; }else { result =(int) (1.075*mRadius*2); if (specMode == MeasureSpec.AT_MOST) { result = Math.min(result, specSize); } } return result; } //開(kāi)始畫(huà)中間圓、文字和外圓環(huán) @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); //畫(huà)中間圓 canvas.drawCircle(mCircleX, mCircleY, mRadius, mCirclePaint); //畫(huà)圓環(huán) canvas.drawArc(mArcRectF, mStartSweepValue ,mCurrentAngle, false, mArcPaint); //畫(huà)文字 canvas.drawText(String.valueOf(mCurrentPercent)+"%", mCircleX, mCircleY+mTextSize/4, mTextPaint); //判斷當(dāng)前百分比是否小于設(shè)置目標(biāo)的百分比 if (mCurrentPercent<mTargetPercent) { //當(dāng)前百分比+1 mCurrentPercent+=1; //當(dāng)前角度+360 mCurrentAngle+=3.6; //每10ms重畫(huà)一次 postInvalidateDelayed(10); }/*else if(mCurrentPercent==mTargetPercent){ //當(dāng)前百分比-1 mCurrentPercent=0; //當(dāng)前角度+360 mCurrentAngle=0; //每10ms重畫(huà)一次 postInvalidateDelayed(10); }*/else if(mCurrentPercent>mTargetPercent){ //當(dāng)前百分比-1 mCurrentPercent-=1; //當(dāng)前角度+360 mCurrentAngle-=3.6; //每10ms重畫(huà)一次 postInvalidateDelayed(10); } } //設(shè)置目標(biāo)的百分比 public void setTargetPercent(int percent){ this.mTargetPercent = percent; } }
Xml文件
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto" android:orientation="vertical"> <Button android:id="@+id/but1" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="改變外層圓環(huán)顏色" /> <com.bwie.test.wuxiaorui1508a20171009.Gua android:id="@+id/Circle" android:layout_width="wrap_content" android:layout_height="wrap_content" app:radius="90" app:textColor="#ffffffff" /> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:gravity="center" > <Button android:id="@+id/play" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="開(kāi)始" /> <Button android:id="@+id/resele" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="重置" /> <Button android:id="@+id/dao" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="暫停" /> </LinearLayout> </LinearLayout>
values文件中的attrs
<?xml version="1.0" encoding="utf-8"?> <resources> <declare-styleable name="PercentageRing"> <attr name="radius" format="integer"/> <attr name="circleBackground" format="color"/> <attr name="ringColor" format="color"/> <attr name="textColor" format = "color"/> </declare-styleable> </resources>
效果展示:
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- Android Studio時(shí)間選擇器的創(chuàng)建方法
- Android Studio實(shí)現(xiàn)進(jìn)度條效果
- Android 七種進(jìn)度條的樣式
- android自定義進(jìn)度條漸變色View的實(shí)例代碼
- Android中實(shí)現(xiàn)Webview頂部帶進(jìn)度條的方法
- Android文件下載進(jìn)度條的實(shí)現(xiàn)代碼
- Android時(shí)間選擇器、日期選擇器實(shí)現(xiàn)代碼
- Android基于wheelView實(shí)現(xiàn)自定義日期選擇器
- Android日期選擇器對(duì)話框DatePickerDialog使用詳解
- Android?studio實(shí)現(xiàn)日期?、時(shí)間選擇器與進(jìn)度條
相關(guān)文章
android 復(fù)制 粘貼 剪切功能應(yīng)用
網(wǎng)上有很多android 復(fù)制 粘貼 剪切功能的文章,只是放到自己的程序中不知道如何處理,現(xiàn)在尋得一可行方法,需要的朋友可以參考下2012-11-11Android?14新功能HighLights快速實(shí)現(xiàn)文本高亮
這篇文章主要為大家介紹了Android?14新功能HighLights快速實(shí)現(xiàn)文本高亮示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-03-03Android利用SAX對(duì)XML進(jìn)行增刪改查操作詳解
在項(xiàng)目中會(huì)遇到對(duì)于XML的增刪改查,下面這篇文章主要給大家介紹了關(guān)于Android利用SAX對(duì)XML進(jìn)行增刪改查操作的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧。2018-01-01Android應(yīng)用程序轉(zhuǎn)到后臺(tái)并回到前臺(tái)判斷方法
這篇文章主要介紹了Android應(yīng)用程序轉(zhuǎn)到后臺(tái)并回到前臺(tái)判斷方法的相關(guān)資料,需要的朋友可以參考下2016-11-11Flutter學(xué)習(xí)教程之Route跳轉(zhuǎn)以及數(shù)據(jù)傳遞
這篇文章主要給大家介紹了關(guān)于Flutter學(xué)習(xí)教程之Route跳轉(zhuǎn)以及數(shù)據(jù)傳遞的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家學(xué)習(xí)或者使用Flutter具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-08-08Android中RecyclerView點(diǎn)擊Item設(shè)置事件
這篇文章主要介紹了Android中RecyclerView點(diǎn)擊Item設(shè)置事件的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-07-07Android下拉阻尼效果實(shí)現(xiàn)原理及簡(jiǎn)單實(shí)例
這篇文章主要為大家詳細(xì)介紹了Android下拉阻尼效果實(shí)現(xiàn)原理及簡(jiǎn)單實(shí)例,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-06-06