Android(安卓)自定义控件一 带圆形进度的按钮 ControlButton2
16lz
2021-01-26
效果图
图片展示的是中间的图案ImageView和下面一层自定义控件的效果
每次点击都会有一个圆形滚动进度条出现
开始背景黑色，点击后进度条开始滚动，100%时背景变蓝持续一定时间后回复初始
代码实现
package com.demo.ui.view;import android.annotation.SuppressLint;import android.content.Context;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.Paint.Style;import android.graphics.RectF;import android.graphics.SweepGradient;import android.os.Handler;import android.os.Message;import android.view.View;public class ControlButton2 extends View{ private static final String TAG = "CircleProgressBar"; private int mMaxProgress = 3000; private int mProgress = 0; private final int mCircleLineStrokeWidth = 4; private final int mTxtStrokeWidth = 2; // 画圆所在的距形区域 private final RectF mRectF; private final Paint mPaint; private final Paint mPaintCircle; private final Context mContext; private String mTxtHint1; private String mTxtHint2; private SweepGradient mSweepGradient; private CBOnTriggerListener cbOnTriggerListener; private boolean hasTrigle =false; public boolean isControlButtonRun = false; public int circleBackColor = 0xe518151E;//0xFF006CFF public int cicleColor = 0xFF0586FB; private Runnable runnable; private Runnable Stoprunnable; private Handler handler = new Handler(){ @Override public void handleMessage(Message msg) { super.handleMessage(msg); } }; public ControlButton2(Context context) { super(context); mContext = context; mRectF = new RectF(); mPaint = new Paint(); mPaintCircle = new Paint(); runnable = new Runnable() { public void run() { //sendContinueMessage(); mProgress += 20; setProgress(mProgress); handler.postDelayed(this, 20); if(mProgress == 3000){ stop(controlSuccess); } } }; Stoprunnable = new Runnable() { public void run() { mProgress += 160; setProgress(mProgress); handler.postDelayed(this, 10); if(mProgress >= 3000){ hasTrigle = true; stop(controlSuccess); } } }; } @SuppressLint("DrawAllocation") @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); int width = this.getWidth(); int height = this.getHeight(); //canvas.drawColor(0xFFFFFF00); mSweepGradient = new SweepGradient(width/2, height/2, new int[] {cicleColor,cicleColor,cicleColor,cicleColor,cicleColor}, null); if (width != height) { int min = Math.min(width, height); width = min; height = min; } // 设置画笔相关属性 mPaint.setAntiAlias(true); mPaint.setColor(Color.rgb(0xe9, 0xe9, 0xe9)); canvas.drawColor(Color.TRANSPARENT); mPaint.setStrokeWidth(mCircleLineStrokeWidth); mPaint.setStyle(Style.STROKE); // 位置 mRectF.left = mCircleLineStrokeWidth / 2; // 左上角x mRectF.top = mCircleLineStrokeWidth / 2; // 左上角y mRectF.right = width - mCircleLineStrokeWidth / 2; // 左下角x mRectF.bottom = height - mCircleLineStrokeWidth / 2; // 右下角y // 绘制圆圈，进度条背景 //canvas.drawArc(mRectF, -90, 360, false, mPaint); //mPaint.setColor(Color.rgb(0xf8, 0x60, 0x30)); canvas.rotate(0, width / 2, height / 2); mPaint.setShader(mSweepGradient); canvas.drawArc(mRectF,-90, ((float) mProgress / mMaxProgress) * 360, false, mPaint); mPaintCircle.setColor(circleBackColor); mPaintCircle.setAntiAlias(true); mPaintCircle.setStyle(Style.FILL); canvas.drawCircle( width / 2, height / 2,(width / 2)-mCircleLineStrokeWidth,mPaintCircle); } public int getMaxProgress() { return mMaxProgress; } public void setMaxProgress(int maxProgress) { this.mMaxProgress = maxProgress; } public void setProgress(int progress) { this.mProgress = progress; this.invalidate(); } public int getmProgress() { return mProgress; } public void setProgressNotInUiThread(int progress) { this.mProgress = progress; this.postInvalidate(); } public String getmTxtHint1() { return mTxtHint1; } public void setmTxtHint1(String mTxtHint1) { this.mTxtHint1 = mTxtHint1; } public String getmTxtHint2() { return mTxtHint2; } public void setmTxtHint2(String mTxtHint2) { this.mTxtHint2 = mTxtHint2; } public void setCBOnTriggerListener(CBOnTriggerListener listener) { cbOnTriggerListener = listener; } public interface CBOnTriggerListener { void trigger(); } public void start(){ cicleColor = 0xFF0586FB; if(!isControlButtonRun){ isControlButtonRun = true; handler.postDelayed(runnable,0); } } boolean controlSuccess = true; int controlTimeDelay = 3000; public void stop(boolean controlSuccess) { this.controlSuccess = controlSuccess; handler.removeCallbacks(runnable); handler.postDelayed(Stoprunnable,0); if(controlSuccess){ cicleColor = 0xFF0586FB;//0xFF006CFF controlTimeDelay = 3000; }else{ cicleColor = 0xFFFF0000;//0xFF006CFF controlTimeDelay = 6000; } if (cbOnTriggerListener != null){ if(hasTrigle){ hasTrigle = false; cbOnTriggerListener.trigger(); isControlButtonRun = false; setProgress(0); handler.removeCallbacks(Stoprunnable); } } /*new Handler().postDelayed(new Runnable() { @Override public void run() { isControlButtonRun = false; setProgress(0); handler.removeCallbacks(Stoprunnable); } },controlTimeDelay);*/ } public void setCircleBackColor(int circleBackColor) { this.circleBackColor = circleBackColor; invalidate(); } public boolean isControlButtonRun() { return isControlButtonRun; } public void setControlButtonRun(boolean controlButtonRun) { isControlButtonRun = controlButtonRun; }}更多相关文章
- Android仿简书、淘宝等APP View弹出效果
- Android对话框实现
- Android(安卓)L下用XXRadius设置圆角背景图片不能显示
- Android(安卓)给CheckBox设置背景
- android背景图片更换――经典例子
- Android沉浸式状态栏/状态栏设置背景图片/自定义渐变式状态栏
- Android设置PreferenceCategory背景颜色的方法
- Android(安卓)Studio 自定义皮肤主题和背景
- 图片阴影