Bạn có biết làm thế nào để tạo một thanh tiến trình tròn như một trong những ứng dụng Google Fit không? Giống như hình ảnh dưới đây.
Bạn có biết làm thế nào để tạo một thanh tiến trình tròn như một trong những ứng dụng Google Fit không? Giống như hình ảnh dưới đây.
Câu trả lời:
Bạn có thể thử thư viện Circle Progress này
NB: vui lòng luôn sử dụng cùng chiều rộng và chiều cao để xem tiến độ
DonutProTHER:
<com.github.lzyzsd.circleprogress.DonutProgress
android:id="@+id/donut_progress"
android:layout_marginLeft="50dp"
android:layout_width="100dp"
android:layout_height="100dp"
custom:circle_progress="20"/>
CircleProTHER:
<com.github.lzyzsd.circleprogress.CircleProgress
android:id="@+id/circle_progress"
android:layout_marginLeft="50dp"
android:layout_width="100dp"
android:layout_height="100dp"
custom:circle_progress="20"/>
ArcProTHER:
<com.github.lzyzsd.circleprogress.ArcProgress
android:id="@+id/arc_progress"
android:background="#214193"
android:layout_marginLeft="50dp"
android:layout_width="100dp"
android:layout_height="100dp"
custom:arc_progress="55"
custom:arc_bottom_text="MEMORY"/>
Thật dễ dàng để tự tạo cái này
Trong bố cục của bạn bao gồm các mục sau ProgressBar
với một hình vẽ cụ thể ( lưu ý bạn nên lấy chiều rộng từ kích thước thay thế ). Giá trị tối đa rất quan trọng ở đây:
<ProgressBar
android:id="@+id/progressBar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:max="500"
android:progress="0"
android:progressDrawable="@drawable/circular" />
Bây giờ tạo drawable trong tài nguyên của bạn với hình dạng sau. Chơi với bán kính (bạn có thể sử dụng innerRadius
thay vì innerRadiusRatio
) và giá trị độ dày.
thông tư (Pre Lollipop HOẶC Cấp API <21)
<shape
android:innerRadiusRatio="2.3"
android:shape="ring"
android:thickness="3.8sp" >
<solid android:color="@color/yourColor" />
</shape>
thông tư (> = Lollipop HOẶC Cấp API> = 21)
<shape
android:useLevel="true"
android:innerRadiusRatio="2.3"
android:shape="ring"
android:thickness="3.8sp" >
<solid android:color="@color/yourColor" />
</shape>
useLevel là "false" theo mặc định trong API Cấp 21 (Lollipop).
Bắt đầu hoạt hình
Tiếp theo trong mã của bạn sử dụng một ObjectAnimator
để làm động trường tiến trình ProgessBar
của bố cục của bạn.
ProgressBar progressBar = (ProgressBar) view.findViewById(R.id.progressBar);
ObjectAnimator animation = ObjectAnimator.ofInt(progressBar, "progress", 0, 500); // see this max value coming back here, we animate towards that value
animation.setDuration(5000); // in milliseconds
animation.setInterpolator(new DecelerateInterpolator());
animation.start();
Dừng hoạt hình
progressBar.clearAnimation();
PS không giống như các ví dụ ở trên, nó cho hình ảnh động mượt mà.