温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

如何使用CircularCounter实现双层原形进度条效果

发布时间:2022-01-19 10:56:05 来源:亿速云 阅读:112 作者:小新 栏目:移动开发

这篇文章主要介绍了如何使用CircularCounter实现双层原形进度条效果,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。

CircularCounter 双层原形进度条效果

CircularCounter 双层原形进度条,根据数据的变化而增减的,支持逆向旋转。
本项目主要由CircularCounter自定义控件实现, CircularCounter extends View,
主要由如下代码画出:
@Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        canvas.drawCircle(mBackgroundCenter, mBackgroundCenter,
                mBackgroundRadius, mBackgroundPaint);

        canvas.drawArc(mOneBounds, START_DEGREES, mOneDegrees, false, mOnePaint);
        canvas.drawArc(mTwoBounds, START_DEGREES, mTwoDegrees, false, mTwoPaint);
        canvas.drawArc(mThreeBounds, START_DEGREES, mThreeDegrees, false,
                mThreePaint);

        canvas.drawText(Integer.toString(mOneValue), mOneBounds.centerX(),
                mTextPosY, mTextPaint);
        canvas.drawText(mMetricText, mOneBounds.centerX(), mMetricPosY,
                mMetricPaint);
    }
    

进度值变化设置:
/*
     * Setters
     *
     */

    /**
     * Set the next values to be drawn
     * @param v1
     * @param v2
     * @param v3
     */
    public void setValues(int v1, int v2, int v3) {

        if (v1 <= mRange)
            mOneDegrees = Math.round(((float) v1 * 360) / mRange);
        else
            mOneDegrees = 360;

        if (v2 <= mRange)
            mTwoDegrees = Math.round(((float) v2 * 360) / mRange);
        else
            mTwoDegrees = 360;

        if (v3 <= mRange)
            mThreeDegrees = Math.round(((float) v3 * 360) / mRange);
        else
            mThreeDegrees = 360;

        mOneValue = v1;

        mSpinHandler.sendEmptyMessage(0);
    }
   

感谢你能够认真阅读完这篇文章,希望小编分享的“如何使用CircularCounter实现双层原形进度条效果”这篇文章对大家有帮助,同时也希望大家多多支持亿速云,关注亿速云行业资讯频道,更多相关知识等着你来学习!

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI