重写View来实现全新的控件------弧线展示图

来源：互联网发布：mac 共享软件编辑：程序博客网时间：2024/05/01 17:28

本人是初学者,本文是按照百度里面写的.请多多包涵

/** * 自定义View  弧线 */public class ArcView extends View{    //http://blog.csdn.net/pd_wang/article/details/52471785?hmsr=toutiao.io&utm_medium=toutiao.io&utm_source=toutiao.io    /**     * 中心圆     */    private Paint mCirCle;    /**     * 给圆弧设置属性     */    private Paint mArcPaint;    // 弧线扫过的角度    private float mSweepValue;    // 中心圆的文字    private String mShowText;    //中间文字    private Paint mTextPaint;    //中间文字大小    private int mShowTextSize;    /**     * 画布的宽     */    private int width;    /**     * 中心轴的坐标     */    private float mCirclexy;    /**     * 半径     */    private float mRadisBan;    public ArcView(Context context, AttributeSet attrs, int defStyleAttr) {        super(context, attrs, defStyleAttr);        init(context, attrs);    }    public ArcView(Context context, AttributeSet attrs) {        super(context, attrs);        init(context, attrs);    }    public ArcView(Context context) {        super(context);    }    private void init(Context context, AttributeSet attrs){        // 将所有的attrs中的所有样式都存储到TypeArray中 将attrs属性赋值给参数        TypedArray typedArray=context.obtainStyledAttributes(attrs,R.styleable.Arc);//的参数应该传2个        /**         * 设置中心圆的属性  将typedArray的属性赋值         */        mCirCle=new Paint();        mCirCle.setColor(typedArray.getColor(R.styleable.Arc_centerCircleColor, ContextCompat.getColor(context,R.color.colorAccent)));        /**         * 圆弧设置属性         */        mArcPaint=new Paint();        mArcPaint.setColor(typedArray.getColor(R.styleable.Arc_arcColor,ContextCompat.getColor(context,R.color.colorPrimaryDark)));        //画笔的宽度        mArcPaint.setStrokeWidth(typedArray.getFloat(R.styleable.Arc_arcWidth,60));        mArcPaint.setStyle(Paint.Style.STROKE);        setProgress(typedArray.getFloat(R.styleable.Arc_arcAngle,10));        /**         * 给中间设置属性         */        mTextPaint = new Paint();        mTextPaint.setColor(typedArray.getColor(R.styleable.Arc_centerTextColor,                ContextCompat.getColor(context,R.color.colorPrimary)));        mShowTextSize = typedArray.getInteger(R.styleable.Arc_centerFontSize, 40);        mTextPaint.setTextSize(mShowTextSize);        //回收        typedArray.recycle();    }    /**     * 给弧形设置一个角度（百分比的形式）     * @param mSweepValue 角度比例     */    public void setProgress(float mSweepValue){        if (mSweepValue != 0) {            this.mSweepValue = (float) (360.0 * (mSweepValue / 100.0));            mShowText = mSweepValue + "%";        } else {            this.mSweepValue = 25;            mShowText = 25 + "%";        }        invalidate();//重绘    }    @Override    protected void onSizeChanged(int w, int h, int oldw, int oldh) {        super.onSizeChanged(w, h, oldw, oldh);        width=w;        mCirclexy=width/2;        mRadisBan=(float) (width*0.5/2);    }    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        /**         * 最外层矩形         */        RectF mArcRectF;        /**         * 绘制弧形的外接矩形属性 大小位置         */        mArcRectF=new RectF((float) (width * 0.1),                (float) (width * 0.1),                (float) (width * 0.9),                (float) (width * 0.9));        /**         * 绘制中心圆         * cx：圆心的x坐标。         *cy：圆心的y坐标。         *radius：圆的半径。         *paint：绘制时所使用的画笔。         */        canvas.drawCircle(mCirclexy,mCirclexy,mRadisBan,mCirCle);        /**         * 绘制 弧线         */        //mSweepValue通过传入的大小        /**         * oval :指定圆弧的外轮廓矩形区域。           startAngle: 圆弧起始角度，单位为度。           sweepAngle: 圆弧扫过的角度，顺时针方向，单位为度。           useCenter: 如果为True时，在绘制圆弧时将圆心包括在内，通常用来绘制扇形。           paint: 绘制圆弧的画板属性，如颜色，是否填充等。         */        canvas.drawArc(mArcRectF,270,mSweepValue,false,mArcPaint);        // 测量字体宽度，根据字体的宽度设置在圆环中间        float widhtText=mTextPaint.measureText(mShowText);        // 通过文字的大小和长度将文字绘制在圆的正中心        /**         *  text:要绘制的文字         * x：绘制原点x坐标         * y：绘制原点y坐标         * paint:用来做画的画笔         */        canvas.drawText(mShowText, 0,mShowText.length(), mCirclexy-(widhtText/2), mCirclexy+(mShowTextSize/4), mTextPaint);    }}

attrs

 <declare-styleable name="Arc">        <attr name="centerFontSize" format="integer" />        <attr name="centerTextColor" format="color" />        <attr name="centerCircleColor" format="color" />        <attr name="arcColor" format="color" />        <attr name="arcAngle" format="float" />        <attr name="arcWidth" format="integer" />    </declare-styleable>

0 0