android實(shí)現(xiàn)簡(jiǎn)單儀表盤效果
本文實(shí)例為大家分享了android實(shí)現(xiàn)簡(jiǎn)單儀表盤效果的具體代碼,供大家參考,具體內(nèi)容如下
實(shí)現(xiàn)這個(gè)效果:

中間的文字很好寫(xiě),外層的進(jìn)度條就需要自定義控件了,代碼如下:
public class CirCleProgressBar extends View { private Paint circlePaint; private Paint textPaint; private int circleColor;//圓弧顏色 private int circleBgColor;//圓弧背景顏色 private float circleWidth;//圓弧寬度 private float circleBgWidth;//圓弧背景寬度 private int textColor;//字體顏色 private float textSize;//字體大小 private int totalAngle;//總角度 private int startAngle;//開(kāi)始角度 private float currentProgress;//當(dāng)前進(jìn)度 private float maxProgress;//最大進(jìn)度 private float section;//分段 private float currentAngle;//當(dāng)前角度 private float lastAngle; private ValueAnimator progressAnimator;//圓弧動(dòng)畫(huà) private int duration = 1000;//動(dòng)畫(huà)時(shí)長(zhǎng) private boolean isDefaultText;//是否設(shè)置文字顯示的值 private String mTextValue;//字體顯示的值 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);circlePaint = new Paint();textPaint = new Paint();TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.CirCleProgressBar);circleColor = typedArray.getColor(R.styleable.CirCleProgressBar_circle_color, Color.RED);circleBgColor = typedArray.getColor(R.styleable.CirCleProgressBar_circle_bg_color, Color.YELLOW);circleWidth = typedArray.getDimension(R.styleable.CirCleProgressBar_circle_width, 2);circleBgWidth = typedArray.getDimension(R.styleable.CirCleProgressBar_circle_bg_width, 2);textColor = typedArray.getColor(R.styleable.CirCleProgressBar_text_color, Color.BLUE);textSize = typedArray.getDimension(R.styleable.CirCleProgressBar_text_size, 10);totalAngle = typedArray.getInteger(R.styleable.CirCleProgressBar_total_angle, 360);startAngle = typedArray.getInteger(R.styleable.CirCleProgressBar_start_angle, 0);currentProgress = typedArray.getFloat(R.styleable.CirCleProgressBar_current_progress, 0);maxProgress = typedArray.getFloat(R.styleable.CirCleProgressBar_max_progress, 100);setCurrentProgress(currentProgress);setMaxProgress(maxProgress);//typedArray.recycle(); } @SuppressLint('DrawAllocation') @Override protected void onDraw(Canvas canvas) {super.onDraw(canvas);/** * 畫(huà)最外層的大圓環(huán) */int centre = getWidth() / 2; // 獲取圓心的x坐標(biāo)int radius = (int) (centre - circleWidth / 2) - 2; // 圓環(huán)的半徑circlePaint.setColor(circleBgColor);circlePaint.setStyle(Paint.Style.STROKE);circlePaint.setAntiAlias(true);circlePaint.setStrokeCap(Paint.Cap.ROUND);// 圓頭circlePaint.setStrokeWidth(circleBgWidth);RectF oval = new RectF(centre - radius - 1, centre - radius - 1, centre + radius + 1, centre + radius + 1); // 用于定義的圓弧的形狀和大小的界限//背景圓canvas.drawArc(oval, startAngle, totalAngle, false, circlePaint);//數(shù)據(jù)圓circlePaint.setStrokeWidth(circleWidth);circlePaint.setColor(circleColor);canvas.drawArc(oval, startAngle, currentAngle, false, circlePaint);//textPaint.setAntiAlias(true);textPaint.setColor(textColor);textPaint.setTextSize(textSize);float textWidth = textPaint.measureText((int) currentProgress + '');if(!isDefaultText) { canvas.drawText(String.valueOf((int)currentProgress), centre - textWidth / 2, centre + textSize / 2, textPaint);}else { canvas.drawText(mTextValue, centre - textWidth / 2, centre + textSize / 2, textPaint);}//invalidate(); } public float getMaxProgress(){return maxProgress; } public void setMaxProgress(float maxProgress){if(maxProgress < 0){ throw new IllegalArgumentException('max not less than 0');}this.maxProgress = maxProgress;section = totalAngle / maxProgress; } public void setAnimationDuration(int duration){this.duration = duration; } public void setCurrentProgress(float progress){if(progress >= 0){ this.currentProgress = progress; if(progress > maxProgress){progress = maxProgress; } lastAngle = currentAngle; setAnimation(lastAngle, progress * section, duration);} } private void setAnimation(float last, float current, int duration){progressAnimator = ValueAnimator.ofFloat(last, current);progressAnimator.setDuration(duration);progressAnimator.setTarget(currentAngle);progressAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator valueAnimator) {currentAngle = (float) valueAnimator.getAnimatedValue();currentProgress = currentAngle / section; }});progressAnimator.start(); } public int getCircleColor() {return circleColor; } public void setCircleColor(int circleColor) {this.circleColor = circleColor; } public int getCircleBgColor() {return circleBgColor; } public void setCircleBgColor(int circleBgColor) {this.circleBgColor = circleBgColor; } public float getCircleWidth() {return circleWidth; } public void setCircleWidth(float circleWidth) {this.circleWidth = circleWidth; } public float getCircleBgWidth() {return circleBgWidth; } public void setCircleBgWidth(float circleBgWidth) {this.circleBgWidth = circleBgWidth; } public int getTextColor() {return textColor; } public void setTextColor(int textColor) {this.textColor = textColor; } public float getTextSize() {return textSize; } public void setTextSize(float textSize) {this.textSize = textSize; } /** * @param isText 為true,自定義設(shè)置字體顯示 * @param text */ public void setText(boolean isText,String text){isDefaultText = isText;mTextValue = text; }}
需要在attrs中添加:
<declare-styleable name='CirCleProgressBar'><attr name='circle_color' format='color'/><attr name='circle_bg_color' format='color'/><attr name='circle_width' format='dimension'/><attr name='circle_bg_width' format='dimension'/><attr name='text_color' format='color'/><attr name='text_size' format='dimension'/><attr name='total_angle' format='integer'/><attr name='start_angle' format='integer'/><attr name='current_progress' format='float'/><attr name='max_progress' format='float'/></declare-styleable>
使用方法:
在布局文件中直接引用
<com.fm.newcinema.view.CirCleProgressBarandroid: android:layout_width='139dp'android:layout_height='99dp'android:layout_gravity='center_horizontal'android:layout_marginTop='8dp'app:circle_bg_color='@color/gray_line_ff'app:circle_bg_width='10dp'app:circle_color='@color/main_blue'app:circle_width='10dp'app:max_progress='100'app:start_angle='160'app:text_color='@color/white_ff'app:text_size='@dimen/size_30px'app:total_angle='221'/>
其中app:circle_bg_color表示進(jìn)度條底層的顏色,app:circle_color表示進(jìn)度條上層的顏色,app:circle_bg_width表示進(jìn)度條底層的寬度,app:circle_width表示進(jìn)度條上層的寬度,app:max_progress='100'表示進(jìn)度條最大進(jìn)度是100,app:start_angle表示開(kāi)始的角度,就是進(jìn)度條從哪個(gè)角度開(kāi)始畫(huà),如下圖所示

app:total_angle表示整個(gè)進(jìn)度條所需的角度.在代碼中設(shè)置旋轉(zhuǎn)的角度,圖中進(jìn)度為30%,由于在布局文件中設(shè)置的最大進(jìn)度是100`app:max_progress='100',所以進(jìn)行如下設(shè)置peocess.setCurrentProgress(30f)默認(rèn)情況下,進(jìn)度條中間顯示進(jìn)度條的值,如果需要自己寫(xiě)值的畫(huà),調(diào)用這個(gè)方法:process.setText(true, '中間的字');
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持好吧啦網(wǎng)。
相關(guān)文章:
1. python中文本字符處理的簡(jiǎn)單方法記錄2. 資深程序員:給Python軟件開(kāi)發(fā)測(cè)試的25個(gè)忠告!3. Python-openpyxl表格讀取寫(xiě)入的案例詳解4. PHP laravel實(shí)現(xiàn)導(dǎo)出PDF功能5. ASP基礎(chǔ)知識(shí)Command對(duì)象講解6. 使用Blazor框架實(shí)現(xiàn)在前端瀏覽器中導(dǎo)入和導(dǎo)出Excel7. JavaScript實(shí)現(xiàn)留言板實(shí)戰(zhàn)案例8. 如何在python中執(zhí)行另一個(gè)py文件9. vscode運(yùn)行php報(bào)錯(cuò)php?not?found解決辦法10. 如何從Python的cmd中獲得.py文件參數(shù)

網(wǎng)公網(wǎng)安備