วิธีการสร้าง ProgressBar แบบวงกลมใน Android? [ปิด]

คุณมีความคิดวิธีสร้างแถบความคืบหน้าแบบวงกลมเหมือนกับแอปพลิเคชัน Google Fit หรือไม่ ชอบภาพด้านล่าง

คุณสามารถลองใช้ห้องสมุดCircle Progress

หมายเหตุ:โปรดใช้ความกว้างและความสูงเดียวกันเสมอสำหรับมุมมองความคืบหน้า

DonutProgress:

 <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"/>

CircleProgress:

  <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"/>

ArcProgress:

<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"/>

มันง่ายในการสร้างด้วยตัวคุณเอง

ในเลย์เอาต์ของคุณรวมถึงสิ่งต่อไปนี้ProgressBarด้วย drawable เฉพาะ ( หมายเหตุคุณควรได้ความกว้างจากส่วนข้อมูลแทน ) ค่าสูงสุดมีความสำคัญที่นี่:

<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" />

ตอนนี้สร้าง drawable ในทรัพยากรของคุณด้วยรูปร่างดังต่อไปนี้ เล่นกับรัศมี (คุณสามารถใช้innerRadiusแทนinnerRadiusRatio) และค่าความหนา

แบบวงกลม (ระดับ Lollipop พื้นฐานหรือ API <21)

   <shape
        android:innerRadiusRatio="2.3"
        android:shape="ring"
        android:thickness="3.8sp" >
        <solid android:color="@color/yourColor" />
   </shape>

แบบวงกลม (> = Lollipop หรือระดับ 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"โดยค่าเริ่มต้นใน API ระดับ 21 (Lollipop)

เริ่มภาพเคลื่อนไหว

ถัดไปในรหัสของคุณใช้ObjectAnimatorเพื่อเคลื่อนไหวฟิลด์ความคืบหน้าProgessBarของโครงร่างของคุณ

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();

หยุดนิเมชั่น

progressBar.clearAnimation();

PS ไม่เหมือนตัวอย่างด้านบนมันให้ภาพเคลื่อนไหวที่ราบรื่น