Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android horizontal progress bar?

I'd like to implement a progress bar like this

enter image description here

Please help how can I do it or if there is a library

like image 894
youssefhassan Avatar asked Mar 04 '14 16:03

youssefhassan


People also ask

How do I make my progress bar horizontal android?

In Android, by default a progress bar will be displayed as a spinning wheel but If we want it to be displayed as a horizontal bar then we need to use style attribute as horizontal. It mainly use the “android. widget. ProgressBar” class.

How can I customize my android progress bar?

Android App Development for Beginners This example demonstrates how to create a custom Progress Bar in Android using Kotlin. Step 1 − Create a new project in Android Studio, go to File ⇒ New Project and fill all required details to create a new project. Step 2 − Add the following code to res/layout/activity_main. xml.

What is ProgressBar in android?

Android ProgressBar is a graphical view indicator that shows some progress. Android progress bar displays a bar representing the completing of the task. Progress bar in android is useful since it gives the user an idea of time to finish its task.


1 Answers

I saw that a lot of people are looking on this post so I thought that I should edit it and share an example:

Note (this example is not complete, it's still in progress but I guess it's a starting point)

GitHub: Github Example

enter image description here

The important part in this example is below: Create in drawable a xml file custom_progress_bar_horizontal.xml and add the content below.

<?xml version="1.0" encoding="UTF-8"?>

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@android:id/background">
        <shape>
            <padding
                android:bottom="3dip"
                android:top="3dip"
                android:left="3dip"
                android:right="3dip"/>
            <corners
                android:radius="5dip" />
            <gradient
                android:startColor="#2a2b2f"
                android:centerColor="#2a2b2f"
                android:centerY="0.50"
                android:endColor="#2a2b2f"
                android:angle="270" />
        </shape>
    </item>
    <item
        android:id="@android:id/progress">
        <clip>
            <shape>
                <corners
                    android:radius="5dip" />
                <gradient
                    android:startColor="#ff0e75af"
                    android:endColor="#ff1997e1"
                    android:angle="90" />
            </shape>
        </clip>
    </item>
</layer-list>

Add the following code in styles.xml

<style name="CustomProgressBar" parent="android:Widget.ProgressBar.Horizontal">
    <item name="android:indeterminateOnly">false</item>
    <item name="android:progressDrawable">@drawable/custom_progress_bar_horizontal</item>
    <item name="android:minHeight">10dip</item>
    <item name="android:maxHeight">20dip</item>
</style>

After you have added the style in your activity layout add:

    <ProgressBar
        android:id="@+id/customProgress"
        style="@style/CustomProgressBar"
        android:layout_width="match_parent"/>

The progress dispaly below in a frame it's a little tricky because you need to extend the ProgressBar class and make the changes there.

I will leave here some examples and notify when I will add them in my github project.

Great example if you want to disaply the progress in your way: NumberProgressBar

Other progress bar examples:

Custom progress bar 1

Custom progress bar 2

Custom progress bar 3

UPDATE:

Also check DiscreteSeekBar this is a great github project.

Gradle: compile 'org.adw.library:discrete-seekbar:1.0.1'

Cheers,

like image 134
MSA Avatar answered Sep 18 '22 18:09

MSA