Android中制作進(jìn)度框和環(huán)形進(jìn)度條的簡(jiǎn)單實(shí)例分享
進(jìn)度框
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.View;
import java.util.Random;
public class ObliqueProgressbar extends View {
private Paint mPaint;
private float mProgress;
public ObliqueProgressbar(Context context) {
this(context, null);
}
public ObliqueProgressbar(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public ObliqueProgressbar(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
mPaint = new Paint();
mPaint.setAntiAlias(true);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
if (mProgress == 0) return;
//碎片雨
mPaint.setColor(Color.parseColor("#a96ecb"));
mPaint.setStrokeWidth(3);
Random random = new Random();
int sx, sy;
for (int i = 0; i < 200; i++) {
sx = random.nextInt(getWidth() + 10);
sy = random.nextInt(getHeight() + 10);
// canvas.drawLine(sx, sy, sx+random.nextInt(5), sy+random.nextInt(5), mPaint);
canvas.drawCircle(sx, sy, random.nextInt(5) + 1, mPaint);
}
//進(jìn)度
mPaint.setColor(Color.parseColor("#6AFFFFFF"));
mPaint.setStrokeWidth(15);
float x = mProgress * getWidth();
for (int i = 0; i < x; i += 30) {
canvas.drawLine(i - 30, -10, i + 30, getHeight() + 10, mPaint);
}
}
public void setProgress(float progress) {
this.mProgress = progress;
invalidate();
}
}
環(huán)形進(jìn)度條
先來看一下效果:

下面直接上代碼了:
ckage com.stone.circleprogressbar.view;
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.LinearGradient;
import android.graphics.Paint;
import android.graphics.RectF;
import android.graphics.Shader;
import android.util.AttributeSet;
import android.view.View;
import com.stone.circleprogressbar.R;
public class CircleProgressbar extends View {
private float mProgress;
private int mBarColor;
private int mTextColor;
private float mTextSize;
public CircleProgressbar(Context context) {
this(context, null);
}
public CircleProgressbar(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public CircleProgressbar(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.CircleProgressbar);
mBarColor = array.getColor(R.styleable.CircleProgressbar_barColor, Color.GRAY);
mTextColor = array.getColor(R.styleable.CircleProgressbar_textColor, Color.GRAY);
mProgress = array.getFloat(R.styleable.CircleProgressbar_progress, 0);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
public void setProgress(float count) {
mProgress = count;
invalidate();
}
@Override
protected void onDraw(Canvas canvas) {
int w = getWidth();
int h = getHeight();
int strokeWidth = 20;
int radius = w / 2 - strokeWidth / 2;//大圓 半徑
Bitmap barBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
Paint paint = new Paint();
paint.setAntiAlias(true); //抗鋸齒
paint.setStrokeWidth(strokeWidth); //描邊寬
paint.setDither(true); //防抖動(dòng)
/* 外邊框 */
Canvas circleCanvas = new Canvas(barBitmap);
RectF rect = new RectF(0, 0, w, h);
paint.setColor(Color.argb(0x11, 0xcc, 0xcc, 0xcc));
// circleCanvas.drawRect(rect, paint); //沒啥用 只是看外邊框的
/* 內(nèi)圓 */
paint.setColor(Color.CYAN);
paint.setShader(new LinearGradient(0, 0, w, h, Color.RED, Color.GREEN, Shader.TileMode.CLAMP));
circleCanvas.drawCircle(w / 2, h / 2, radius - strokeWidth / 2, paint);
paint.setShader(null);
/* 外圓 */
paint.setColor(mBarColor);
paint.setStyle(Paint.Style.STROKE);
circleCanvas.drawCircle(w / 2, h / 2, radius, paint);
/* 圓弧 */
paint.setShader(new LinearGradient(0, 0, w, h,
new int[]{Color.GREEN, Color.MAGENTA, Color.CYAN, Color.RED},
new float[]{0.2f, 0.5f, 0.7f, 1.0f}, Shader.TileMode.CLAMP));
float cur = mProgress * 360 * 0.01f;
circleCanvas.drawArc(new RectF(strokeWidth / 2, strokeWidth / 2, w - strokeWidth / 2, h - strokeWidth / 2),
360 - 45, cur, false, paint);
paint.setShader(null);
/* 文本 */
paint.setColor(mTextColor);
if (mTextSize == 0) {
calcTextSize(paint, w, strokeWidth);
} else {
paint.setTextSize(mTextSize);
}
paint.setTextAlign(Paint.Align.LEFT);//default
String percent = mProgress + "%";
paint.setStyle(Paint.Style.FILL);
circleCanvas.drawText(percent, w / 2 - paint.measureText(percent) / 2, h / 2 + paint.getTextSize() / 2, paint);
canvas.drawBitmap(barBitmap, 0, 0, paint);
}
/**
* 計(jì)算并設(shè)置最適合的textSize
*
* @param paint
* @param max 最大寬度
* @param offset 偏移
*/
private void calcTextSize(Paint paint, int max, int offset) {
float width = paint.measureText("99.99%");
while (width < max * 3 / 5) {
paint.setTextSize(paint.getTextSize() + 5);
width = paint.measureText("92.88%") + offset / 2;
}
mTextSize = paint.getTextSize();
}
}
設(shè)置進(jìn)度刷新顯示 調(diào)用 setProgress()即可。
- Android實(shí)現(xiàn)環(huán)形進(jìn)度條
- Android自定義環(huán)形LoadingView效果
- Android自定義View實(shí)現(xiàn)環(huán)形進(jìn)度條的思路與實(shí)例
- Android實(shí)現(xiàn)計(jì)步進(jìn)度的環(huán)形Progress
- Android實(shí)現(xiàn)環(huán)形進(jìn)度條的實(shí)例
- Android實(shí)現(xiàn)環(huán)形進(jìn)度條代碼
- Android應(yīng)用中炫酷的橫向和環(huán)形進(jìn)度條的實(shí)例分享
- Android環(huán)形進(jìn)度條(安卓默認(rèn)形式)實(shí)例代碼
- android自定義環(huán)形對(duì)比圖效果
相關(guān)文章
Android中實(shí)現(xiàn)Runnable接口簡(jiǎn)單例子
這篇文章主要介紹了Android中實(shí)現(xiàn)Runnable接口簡(jiǎn)單例子,著重點(diǎn)在如何實(shí)現(xiàn)run()方法,需要的朋友可以參考下2014-06-06
Android禁止EditText自動(dòng)彈出軟鍵盤的方法及遇到問題
這篇文章主要介紹了Android禁止EditText自動(dòng)彈出軟鍵盤的方法及遇到問題,需要的朋友可以參考下2018-07-07
Android可自定義神奇動(dòng)效的卡片切換視圖實(shí)例
今天小編就為大家分享一篇關(guān)于Android可自定義神奇動(dòng)效的卡片切換視圖實(shí)例,小編覺得內(nèi)容挺不錯(cuò)的,現(xiàn)在分享給大家,具有很好的參考價(jià)值,需要的朋友一起跟隨小編來看看吧2019-02-02
TextView長(zhǎng)按復(fù)制的實(shí)現(xiàn)方法(總結(jié))
下面小編就為大家?guī)硪黄猅extView長(zhǎng)按復(fù)制的實(shí)現(xiàn)方法(總結(jié))。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-04-04
Android實(shí)現(xiàn)圖片上傳蒙層進(jìn)度條
這篇文章主要為大家詳細(xì)介紹了Android實(shí)現(xiàn)圖片上傳蒙層進(jìn)度條,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-09-09
Kotlin?Flow數(shù)據(jù)流的3種使用場(chǎng)景詳解
這篇文章主要為大家詳細(xì)介紹了Kotlin中Flow數(shù)據(jù)流的幾種使用場(chǎng)景,文中的示例代碼講解詳細(xì),具有一定的借鑒價(jià)值,需要的可以參考一下2023-04-04
Android編程實(shí)現(xiàn)抽屜效果的方法詳解
這篇文章主要介紹了Android編程實(shí)現(xiàn)抽屜效果的方法,結(jié)合具體實(shí)例形式分析了Android實(shí)現(xiàn)抽屜效果的具體步驟與相關(guān)操作技巧,需要的朋友可以參考下2017-05-05

