How to bring a Progress Bar in front of a Button in older API versions?

Question

I read two articles about this topic, this and this.

But both tell solutions like changing the elevation or translations.

The question is about bringing a Progress bar in front of a button in older versions that don't support elevation or translation attributes.

How can I do this in XML and in Java?!

Or it is not valid.

<?xml version="1.0" encoding="utf-8"?>
<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"
    tools:context="com.business.abdelhafiz.omar.civiltaif.LoginActivity">

    <ImageView
        android:src="@drawable/home_civil"
        android:scaleType="fitXY"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <ProgressBar
        android:id="@+id/login_progressbar"
        android:layout_centerInParent="true"
        android:layout_width="@dimen/image_height"
        android:layout_height="@dimen/image_height" />

    <Button
        android:id="@+id/login_email"
        android:layout_centerInParent="true"
        android:text="@string/login_email"
        android:onClick="loginEmail"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <Button
        android:id="@+id/login_anonymous"
        android:layout_centerInParent="true"
        android:layout_below="@id/login_email"
        android:text="@string/login_anonymous"
        android:onClick="loginAnonymous"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

</RelativeLayout>

Here is a screen shot

I want to bring the progress bar in front of the buttons

Edit:

Nothing worked for me so I will just hide the buttons when I need to show the progress bar.

Thanks for your help.

This worked for me https://stackoverflow.com/questions/31343213/progressbar-on-top-of-button-in-relative-layout-issue-in-android-studio/31343665 — shashank chandak, Jun 17 '18 at 15:03

Vasileios Pallas · Accepted Answer · 2017-02-02T18:45:41.270

5

you can move it to the bottom like this

<ImageView
    android:src="@drawable/home_civil"
    android:scaleType="fitXY"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

<Button
    android:id="@+id/login_email"
    android:layout_centerInParent="true"
    android:text="@string/login_email"
    android:onClick="loginEmail"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

<Button
    android:id="@+id/login_anonymous"
    android:layout_centerInParent="true"
    android:layout_below="@id/login_email"
    android:text="@string/login_anonymous"
    android:onClick="loginAnonymous"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

<ProgressBar
    android:id="@+id/login_progressbar"
    android:layout_centerInParent="true"
    android:layout_width="@dimen/image_height"
    android:layout_height="@dimen/image_height" />

or in onCreate method just write login_progressbar.bringToFront();

edited Feb 02 '17 at 18:45

answered Jan 19 '17 at 19:05

Vasileios Pallas

4,801
4
33
50

I moved it to the bottom of the layout – Android Admirer Jan 19 '17 at 19:11
and added the bringToFront method but still doesn't work – Android Admirer Jan 19 '17 at 19:12
clean and rebuild your project – Vasileios Pallas Jan 19 '17 at 19:58
i will try to clean and rebuild – Android Admirer Jan 19 '17 at 20:00

Maryeme Alaoui · Answer 2 · 2017-01-19T19:22:12.230

4

Here the solution, i just change the order of my elements

<?xml version="1.0" encoding="utf-8"?>
<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"
 tools:context="com.business.abdelhafiz.omar.civiltaif.LoginActivity">
<ImageView
    android:src="@drawable/home_civil"
    android:scaleType="fitXY"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />
<Button
    android:id="@+id/login_email"
    android:layout_centerInParent="true"
    android:text="@string/login_email"
    android:onClick="loginEmail"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

<Button
    android:id="@+id/login_anonymous"
    android:layout_centerInParent="true"
    android:layout_below="@id/login_email"
    android:text="@string/login_anonymous"
    android:onClick="loginAnonymous"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />


<ProgressBar
    android:id="@+id/login_progressbar"
    android:layout_centerInParent="true"
    android:layout_width="@dimen/image_height"
    android:layout_height="@dimen/image_height" 
    android:background=""/>



</RelativeLayout>

i added background to progress to see that the progress is in front the buttons

edited Jan 19 '17 at 19:22

answered Jan 19 '17 at 18:48

Maryeme Alaoui

93
2
13

the question was how to bring a progress bar in front of a button – Android Admirer Jan 19 '17 at 18:52
Ok, so can you join a screenshot of what you need ? – Maryeme Alaoui Jan 19 '17 at 18:56
here is a screen shot – Android Admirer Jan 19 '17 at 18:59
Ok i update the answer tell me if that works for you – Maryeme Alaoui Jan 19 '17 at 19:10
changing the order doesn't help – Android Admirer Jan 19 '17 at 19:12
Using a RelativeLayout the order of elements change their disposition, i ve test this code and it works for me. i show you the screenshot – Maryeme Alaoui Jan 19 '17 at 19:17
i will try what you said – Android Admirer Jan 19 '17 at 20:00
i made a new layout and added just a button and a progress bar and still the button overlaps the button – Android Admirer Jan 19 '17 at 20:08
what android studio version do you use – Android Admirer Jan 19 '17 at 20:08
what is your target, compile and min sdk – Android Admirer Jan 19 '17 at 20:09
also i did copy your exact same code above and still doesn't work – Android Admirer Jan 19 '17 at 20:10

score 1 · Answer 3 · answered May 04 '18 at 06:23

1

Set an elevation on the ProgressBar; 2dp seems to work.

android:elevation="2dp"

You could also try setting translationZ as suggested in the accepted answer to a similar question.

I also came across this answer as an alternative.

answered May 04 '18 at 06:23

MidWinterNight

51
1
5

score 0 · Answer 4 · answered Jun 30 '22 at 09:41

0

For me the elevation on the ProgressBar needed to be 4dp, because the Button had already a 2dp elevation by design.

android:elevation="4dp"

answered Jun 30 '22 at 09:41

Theseus

33
9

How to bring a Progress Bar in front of a Button in older API versions?

4 Answers4