Remove vertical padding from horizontal ProgressBar

Question

By default the ProgressBar has a certain padding above and below the bar itself. Is there a way to remove this padding so as to only have the bar in the end?

As noted in other topics, setting `maxHeight`, does not work. — abergmeier, Jan 05 '13 at 15:32

score 73 · Answer 1 · edited Nov 09 '14 at 21:19

73

I use the following as a workaround for this issue.

android:layout_marginBottom="-8dp"
android:layout_marginTop="-4dp"

edited Nov 09 '14 at 21:19

Davor Zlotrg

5,890
2
32
49

answered Mar 25 '13 at 09:19

Stephen Wan

944
7
10

1

I didn't need layout_marginBottom. – AlikElzin-kilaka Feb 12 '14 at 16:59
12

`android:layout_marginTop="-6dp"` worked for me. Wonder whether it's dependent on device? I have only tested on Xperia Z1 – Thorbjørn Kappel Hansen Oct 29 '14 at 05:27
2

@ThorbjørnKappelHansen It is device dependent. Galaxy S6 and a margin top of -6dp does not work as desired. – Muhammad Abdul-Rahim Oct 13 '15 at 14:41
1

I think the margins would depend on the size of the progress bar and android version. – Noel Nov 26 '16 at 04:38
2

using `Framelayout` (like in [this answer](http://stackoverflow.com/a/36264357/4112725) is better solution and not depend on phone size/type/os version – koceeng Feb 27 '17 at 10:52
1

a better solution is – Xan Jun 15 '18 at 09:25
@AbandonedCart my solution will not remove padding but forcing height to a specific value padding are overridden – Xan Jun 03 '19 at 11:25
@Xan That is not true. You are exploiting a safety net in the framework that prevents you from doing something unintentional, such as creating a view that is negated by its own default padding. Keep in mind, you are **exploiting a safety net** and it is not going to be an effective solution for every height. The purpose of the `FrameLayout` in other solutions is to ensure the padding is discarded when your view is scaled and that safety net no longer applies. – Abandoned Cart Jun 03 '19 at 14:32

score 58 · Answer 2 · edited Feb 13 '21 at 14:19

58

This is how I used Juozas's answer:

height of my ProgressBar is 4dp. So I created a FrameLayout with height 4dp and set the layout_gravity of ProgressBar to center. It's works like a charm.

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="4dp">

    <ProgressBar
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="match_parent"
        android:layout_height="4dp"
        android:layout_gravity="center"
        android:indeterminate="true" />
</FrameLayout>

Note: What a FrameLayout does is it clips away anything excess, so if you face the problem where the ProgressBar is still thin, just set the layout_height of the ProgressBar to some large number like 100dp. It'll fully cover the FrameLayout and will only show 4dp of it.

edited Feb 13 '21 at 14:19

Sujit

1,377
2
5
16

answered Mar 28 '16 at 14:25

penduDev

4,301
28
34

25

This is a good idea, but your code didn't work for me on Android 7.0 using the support library progress bar. The bar just became thinner but still had padding at the top. – Sam Oct 16 '17 at 21:13
4

@Sam Just make the ProgressBar e.g. height = 100dp. Due to the FrameLayout it still stays 4dp but the bar looks thicker. – Megaetron Apr 03 '18 at 01:23
6

Not workin on API 24+. The bar just gets thinner no matter the size we set on it. – Mauker Oct 10 '18 at 15:49

score 39 · Answer 3 · answered Sep 03 '16 at 15:03

I ended up using a custom library to solve this issue. Most of the other solutions work but the results are not consistent across various devices.

MaterialProgressBar

Consistent appearance on Android 4.0+.

Correct tinting across platforms.

Able to remove the intrinsic padding of framework ProgressBar.

Able to hide the track of framework horizontal ProgressBar.

Used as a drop-in replacement for framework ProgressBar.

To add as a gradle dependency:

compile 'me.zhanghai.android.materialprogressbar:library:1.1.7'

To add a ProgressBar with no intrinsic padding to your layout:

<me.zhanghai.android.materialprogressbar.MaterialProgressBar
    android:layout_width="wrap_content"
    android:layout_height="4dp"
    android:indeterminate="true"
    app:mpb_progressStyle="horizontal"
    app:mpb_useIntrinsicPadding="false"
    style="@style/Widget.MaterialProgressBar.ProgressBar.Horizontal" />

app:mpb_useIntrinsicPadding="false" does the trick. For more details see the GitHub page.

First I tried to avoid to add another dependency just to remove some padding. But all other solutions failed in one or the other way/version and in the end this was like 3 minutes to make it work!! Thank you. — ToniTornado, Jan 10 '18 at 23:32
A whole library just to fix the padding on a view. Way to go Google. — Denny, Jul 18 '18 at 23:21
You may want to use @style/Widget.AppCompat.ProgressBar.Horizontal for the above (depending on your setup) — ror, Feb 24 '19 at 19:31

score 38 · Answer 4 · edited Dec 30 '20 at 10:40

If someone still needs help can try this:

<androidx.core.widget.ContentLoadingProgressBar
    android:id="@+id/progress"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    style="@style/Widget.AppCompat.ProgressBar.Horizontal"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintTop_toTopOf="@+id/guideline"
    android:indeterminate="true"
    android:visibility="visible"
    app:layout_constraintBottom_toTopOf="@+id/guideline" />

Here, the progress bar is inside the ConstraintLayout, and the constraintTop_toTopOf and constraintBottom_toTopOf attributes must be applied to the same element (in this case, it is guideline).

*** COMPLETE SOLUTION:***

<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="48dp">

    <View
        android:id="@+id/guideline"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:orientation="vertical"
        android:visibility="invisible"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />

    <ProgressBar
        android:id="@+id/progress_bar"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:indeterminate="true"
        app:layout_constraintBottom_toTopOf="@+id/guideline"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="@+id/guideline" />
</androidx.constraintlayout.widget.ConstraintLayout>

This should be marked as the correct answer as it works perfectly! — Philio, Dec 20 '18 at 21:26
This is the right answer! You are compatible to all devices (which is not provided be negative margin) and android versions (which is not provided by frame layout solution). Also you do not have to do all that work that needed by importing the system drawables to the app (which does not provide a consistent UI across the system to all the android versions). — Vaios, May 23 '19 at 15:22
@Ali_Waris thanks for posting an answer, I'm keen to understand this solution as unable to get it working. Could you expand the answer to include the ConstraintLayout and guideline to the answer? — scottyab, Sep 09 '19 at 15:30

score 18 · Answer 5 · answered Jan 14 '19 at 03:50

18

To remove the vertial padding of ProgressBar, you can do by

fix the height of ProgressBar
Use scaleY="value" (value = height/4) (4 is default height of progress bar)

Example contains 1 wrap_content ProgressBar, 1 8dp ProgressBar, 1 100dp ProgressBar

<ProgressBar
    style="?android:attr/progressBarStyleHorizontal"
    ...
    android:layout_height="8dp"
    android:scaleY="2" />

answered Jan 14 '19 at 03:50

Linh

43,513
18
206
227

This should be the accepted answer. Simplest solution! – Monim Kaiser Mar 21 '21 at 11:59

Juozas Kontvainis · Answer 6 · 2017-10-18T18:25:10.423

16

It's possible to draw vertically centered ProgressBar inside a parent that would clip away the padding. Since ProgressBar cannot draw itself bigger than parent, we must create a big parent to place inside a clipping view.

<FrameLayout
    android:id="@+id/clippedProgressBar"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="4dp"
    tools:ignore="UselessParent">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="16dp"
        android:layout_gravity="center_vertical">

        <ProgressBar
            style="?android:attr/progressBarStyleHorizontal"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:indeterminate="true"/>

    </FrameLayout>

</FrameLayout>

edited Oct 18 '17 at 18:25

answered Mar 14 '16 at 12:57

Juozas Kontvainis

8,653
6
50
65

1

This worked on Android 7.0, but it resulted in no progress bar on my Sony Xperia M running Android 4.1.2. – Sam Oct 16 '17 at 21:22
@Sam thanks for reporting! What do you see if you change the height of the first FrameLayout from 4dp to 48dp? – Juozas Kontvainis Oct 17 '17 at 07:20
The progress bar appears, but it has a lot of padding underneath it and a tiny bit of padding above it. – Sam Oct 17 '17 at 20:52
@Sam I've updated my answer, hopefully it will work acceptably on your Sony device. If it does not help, I suggest reviewing your application theme configuration. Using Holo theme on KitKat should fix it. – Juozas Kontvainis Oct 18 '17 at 18:32

score 14 · Answer 7 · edited Dec 30 '20 at 18:35

A complete solution to this problem would be as follows. Just in case if someone needs code fragments, this is what I did.

Copied all the 8 indeterminate horizontal progressbar drawables
Edited the drawables using some image manipulator and remove unnecessary paddings
Copied the drawable XML named progress_indeterminate_horizontal_holo.xml from android platform
Copied the style Widget.ProgressBar.Horizontal and its parents
Set the style and min_height manually in the layout

Here is the progress_indeterminate_horizontal_holo.xml

<animation-list
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false">
    <item android:drawable="@drawable/progressbar_indeterminate_holo1" android:duration="50" />
    <item android:drawable="@drawable/progressbar_indeterminate_holo2" android:duration="50" />
    <item android:drawable="@drawable/progressbar_indeterminate_holo3" android:duration="50" />
    <item android:drawable="@drawable/progressbar_indeterminate_holo4" android:duration="50" />
    <item android:drawable="@drawable/progressbar_indeterminate_holo5" android:duration="50" />
    <item android:drawable="@drawable/progressbar_indeterminate_holo6" android:duration="50" />
    <item android:drawable="@drawable/progressbar_indeterminate_holo7" android:duration="50" />
    <item android:drawable="@drawable/progressbar_indeterminate_holo8" android:duration="50" />
</animation-list>

Style resources copied to my local styles file.

<style name="Widget">
    <item name="android:textAppearance">@android:attr/textAppearance</item>
</style>

<style name="Widget.ProgressBar">
    <item name="android:indeterminateOnly">true</item>
    <item name="android:indeterminateBehavior">repeat</item>
    <item name="android:indeterminateDuration">3500</item>
</style>

<style name="Widget.ProgressBar.Horizontal">
    <item name="android:indeterminateOnly">false</item>
    <item name="android:indeterminateDrawable">@drawable/progress_indeterminate_horizontal_holo</item>
</style>

And finally, set min height to 4dp in my local layout file.

<ProgressBar
    android:id="@+id/pb_loading"
    style="@style/Widget.ProgressBar.Horizontal"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:indeterminate="true"
    android:minHeight="4dp"
    android:minWidth="48dp"
    android:progressDrawable="@drawable/progress_indeterminate_horizontal_holo" />

From where can we copy the drawable mentioned in step 1: "1.Copied all the 8 indeterminate horizontal progressbar drawables"? — Greenhand, Dec 21 '13 at 06:50
@JeffreyLin I copied it from this location `/platforms/android-17/data/res/drawable-hdpi/` — Subin Sebastian, Dec 21 '13 at 06:54
Isn't it amazing how much work you have to do to achieve such a common sense behaviour that should just come by default in Android? — SpaceMonkey, Oct 31 '15 at 20:58
@aat I don't think material guidelines has similar progressbars. Please go through this document : https://www.google.com/design/spec/components/progress-activity.html#progress-activity-types-of-indicators — Subin Sebastian, Apr 12 '16 at 07:24

score 10 · Answer 8 · answered Dec 01 '16 at 08:15

I met the same problem while using progressbar with Horizontal style.

The root cause is that the default 9-patch drawable for progress bar: (progress_bg_holo_dark.9.png) has some vertical transparent pixels as padding.

The final Solution that worked for me: customize the progress drawable, my sample code as follow:

custom_horizontal_progressbar_drawable.xml

<?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 android:shape="rectangle">
            <solid android:color="#33ffffff" />
        </shape>
    </item>
    <item android:id="@android:id/secondaryProgress">
        <clip>
            <shape android:shape="rectangle">
                <solid android:color="#ff9800" />
            </shape>
        </clip>
    </item>
    <item android:id="@android:id/progress">
        <clip>
            <shape android:shape="rectangle">
                <solid android:color="#E91E63" />
            </shape>
        </clip>
    </item>
</layer-list>

layout snippet:

<ProgressBar
    android:id="@+id/song_progress_normal"
    style="@style/Widget.AppCompat.ProgressBar.Horizontal"
    android:layout_width="match_parent"
    android:layout_height="5dp"
    android:layout_alignParentBottom="true"
    android:progressDrawable="@drawable/custom_horizontal_progressbar_drawable"
    android:progress="0"/>

This is probably the best solution. Your example code produced no progress bar on my Sony Xperia M running Android 4.1.2, though. — Sam, Oct 16 '17 at 21:26

score 8 · Answer 9 · edited Mar 26 '19 at 13:20

8

One trick is to add negative margins to your progress bar.

Below is an example of the XML code, assuming it's on top of your screen:

<ProgressBar
    android:id="@+id/progressBar"
    style="@style/Widget.AppCompat.ProgressBar.Horizontal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="-7dp"
    android:layout_marginBottom="-7dp"
    android:indeterminate="true" />

edited Mar 26 '19 at 13:20

Ícaro

864
13
28

answered Dec 27 '17 at 12:07

chinmay.d

117
1
4

Adding negative margins solved the problem for me. Thanks! – Ícaro Mar 26 '19 at 12:23

score 7 · Answer 10 · answered Jan 23 '20 at 11:20

if someone still searching for a solution -- check this comment

set the minimum height to be 4 dp

   android:minHeight="4dp"

-

  <ProgressBar
    android:id="@+id/web_view_progress_bar"
    style="@style/Widget.AppCompat.ProgressBar.Horizontal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:indeterminate="false"
    android:max="100"
    android:min="0"
    android:progress="5"
    android:minHeight="4dp"
    android:progressTint="@color/vodafone_red"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    tools:progress="60" />

score 5 · Answer 11 · answered Jun 01 '16 at 16:58

Subin's answer seems to be the only one (currently) that isn't a fragile hack subject to breakage in future releases of the Android ProgressBar.

But rather than going through the trouble of breaking out the resources, modifying them, and maintaining them indefinitely, I've opted to use the MaterialProgressBar library, which does that for us:

<me.zhanghai.android.materialprogressbar.MaterialProgressBar
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:indeterminate="true"
    android:layout_gravity="bottom"
    custom:mpb_progressStyle="horizontal"
    custom:mpb_showTrack="false"
    custom:mpb_useIntrinsicPadding="false"
    style="@style/Widget.MaterialProgressBar.ProgressBar.Horizontal.NoPadding"
/>

In build.gradle:

// Android horizontal ProgressBar doesn't allow removal of top/bottom padding
compile 'me.zhanghai.android.materialprogressbar:library:1.1.6'

That project has a nice demo that shows the differences between it and the built-in ProgressBar.

score 4 · Answer 12 · edited Feb 19 '21 at 06:47

<com.google.android.material.progressindicator.LinearProgressIndicator
    android:id="@+id/progress_loading"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:visibility="visible"
    android:indeterminate="true"
    app:indicatorColor="@color/colorAccent"
    app:layout_constraintTop_toBottomOf="@+id/app_bar_pdfview"/>

I am using this new progress bar using this

implementation 'com.google.android.material:material:1.3.0'

trackThickness: the thickness of the indicator and track.
indicatorColor: the color(s) of the indicator.
trackColor: the color of the track.
trackCornerRadius: the radius of the rounded corner of the indicator and track.
indeterminateAnimationType: the type of indeterminate animation.
indicatorDirectionLinear: the sweeping direction of the indicator.

Use 1.3.0-rc01 now. Its released. – Rahul Mishra Jan 15 '21 at 06:47 — Rahul Mishra, Jan 15 '21 at 06:47

score 2 · Answer 13 · answered May 11 '16 at 15:06

I use minHeight and maxHeigh. It helps for different Api versions.

<ProgressBar
    android:id="@+id/progress_bar"
    style="@style/Base.Widget.AppCompat.ProgressBar.Horizontal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:maxHeight="3dp"
    android:minHeight="3dp" />

It needs to use both. Api 23 works nice with

android:layout_height="wrap_content"
android:minHeight="0dp"

But lower Api versions increase progress bar height to maxHeight in that case.

score 2 · Answer 14 · answered Jun 28 '17 at 00:56

Try the following:

<ProgressBar
    android:id="@+id/progress_bar"
    style="@android:style/Widget.ProgressBar.Horizontal"
    android:progress="25"
    android:progressTint="@color/colorWhite"
    android:progressBackgroundTint="@color/colorPrimaryLight"
    android:layout_width="match_parent"
    android:layout_height="4dp" />

... and then configure the progress bar to your needs since it'll initially display a mid-sized bar with a yellow-colored progress tint with a grayish progress background tint. Also, notice that there's no vertical padding.

score 2 · Answer 15 · edited Dec 30 '20 at 09:40

2

Use like this, inside Linearlayout

 <LinearLayout
     android:layout_width="match_parent"
     android:background="#efefef"
     android:layout_height="wrap_content">

     <ProgressBar
         android:id="@+id/progressBar"
         android:layout_width="fill_parent"
         android:layout_height="wrap_content"
         android:indeterminate="true"
         android:visibility="gone"
         android:layout_marginTop="-7dp"
         android:layout_marginBottom="-7dp"
         style="@style/Widget.AppCompat.ProgressBar.Horizontal" />
 </LinearLayout>

edited Dec 30 '20 at 09:40

Gary Chen

237
2
14

answered Nov 05 '19 at 05:20

alizulfuqar

139
1
12

Works great! Next time describe what you code does and what changes did you to. ;-) – Developer From Jokela Apr 25 '20 at 14:19

score 1 · Answer 16 · edited May 23 '17 at 10:31

1

adding the android:progressDrawable to a layer-list defined in drawable fixed the issue for me. It works by masking the progess bar in a custom drawable

example implementation described at https://stackoverflow.com/a/4454450/1145905

edited May 23 '17 at 10:31

Community

1
1

answered Jun 17 '16 at 01:11

kip2

4,801
3
39
59

score 1 · Answer 17 · answered Apr 01 '17 at 12:51

I'm using style="@style/Widget.AppCompat.ProgressBar.Horizontal" and it was fairly easy to get rid of the margins. That style is:

    <item name="progressDrawable">@drawable/progress_horizontal_material</item>
    <item name="indeterminateDrawable">@drawable/progress_indeterminate_horizontal_material</item>
    <item name="minHeight">16dip</item>
    <item name="maxHeight">16dip</item>

I just overrode the min/max height:

    <ProgressBar
        style="@style/Widget.AppCompat.ProgressBar.Horizontal"
        android:layout_width="match_parent"
        android:layout_height="2dp"
        android:indeterminate="true"
        android:minHeight="2dp"
        android:maxHeight="2dp" />

I never was satisified with the generic progress bar and turned to a library in the end: me.zhanghai.android.materialprogressbar.MaterialProgressBar — Anthony, Aug 23 '17 at 21:16

score 1 · Answer 18 · answered Apr 18 '19 at 00:07

Not necessary to download any new module or even put a FrameLayout around your Progress Bar. These are all just hacks. Only 2 steps:

In your whatever.xml

<ProgressBar
    android:id="@+id/workoutSessionGlobalProgress"
    android:layout_width="match_parent"
    android:layout_height="YOUR_HEIGHT"
    android:progressDrawable="@drawable/progress_horizontal"
    android:progress="0"
    <!-- High value to make ValueAnimator smoother -->
    android:max="DURATION * 1000"
    android:indeterminate="false"
    style="@style/Widget.MaterialProgressBar.ProgressBar.Horizontal"/>

progress_horizontal.xml, Change the values as you please.

Don't like the rounded corners?
Remove corner radius

Don't like the colors? Change the colors, etc. Done!

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:id="@android:id/background">
        <shape>
            <corners android:radius="5dip" />
            <gradient
                    android:startColor="#ff9d9e9d"
                    android:centerColor="#ff5a5d5a"
                    android:centerY="0.75"
                    android:endColor="#ff747674"
                    android:angle="270"
                    />
        </shape>
    </item>

    <item android:id="@android:id/secondaryProgress">
        <clip>
            <shape>
                <corners android:radius="5dip" />
                <gradient
                        android:startColor="#80ffd300"
                        android:centerColor="#80ffb600"
                        android:centerY="0.75"
                        android:endColor="#a0ffcb00"
                        android:angle="270"
                        />
            </shape>
        </clip>
    </item>

    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <corners android:radius="5dip" />
                <gradient
                        android:startColor="#ffffd300"
                        android:centerColor="#ffffb600"
                        android:centerY="0.75"
                        android:endColor="#ffffcb00"
                        android:angle="270"
                        />
            </shape>
        </clip>
    </item>

</layer-list>

Generally, these are the steps to change the code of anything you don't like. Just find the source code and figure out what to change. If you follow the ProgressBar source code, you will find a file called progress_horizontal.xml that it references. Basically how I solve all my XML problems.

score 1 · Answer 19 · answered Jun 16 '20 at 01:54

1

Just make use of Material ProgressIndicator which has no hidden margin.

<com.google.android.material.progressindicator.ProgressIndicator
        android:id="@+id/progressBar"
        style="@style/Widget.MaterialComponents.ProgressIndicator.Linear.Indeterminate"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:indicatorColor="@color/colorPrimary"
        app:trackColor="@color/colorAccent" />

answered Jun 16 '20 at 01:54

devgun

924
12
31

ProgressIndicator will be deprecated https://github.com/material-components/material-components-android/blob/master/docs/components/ProgressIndicator.md – Anwar SE Nov 07 '20 at 00:43
you can use this 'com.google.android.material.progressindicator.LinearProgressIndicator' – Abdur Rehman Jan 14 '21 at 09:51

score 0 · Answer 20 · answered Feb 05 '19 at 13:02

 <ProgressBar
        android:layout_marginTop="-8dp"
        android:layout_marginLeft="-8dp"
        android:layout_marginRight="-8dp"
        android:id="@+id/progress_bar"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="match_parent"
        android:layout_height="4dp"
        android:indeterminate="false"
        android:indeterminateTint="@color/white"
        android:max="100"
        android:paddingStart="8dp"
        android:paddingRight="0dp"
        android:progressDrawable="@drawable/progress_bg" />

score 0 · Answer 21 · answered May 24 '20 at 09:51

<androidx.core.widget.ContentLoadingProgressBar
                    android:id="@+id/progressBar"
                    style="@style/Widget.AppCompat.ProgressBar.Horizontal"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:indeterminate="true"
                    android:paddingTop="2dp"
                    app:layout_constraintTop_toTopOf="parent"
                    app:layout_constraintBottom_toTopOf="parent"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintStart_toStartOf="parent"/>

Please don't simply post code. Give some context to your answer. — Martin Gal, May 24 '20 at 10:16

score 0 · Answer 22 · answered Feb 16 '21 at 18:45

One simple way to move the Progressbar up that does not require any additional views or fiddling with the margins is to use the attribute android:translationZ

That way you could either use it in the XML

<Progressbar
 android:layout_height="wrap_content"
 android:layout_width="match_parent"
 android:translateY="-6dp"
/>

or

use it from within a style

<style name="MyTheme.Progressbar.Horizontal" parent="Widget.AppCompat.Progressbar.Horizontal">
    <item name="android:translateY">-6dp</item>
</style>

and then reference it in the Layout like this

<Progressbar
 android:layout_height="wrap_content"
 android:layout_width="match_parent"
 style="@style/MyTheme.Progressbar.Horizontal"
 />

score 0 · Answer 23 · answered Mar 18 '21 at 12:13

Make the size of the progressBar really big (i mean height) and then place it into a frameLayout of the size that you wish your progressBar needs to be.

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="10dp">

    <ProgressBar
        android:id="@+id/progress_bar"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:layout_gravity="center"
        android:backgroundTint="@android:color/transparent"
        android:indeterminate="true"
        android:indeterminateTint="@color/white" />

</FrameLayout>

Rubin Yoo · Answer 24 · 2021-04-13T23:40:33.540

Here's a simple material horizontal progress bar without adding a file, scaling, or changing the dimension

    style="@android:style/Widget.ProgressBar.Horizontal"
    android:progressTint="Your Progress Color"
    android:progressTintMode="src_over"
    android:progressBackgroundTint="Your Background Color"
    android:backgroundTintMode="src_over"

This works by coloring over the progress or background color presented in Widget.ProgressBar.Horizontal

score -1 · Answer 25 · answered Sep 02 '17 at 12:53

A simple no-tricks solution which is compatible with any version of Android and doesn't need external libraries is faking ProgressBar with two Views inside LinearLayout. This is what I ended up with. Looks pretty neat and this approach is quite flexible - you can animate it in funky ways, add text etc.

Layout:

<LinearLayout
    android:id="@+id/inventory_progress_layout"
    android:layout_width="match_parent"
    android:layout_height="4dp"
    android:orientation="horizontal">

    <TextView
        android:id="@+id/inventory_progress_value"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <TextView
        android:id="@+id/inventory_progress_remaining"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</LinearLayout>

Code:

public void setProgressValue(float percentage) {
    TextView progressValue = (TextView) findViewById(R.id.inventory_progress_value);
    TextView progressRemaining = (TextView) findViewById(R.id.inventory_progress_remaining);

    LinearLayout.LayoutParams paramsValue = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);
    LinearLayout.LayoutParams paramsRemaining = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);

    paramsValue.weight = (100 - percentage);
    paramsRemaining.weight = percentage;

    progressValue.setLayoutParams(paramsValue);
    progressRemaining.setLayoutParams(paramsRemaining);

}

Result (with some elevation added):

score -1 · Answer 26 · answered Jun 14 '19 at 21:46

-1

The best solution should be

android:minHeight="0dp"

No workaround and works like a charm.

answered Jun 14 '19 at 21:46

Alex Fan

5
1
5

didn't worked, can you please explain why this should work ? – humble_wolf Oct 10 '19 at 20:42
@humble_wolf It worked for myself in my previous project when I wrote the answer; might be dependent on some particular version of library? It should work because the reason there is a padding like thing for progress bar is not the actual padding but there’s a `minHeight` that’s bigger than 0 (say 32dp maybe) predefined. By change this property you get a different look. – Alex Fan Oct 12 '19 at 03:20
Didn't worked for me in Inderminate=true mode, maybe working in determinate mode. If you really want this to be an answer please write the explaination in answer with all the conditions. – humble_wolf Oct 12 '19 at 16:32

Remove vertical padding from horizontal ProgressBar

26 Answers26

Linked

Related