Android 圆形进度条-跟360进度类似-时钟刻度

Posted 2023-05-16

参考技术A 话不多说 先上图

实现原理：

1、先画出中心进度问题

2、圆形进度灰色背景、圆形进度值带光晕

3、时钟刻度

github： https://github.com/hyyz3293/circlegearview.git

圆形进度条：简单实现倒计时圆形进度条

• 上一个4秒的效果图：
  

• 添加依赖

   implementation 'com.dinuscxj:circleprogressbar:1.3.6'

• 布局完整代码：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <com.dinuscxj.progressbar.CircleProgressBar
        android:id="@+id/cpb"
        android:layout_width="80dp"
        android:layout_height="80dp"
        app:progress_stroke_cap="round"
        app:progress_stroke_width="5dp"
        app:progress_style="solid_line"
        app:progress_start_color="#00391F"
        app:progress_end_color="#00391F"
        android:layout_centerInParent="true"
        />

</RelativeLayout>

• MainActivity.java完整代码：

public class MainActivity extends AppCompatActivity {
    CircleProgressBar cpb;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        cpb = findViewById(R.id.cpb);
        cpb.setProgressFormatter(null);
        simulateProgress();

    }

    private void simulateProgress() {
        ValueAnimator animator = ValueAnimator.ofInt(0, 100);
        animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator animation) {
                int progress = (int) animation.getAnimatedValue();
                cpb.setProgress(progress);
            }
        });
        animator.setRepeatCount(ValueAnimator.INFINITE);
        Interpolator linearInterpolator = new LinearInterpolator(); //匀速
        animator.setInterpolator(linearInterpolator);

        animator.setDuration(4 * 1000);
        animator.start();
    }
}