SUMMARY :
Use picture 1 for reference.
I need to keep the grey part under the green part, so that when green decreases, grey becomes visible. But I also want the uncovered part (just grey to not be there). Resulting in a 2/3rd overlapping circle.
I am trying to create 2/3rd circle (with rounded corners) as a progress bar in android studio. I am not able to do it. I was hoping to get your help.
Current circle: (PICTURE 1)
Circle I need :
Shape:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="ring" android:innerRadiusRatio="2.5" android:useLevel="false"
android:thicknessRatio="12">
<solid android:color="#DDD"/>
</shape>
</item>
<item>
<shape android:shape="ring" android:innerRadiusRatio="2.5" android:useLevel="true"
android:thicknessRatio="12">
<solid android:color="@color/colorAccent"/>
</shape>
</item>
</layer-list>
Layout:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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">
<ProgressBar
android:id="@+id/timerProgressBar"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="1:1"
android:indeterminateOnly="false"
android:progressDrawable="@drawable/circle"
android:rotation="-90"
app:layout_constraintBottom_toTopOf="@+id/guidelineBottom"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@+id/guidelineTop"
android:progress="10"/>
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guidelineBottom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.5" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guidelineTop"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.1" />
</androidx.constraintlayout.widget.ConstraintLayout>
from Draw partial circle as progress bar in android studio
No comments:
Post a Comment