Android自定义view圆形进度条

来源:互联网 发布:逍遥模拟器修改mac 编辑:程序博客网 时间:2024/05/01 02:59

自定义一个类实现构造方法 重写方法
package test.bwie.com.baixinfei20171009;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.util.TypedValue;
import android.view.View;

import static android.R.attr.x;
import static android.R.attr.y;

/**
* 自定义view
* Created by admin on 2017/10/9.
* 白新飞
*/

public class yuanhuan extends View {

/*private int cWdith;private int ncolor;private int wcolor;private int ccolor;private int textsize;private String text;private int textcolor;private Paint p;*//** * 绘制百分比的圆,一共有四部分,分别是里面的文字、背景圆、默认圆环、开始绘制的圆环; * 思路:首先需要四支画笔, 设置画笔对应的属性等; *//** * 绘制百分比的圆,一共有四部分,分别是里面的文字、背景圆、默认圆环、开始绘制的圆环; * 思路:首先需要四支画笔, 设置画笔对应的属性等; */private Paint roundColorPaint;//外圆画笔private Paint mCirclePaint;//中心园的画笔private Paint mTextPaint;//文字的画笔private Paint mArcPaint;//外圆环的画笔private int mCircleX;//设置圆心x坐标private int mCircleY;//设置圆心y坐标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 roundColor; //外圆环的颜色 第一次画圆的颜色private int mTextSize;//字体大小private int mTextColor;//字体颜色public yuanhuan(Context context) {    super(context);    //初始化数据    init(context);}public yuanhuan(Context context, AttributeSet attrs) {    super(context, attrs);    // 自定义属性,attr    // 使用TypedArray    //自定义属性 values/attr    TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.PercentageRing);    //中间圆的背景颜色  默认 - 白色    mCircleBackground = typedArray.getColor(R.styleable.PercentageRing_circleBackground, 0xffafb4db);    //外圆环的颜色  默认 - 灰色    roundColor = typedArray.getColor(R.styleable.PercentageRing_circleColor, 0xffffffff);    //外圆环的颜色  动态画圆 - 默认-红色    mRingColor = typedArray.getColor(R.styleable.PercentageRing_ringColor, 0xffafb4db);    //中间圆的半径 默认为80    mRadius = typedArray.getInt(R.styleable.PercentageRing_radius, 80);    //字体颜色 默认 - 灰色    mTextColor = typedArray.getColor(R.styleable.PercentageRing_textColor, 0xffafb4db);    //最后一定要调用这个 释放掉TypedArray    typedArray.recycle();    //初始化数据    init(context);}public yuanhuan(Context context, AttributeSet attrs, int defStyleAttr) {    super(context, attrs, defStyleAttr);}public yuanhuan(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {    super(context, attrs, defStyleAttr, defStyleRes);    init(context);}private void init(Context context){    //圆环开始角度 -90° 正北方向    mStartSweepValue = -90;    //当前角度    mCurrentAngle = 0;    //当前百分比    mCurrentPercent = 0;    //设置中心园的画笔    mCirclePaint = new Paint();    mCirclePaint.setAntiAlias(true);    mCirclePaint.setColor(mCircleBackground);    mCirclePaint.setStyle(Paint.Style.FILL);    //设置文字的画笔    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(Paint.Align.CENTER);    //设置外圆环的画笔    mArcPaint = new Paint();    roundColorPaint = new Paint();    roundColorPaint.setColor(roundColor);    mArcPaint.setAntiAlias(true);    mArcPaint.setColor(mRingColor);    mArcPaint.setStyle(Paint.Style.STROKE);    mArcPaint.setStrokeWidth((float) (0.075*mRadius));    //获得文字的字号 因为要设置文字在圆的中心位置    mTextSize = (int) mTextPaint.getTextSize();}//主要是测量wrap_content时候的宽和高,因为宽高一样,只需要测量一次宽即可,高等于宽@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {    setMeasuredDimension(measure(widthMeasureSpec), measure(widthMeasureSpec));    //设置圆心坐标    mCircleX = getMeasuredWidth()/2;    mCircleY = getMeasuredHeight()/2;    //如果半径大于圆心横坐标,需要手动缩小半径的值,否则就画到外面去了    if (mRadius>mCircleX) {        //设置半径大小为圆心横坐标到原点的距离        mRadius = mCircleX;        mRadius = (int) (mCircleX-0.075*mRadius);        //因为半径改变了,所以要重新设置一下字体宽度        mTextPaint.setStrokeWidth((float) (0.025*mRadius));        //重新设置字号        mTextPaint.setTextSize(mRadius/2);        //重新设置外圆环宽度        mArcPaint.setStrokeWidth((float) (0.075*mRadius));        //重新获得字号大小        mTextSize = (int) mTextPaint.getTextSize();    }    //画中心园的外接矩形,用来画圆环用    mArcRectF = new RectF(mCircleX-mRadius, mCircleY-mRadius, mCircleX+mRadius, mCircleY+mRadius);}//当wrap_content的时候,view的大小根据半径大小改变,但最大不会超过屏幕private int measure(int measureSpec){    int result=0;    //1、先获取测量模式 和 测量大小    //2、如果测量模式是MatchParent 或者精确值,则宽为测量的宽    //3、如果测量模式是WrapContent ,则宽为 直径值 与 测量宽中的较小值;否则当直径大于测量宽时,会绘制到屏幕之外;    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;}//开始画中间圆、文字和外圆环@Overrideprotected void onDraw(Canvas canvas) {    super.onDraw(canvas);    //1、画中间背景圆    //2、画文字    //3、画圆环    //4、判断进度,重新绘制    canvas.drawCircle(mCircleX, mCircleY, mRadius, roundColorPaint);    canvas.drawText(String.valueOf(mCurrentPercent) + "%", mCircleX, mCircleY + mTextSize / 4, mTextPaint);    canvas.drawArc(mArcRectF, mStartSweepValue, mCurrentAngle, false, mArcPaint);    if (mCurrentPercent < mTargetPercent) {        //当前百分比+1        mCurrentPercent += 1;        //当前角度+360        mCurrentAngle += 3.6;        //每10ms重画一次        postInvalidateDelayed(10);    } else if (mCurrentPercent == mTargetPercent) {        //当前百分比+1        mCurrentPercent = 0;        //当前角度+360        mCurrentAngle = 0;        //每10ms重画一次        postInvalidateDelayed(10);        //canvas.drawRect(mArcRectF, mRingPaint);    }}//设置目标的百分比public void setTargetPercent(float percent){    mTargetPercent = percent;}

}


自定义属性

<resources>    <declare-styleable name="PercentageRing">        <attr name="circleColor" format="color"/>        <attr name="radius" format="integer"/>        <attr name="circleBackground" format="color"/>        <attr name="ringColor" format="color"/>        <attr name="textColor" format = "color"/>    </declare-styleable> </resources>

xml

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    xmlns:app="http://schemas.android.com/apk/test.bwie.com.baixinfei20171009"    android:id="@+id/activity_main"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:paddingBottom="@dimen/activity_vertical_margin"    android:paddingLeft="@dimen/activity_horizontal_margin"    android:paddingRight="@dimen/activity_horizontal_margin"    android:paddingTop="@dimen/activity_vertical_margin"    tools:context="test.bwie.com.baixinfei20171009.MainActivity">    <test.bwie.com.baixinfei20171009.yuanhuan        android:id="@+id/recommend_progressBar"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        app:circleBackground="#00000000"        android:layout_centerHorizontal="true"        app:ringColor="#ffea4745"        app:textColor="#ff999999"/>    <Button        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:id="@+id/start"        android:layout_below="@id/recommend_progressBar"        android:text="开始"/>    <Button        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:id="@+id/reset"        android:layout_toRightOf="@id/start"        android:layout_below="@id/recommend_progressBar"        android:text="暂停"/></RelativeLayout>

MainActivity

package test.bwie.com.baixinfei20171009;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;

public class MainActivity extends AppCompatActivity {
private yuanhuan cc;
private Button start;
private Button resut;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
start= (Button) findViewById(R.id.start);
resut= (Button) findViewById(R.id.reset);
cc= (yuanhuan) findViewById(R.id.recommend_progressBar);
start.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
cc.setTargetPercent(100);
cc.invalidate();
}
});
resut.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
cc.setTargetPercent(0);
cc.invalidate();
}
});

}

}

原创粉丝点击