package com.hdl.widget; import android.annotation.SuppressLint; 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.Path; import android.graphics.PorterDuff; import android.graphics.PorterDuffXfermode; import android.graphics.RectF; import android.graphics.Shader; import android.os.Bundle; import android.os.Parcelable; import android.util.AttributeSet; import android.util.TypedValue; import android.view.MotionEvent; import android.view.View; import com.hdl.widgetxm.R; import static android.view.MotionEvent.ACTION_CANCEL; import static android.view.MotionEvent.ACTION_DOWN; import static android.view.MotionEvent.ACTION_MOVE; import static android.view.MotionEvent.ACTION_UP; /** * Created by JLChen on 2019/9/3 */ public class HDLWaveSeekBar extends View { private static final int DEFAULT_WAVE_BORDER_COLOR = 0xFF495780; // private static final int DEFAULT_WAVE_COLOR = 0xFFFC5733; private static final int DEFAULT_WAVE_COLOR = 0xFFFD692E; private static final int DEFAULT_WAVE_END_COLOR = 0xFFFB3140; private static final int DEFAULT_EDGE_LENGTH = 200; // 默认宽高 private Paint mBorderPaint;//圆形进度框画笔 private Paint circlePaint;//圆形进度框画笔 private Paint wavePaint;//绘制波浪画笔 private Path wavePath;//绘制波浪Path private Paint mTextPaint; //进度文字显示内容 // private Paint secondWavePaint;//绘制第二个波浪的画笔 private Bitmap bitmap;//缓存bitmap private Canvas bitmapCanvas; private float waveWidth;//波浪宽度 private float waveHeight;//波浪高度 private int waveNum;//波浪组的数量（一次起伏为一组） private float waveMovingDistance;//波浪平移的距离 private float defaultSize;//自定义View默认的宽高 private float mPercent;//进度条占比 private int mProgress;//可以更新的进度条数值 // private int waveColor;//波浪颜色 // private int secondWaveColor;//第二层波浪颜色 private int bgColor;//背景进度颜色 private int mBorderColor; //背景边框框颜色 private float mBorderWidth; //背景边框框宽度 private int mPadding = 10; private boolean isClickable = true; private float mSeekBarWidth; private float mSeekBarHeight; private float mWaveViewWidth;//重新测量后View实际的宽 private float mWaveViewHeight;//重新测量后View实际的高 private int mMaxValue; // 最大数值 private int mMinValue; // 最小数值 private float mCenterX; // 圆弧 SeekBar 中心点 X private float mCenterY; // 圆弧 SeekBar 中心点 Y private String mProgressBarUnitSring; //进度单位符号 private static final String DEFAULT_ARC_PROGRESS_BAR_UNIT_STRING = "%"; // 默认显示单位 private float mWaveLeftAndTop,mWaveRight,mWaveBottom; private float mBorderLeftAndTop; private boolean isProgressTextShow = true; private int mCornerRadius; //圆角半径大小 private boolean isDrawSecondWave; private float nowY; private int[] mArcProgressBarColors; // 当前进度渐变颜色数组 public HDLWaveSeekBar(Context context) { this(context, null); } public HDLWaveSeekBar(Context context, AttributeSet attrs) { this(context, attrs, 0); } public HDLWaveSeekBar(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); setSaveEnabled(true); setLayerType(LAYER_TYPE_SOFTWARE, null); initAttrs(context, attrs); initData(); initPaint(); } private void initData() { defaultSize = dp2px(100); mBorderWidth = dp2px(2); mPadding = dp2px(10); waveNum =(int) Math.ceil(Double.parseDouble(String.valueOf(defaultSize / waveWidth / 2))); waveMovingDistance = 0; mPercent = 0.0f; mProgress = 0; isDrawSecondWave = false; mMaxValue = 100; mMinValue = 0; mCornerRadius = dp2px(10); mProgressBarUnitSring = DEFAULT_ARC_PROGRESS_BAR_UNIT_STRING; isProgressTextShow = true; mArcProgressBarColors = new int[]{DEFAULT_WAVE_COLOR,DEFAULT_WAVE_END_COLOR}; } private void initPaint() { wavePath = new Path(); wavePaint = new Paint(); wavePaint.setColor(DEFAULT_WAVE_COLOR); wavePaint.setAntiAlias(true);//设置抗锯齿 wavePaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN)); // secondWavePaint = new Paint(); // secondWavePaint.setColor(secondWaveColor); // secondWavePaint.setAntiAlias(true);//设置抗锯齿 // secondWavePaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_ATOP));//因为要覆盖在第一层波浪上，且要让半透明生效，所以选此模式 circlePaint = new Paint(); circlePaint.setColor(bgColor); circlePaint.setAntiAlias(true);//设置抗锯齿 mBorderPaint = new Paint(); mBorderPaint.setStyle(Paint.Style.STROKE); mBorderPaint.setColor(mBorderColor); mBorderPaint.setAntiAlias(true);//设置抗锯齿 mBorderPaint.setStrokeWidth(mBorderWidth); initTextPanit(); } // 初始化拖动按钮顶部文字画笔和进度圆弧画笔 private void initTextPanit() { mTextPaint = new Paint(); mTextPaint.setAntiAlias(true); mTextPaint.setStrokeWidth(1); mTextPaint.setTextSize(getTextSizeDip(20)); mTextPaint.setColor(Color.BLACK); mTextPaint.setTextAlign(Paint.Align.CENTER); } // public HDLWaveSeekBar(Context context, @Nullable AttributeSet attrs) { // super(context, attrs); // init(context,attrs); // } private void initAttrs(Context context,AttributeSet attrs){ TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.HDLWaveSeekBar); waveWidth = typedArray.getDimension(R.styleable.HDLWaveSeekBar_wave_width, dp2px(80)); waveHeight = typedArray.getDimension(R.styleable.HDLWaveSeekBar_wave_height,dp2px(15)); // waveColor = typedArray.getColor(R.styleable.HDLWaveSeekBar_wave_color, DEFAULT_WAVE_COLOR); // secondWaveColor = typedArray.getColor(R.styleable.HDLWaveSeekBar_second_wave_color,getResources().getColor(R.color.light)); bgColor = typedArray.getColor(R.styleable.HDLWaveSeekBar_wave_bg_color,Color.WHITE); mBorderColor = typedArray.getColor(R.styleable.HDLWaveSeekBar_wave_border_color, DEFAULT_WAVE_BORDER_COLOR); typedArray.recycle(); } private int dp2px(int dp) { return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dp, getContext().getResources().getDisplayMetrics()); } private float getTextSizeDip(float value) { return TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, value, getResources().getDisplayMetrics()); } private void onWaveSizeChange(){ mWaveViewWidth = mSeekBarWidth - mPadding*4 - mBorderWidth*2; mWaveViewHeight = mSeekBarHeight - mPadding*4 - mBorderWidth*2; mWaveLeftAndTop = mPadding*2 + mBorderWidth; mWaveRight = mSeekBarWidth - mPadding*2 - mBorderWidth; mWaveBottom = mSeekBarHeight - mPadding*2 - mBorderWidth; mBorderLeftAndTop = mPadding + mBorderWidth/2; waveNum = (int) Math.ceil(Double.parseDouble(String.valueOf(mWaveViewWidth / waveWidth / 2))); } @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec); int ws = MeasureSpec.getSize(widthMeasureSpec); //取出宽度的确切数值 int wm = MeasureSpec.getMode(widthMeasureSpec); //取出宽度的测量模式 int hs = MeasureSpec.getSize(heightMeasureSpec); //取出高度的确切数值 int hm = MeasureSpec.getMode(heightMeasureSpec); //取出高度的测量模 if (wm == MeasureSpec.UNSPECIFIED) { wm = MeasureSpec.EXACTLY; ws = dp2px(DEFAULT_EDGE_LENGTH); } else if (wm == MeasureSpec.AT_MOST) { wm = MeasureSpec.EXACTLY; ws = Math.min(dp2px(DEFAULT_EDGE_LENGTH), ws); } if (hm == MeasureSpec.UNSPECIFIED) { hm = MeasureSpec.EXACTLY; hs = dp2px(DEFAULT_EDGE_LENGTH); } else if (hm == MeasureSpec.AT_MOST) { hm = MeasureSpec.EXACTLY; hs = Math.min(dp2px(DEFAULT_EDGE_LENGTH), hs); } setMeasuredDimension(MeasureSpec.makeMeasureSpec(ws, wm), MeasureSpec.makeMeasureSpec(hs, hm)); mSeekBarHeight = hs; mSeekBarWidth = ws; mCenterX = mSeekBarWidth/2; mCenterY = mSeekBarHeight/2; onWaveSizeChange(); } private int measureSize(int defaultSize,int measureSpec) { int result = defaultSize; int specMode = MeasureSpec.getMode(measureSpec); int specSize = MeasureSpec.getSize(measureSpec); if (specMode == MeasureSpec.EXACTLY) { result = specSize; } else if (specMode == MeasureSpec.AT_MOST) { result = Math.min(result, specSize); } return result; } @Override protected void onSizeChanged(int w, int h, int oldw, int oldh) { super.onSizeChanged(w, h, oldw, oldh); // 计算在当前大小下,内容应该显示的大小和起始位置 int safeW = w - getPaddingLeft() - getPaddingRight(); int safeH = h - getPaddingTop() - getPaddingBottom(); mSeekBarHeight = safeH; mSeekBarWidth = safeW; mCenterX = mSeekBarWidth/2; mCenterY = mSeekBarHeight/2; onWaveSizeChange(); // Log.i("getCurrentProgress ","mSeekBarHeight :Y " + mSeekBarHeight + " mSeekBarWidth:"+mSeekBarWidth); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); canvas.save(); //画圆角矩形 RectF rectF = new RectF(mBorderLeftAndTop, mBorderLeftAndTop, mSeekBarWidth - mBorderLeftAndTop, mSeekBarHeight-mBorderLeftAndTop); canvas.drawRoundRect(rectF, mCornerRadius, mCornerRadius, mBorderPaint); // //画圆角矩形 // RectF rectF2 = new RectF(10, 10, mWaveViewWidth-20, mWaveViewWidth-20); // canvas.drawRoundRect(rectF2, 80, 80, circlePaint); // canvas.drawPath(getWavePath(),wavePaint); // canvas.restore(); bitmap = Bitmap.createBitmap((int)mSeekBarWidth, (int)mSeekBarHeight, Bitmap.Config.ARGB_8888); bitmapCanvas = new Canvas(bitmap); RectF rectF2 = new RectF(mWaveLeftAndTop, mWaveLeftAndTop, mWaveRight, mWaveBottom); bitmapCanvas.drawRoundRect(rectF2, mCornerRadius, mCornerRadius, circlePaint); resetmArcProgressBarColor();//实现渐变效果 // bitmapCanvas.drawCircle(mWaveViewWidth/2, mWaveViewWidth/2, mWaveViewWidth/2, circlePaint); bitmapCanvas.drawPath(getWavePath(), wavePaint); // if(isDrawSecondWave){ // bitmapCanvas.drawPath(getSecondWavePath(),secondWavePaint); // } canvas.drawBitmap(bitmap, 0, 0, null); if(isProgressTextShow) { if(mPercent>0.6){ mTextPaint.setColor(Color.WHITE); }else { mTextPaint.setColor(Color.BLACK); } canvas.drawText(String.valueOf(getProgress()) + mProgressBarUnitSring, mCenterX, mCenterY, mTextPaint); } canvas.restore(); } /** * 重置 mArcProgressBarColors 颜色 */ private void resetmArcProgressBarColor() { LinearGradient gradient = new LinearGradient(mBorderLeftAndTop, mBorderLeftAndTop, mSeekBarWidth - mBorderLeftAndTop, mSeekBarHeight-mBorderLeftAndTop, mArcProgressBarColors, null, Shader.TileMode.MIRROR); wavePaint.setShader(gradient); } //--- 初始化结束 ------------------------------------------------------------------------------- //--- 状态存储 --------------------------------------------------------------------------------- private static final String KEY_PROGRESS_PRESENT = "PRESENTWAVE"; // 用于存储和获取当前百分比 @Override protected Parcelable onSaveInstanceState() { Bundle bundle = new Bundle(); bundle.putParcelable("superState", super.onSaveInstanceState()); bundle.putFloat(KEY_PROGRESS_PRESENT, mProgress); return bundle; } @Override protected void onRestoreInstanceState(Parcelable state) { if (state instanceof Bundle) { Bundle bundle = (Bundle) state; this.mProgress = bundle.getInt(KEY_PROGRESS_PRESENT); state = bundle.getParcelable("superState"); } if (null != mOnProgressChangeListener) { mOnProgressChangeListener.onProgressChanged(this, this.mProgress, false); } super.onRestoreInstanceState(state); } //--- 状态存储结束 ----------------------------------------------------------------------------- private Path getWavePath(){ // float changeWaveHeight = (1 - mPercent) * waveHeight; float changeWaveHeight = waveHeight; nowY = (1-mPercent)*mWaveViewHeight + mWaveLeftAndTop; wavePath.reset(); //移动到右上方，也就是p0点 wavePath.moveTo(mWaveRight, nowY); //移动到右下方，也就是p1点 wavePath.lineTo(mWaveRight, mWaveBottom); //移动到左下边，也就是p2点 wavePath.lineTo(mWaveLeftAndTop, mWaveBottom); //移动到左上方，也就是p3点 //wavePath.lineTo(0, (1-mPercent)*mWaveViewWidth); // wavePath.lineTo(-waveMovingDistance, (1-mPercent)*mSeekBarHeight); if(mPercent == 0 || mPercent ==1){ wavePath.lineTo(mWaveLeftAndTop, nowY); }else { wavePath.lineTo(-waveMovingDistance, nowY); //从p3开始向p0方向绘制波浪曲线 for (int i = 0; i < waveNum * 2; i++) { wavePath.rQuadTo(waveWidth / 2, changeWaveHeight, waveWidth, 0); wavePath.rQuadTo(waveWidth / 2, -changeWaveHeight, waveWidth, 0); } } //将path封闭起来 wavePath.close(); return wavePath; } private boolean mCanDrag = false; // 是否允许拖动 private boolean moved = false; // 是否允许 private int lastProgress = -1; @SuppressLint("ClickableViewAccessibility") @Override public boolean onTouchEvent(MotionEvent event) { super.onTouchEvent(event); if(!isClickable) return false; int action = event.getActionMasked(); switch (action) { case ACTION_DOWN: moved = false; judgeCanDrag(event); if (null != mOnProgressChangeListener) { mOnProgressChangeListener.onStartTrackingTouch(this); } break; case ACTION_MOVE: if (!mCanDrag) { break; } setCurrentPercent(event); // 事件回调 if (null != mOnProgressChangeListener && mProgress != lastProgress) { mOnProgressChangeListener.onProgressChanged(this, mProgress, true); lastProgress = mProgress; } moved = true; break; case ACTION_UP: case ACTION_CANCEL: if(!moved){ if (isInArcProgress(event.getX(),event.getY())) { setCurrentPercent(event); } } if (null != mOnProgressChangeListener) { mOnProgressChangeListener.onStopTrackingTouch(this); } break; } invalidate(); return true; } // 判断是否允许拖动 private void judgeCanDrag(MotionEvent event) { if(isInArcProgress(event.getX(),event.getY())){ mCanDrag = true; }else { mCanDrag = false; } } private void setCurrentPercent(MotionEvent event) { // Log.i("getCurrentProgress ","getCurrentProgress :Y " + event.getY() + " X:"+event.getX()); float progressY = event.getY() - mWaveLeftAndTop; float progress = progressY /mWaveViewHeight; progress = 1 - progress; if (progress < 0) progress = 0; if (progress > 1) progress = 1; mPercent = progress; mProgress = (int) (mPercent * (mMaxValue - mMinValue)) + mMinValue; waveMovingDistance = mPercent * 500; // Log.i("getCurrentProgress ","getCurrentProgress :mProgress " + mProgress); } private boolean isInArcProgress(float px ,float py) { if(px < 0 || px > mSeekBarWidth || py < 0 || py > mSeekBarHeight){ return false; }else { return true; } } // endregion ----------------------------------------------------------------------------------- // region 状态回调 ------------------------------------------------------------------------------ private HDLWaveSeekBar.OnProgressChangeListener mOnProgressChangeListener; public void setOnProgressChangeListener(HDLWaveSeekBar.OnProgressChangeListener onProgressChangeListener) { mOnProgressChangeListener = onProgressChangeListener; } public interface OnProgressChangeListener { /** * 进度发生变化 * * @param seekBar 拖动条 * @param progress 当前进度数值 * @param isUser 是否是用户操作, true 表示用户拖动, false 表示通过代码设置 */ void onProgressChanged(HDLWaveSeekBar seekBar, int progress, boolean isUser); /** * 用户开始拖动 * * @param seekBar 拖动条 */ void onStartTrackingTouch(HDLWaveSeekBar seekBar); /** * 用户结束拖动 * * @param seekBar 拖动条 */ void onStopTrackingTouch(HDLWaveSeekBar seekBar); } // endregion ----------------------------------------------------------------------------------- //****************************对外接口**************************************************** /** * 设置控件是否可用点击 * @param isClickable */ public void setIsClickable(boolean isClickable) { this.isClickable = isClickable; } public int getProgress() { return mProgress; } public void setProgress(int progress) { System.out.println("setProgress = " + progress); if (progress > mMaxValue) progress = mMaxValue; if (progress < mMinValue) progress = mMinValue; mProgress = progress; mPercent = (progress - mMinValue) * 1.0f / (mMaxValue - mMinValue); // System.out.println("setProgress present = " + progress); // if (null != mOnProgressChangeListener) { // mOnProgressChangeListener.onProgressChanged(this, progress, false); // } postInvalidate(); } /** * 进度文字大小 * @param textSize */ public void setProgressTextSize(int textSize){ mTextPaint.setTextSize(getTextSizeDip(textSize)); } /** * 进度文字颜色 * @param textPaintColor */ public void setProgressTextColor(int textPaintColor){ mTextPaint.setColor(textPaintColor); } /** * 设置进度显示值单位 * * @param progressBarUnitSring 进度显示值单位 */ public void setProgressBarUnitSring(String progressBarUnitSring) { mProgressBarUnitSring = progressBarUnitSring; } /** * 设置最大数值 * * @param max 最大数值 */ public void setMaxValue(int max) { mMaxValue = max; } /** * 设置最小数值 * * @param min 最小数值 */ public void setMinValue(int min) { mMinValue = min; } public void setBorderWidth(int borderWidth) { // mBorderWidth = dp2px(borderWidth); mBorderWidth = borderWidth; mBorderPaint.setStrokeWidth(mBorderWidth); onWaveSizeChange(); postInvalidate(); } // // public void setWaveColor(int mWaveColor){ // waveColor = mWaveColor; // wavePaint.setColor(waveColor); // // } /** * 设置颜色 * 3个颜色 渐变效果 * @param colors 颜色 */ public void setProgressBarColors(int[] colors) { if(colors.length < 2) return; mArcProgressBarColors = colors; resetmArcProgressBarColor(); postInvalidate(); } /** * 设置颜色 单种颜色 * @param colors 颜色 */ public void setProgressBarColor(int colors) { int[] colorsArray = new int[]{colors, colors}; mArcProgressBarColors = colorsArray; resetmArcProgressBarColor(); postInvalidate(); } public void setWaveBorderColor(int mmBorderColor){ mBorderColor = mmBorderColor; mBorderPaint.setColor(mBorderColor); } public void setWaveBgColor(int mBgColor){ bgColor = mBgColor; circlePaint.setColor(bgColor); } public void setWavePadding(int mmPadding){ // mPadding = dp2px(mmPadding); mPadding = mmPadding; onWaveSizeChange(); } public void setCornerRadius(int mmCornerRadius){ // mCornerRadius = dp2px(mmCornerRadius); mCornerRadius = mmCornerRadius; } public void setProgressTextShow(boolean progressTextShow) { isProgressTextShow = progressTextShow; } /** *当前 进度Y坐标 */ public float getProgressY() { return nowY; } }