Làm thế nào để tạo ProgressBar tròn trong Android? [đóng cửa]


152

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.

nhập mô tả hình ảnh ở đây


7
Tôi thực sự đã làm một cái gì đó như thế này gần đây. Đây có thể là một điểm khởi đầu hữu ích? github.com/daentech/CircularDemo
daentech

@daentech Tuyệt vời! cảm ơn bạn
Mohamed

1
Bất cứ ai cũng có câu trả lời trong đó các cạnh của phần tải được làm tròn như trong ví dụ?
Siebe

1
@Siebe bạn có thể sử dụng thư viện mà tôi đã đề cập trong câu trả lời của tôi. Nó có thể được tùy chỉnh để tải phần theo ý muốn.
WannaBeGeek

2
có lẽ điều này có thể chỉ cho bạn đi đúng hướng github.com/grmaciel/two-level-circular-proTHER-bar
gmemario

Câu trả lời:


128

Bạn có thể thử thư viện Circle Progress này

nhập mô tả hình ảnh ở đây

nhập mô tả hình ảnh ở đâ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"/>

làm thế nào họ đang hiển thị các giá trị trong tiến trình tôi đang thử setProTHER trong khoảng trống được bảo vệ onProTHERUpdate () {super.onProTHERUpdate (); Log.d (TAG, "onProTHERUpdate"); ProgressBar.setProTHER (ProgressBar.getProTHER () + j); Log.d (TAG, "onProTHERUpdate perc:" + j); updateMemoryAndCountValues ​​(); } nhưng nó không hoạt động
Erum

@Top Cat làm cách nào tôi có thể thêm hình ảnh động như phóng to trong tiến trình vòng tròn hoặc mikinw.blogspot.com/2013/03/glow-effect.html
user3233280

29
giấy phép lớn nhất
radu122

19
Giấy phép WTF. Haha.
z21

1
nhận được lỗi tiền tố không liên kết
Animesh Mangla

338

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 ProgressBarvớ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 innerRadiusthay 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"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 ProgessBarcủ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à.


6
Các bước là ở đó, nếu bạn làm theo điều này, chắc chắn 99% bạn sẽ nhận được kết quả.
Murtaza Khursheed Hussain

5
Hoạt động như một Bùa chú. Ước gì tôi có thể nâng cấp điều này nhiều hơn một lần
Mushtaq Jameel

2
Không hoạt động đối với tôi, chế độ xem không hiển thị
JMRboosties

9
Tôi không biết bạn đang làm gì, chế độ xem không hiển thị không phải là một mô tả vấn đề hoàn chỉnh
Murtaza Khursheed Hussain

6
Câu trả lời của bạn có vẻ rất hiệu quả .. nhưng một hình ảnh = 1000 từ .. vì vậy nếu bạn thêm đầu ra của mình làm ảnh chụp màn hình, nó có thể hữu ích cho người dùng trong tương lai - IMHO
Ranjith Kumar
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.