Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Progressbar android with text inside

I have a circular ProgressBar, I want inside this circular bar, write the progression in percentage (like 60 %, or 70 %..)
How can I do this inside the circular ProgressBar?

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/RelativeLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

        <ProgressBar
            android:id="@+id/progressBars"
            android:layout_width="200dp"
            android:layout_height="200dp"
            android:layout_centerInParent="true"
            android:layout_centerHorizontal="true"
            android:layout_marginBottom="20dp"
            android:indeterminate="false"
            android:indeterminateDrawable="@drawable/progress_bar"
            android:max="100" />
    </RelativeLayout>
like image 629
user3278732 Avatar asked Dec 15 '22 01:12

user3278732


2 Answers

You should try this:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent" android:layout_height="match_parent" >

    <ProgressBar
        android:id="@+id/myProgress"
        android:layout_width="match_parent" android:layout_height="match_parent" />

    <TextView
        android:id="@+id/myTextProgress"
        android:layout_alignLeft="@id/myProgress" android:layout_alignTop="@id/myProgress"
        android:layout_alignRight="@id/myProgress" android:layout_alignBottom="@id/myProgress"
        android:background="@android:color/transparent" >

</RelativeLayout>  

You also can with the centerInParent set to true, see this.
And see this tutorial or this one for more info to display your percentage.
Hope this will help.

like image 109
Blo Avatar answered Dec 17 '22 13:12

Blo


You could achieve it overriding onDraw inside ProgressBar, and use Canvas.drawText to decide where the text should be positioned . Here you can find the documentation for drwawText:

x and y are the coordinates of the origin of the text being drawn

like image 39
Blackbelt Avatar answered Dec 17 '22 13:12

Blackbelt