Android Progress bar shows behind Page content-CodePudding

I want to show a progress bar on my screen during the API calls. Created the API as below, but its showing behind the buttons/text field once it is visible. If there are no items on the screen it is fully visible. And if there are buttons or something its showing behind the button. So I can't see it properly. Please let me know if anything wrong with the implementation.

<?xml version="1.0" encoding="utf-8"?>
        <ScrollView 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"
            android:fillViewport="true"
      >
    <androidx.constraintlayout.widget.ConstraintLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@ id/window_layout"
                android:background="@color/white"
                >
            <FrameLayout
                android:id="@ id/linearLayout5"
                android:layout_width="match_parent"
                android:layout_height="match_parent">
                <LinearLayout
                    android:id="@ id/progress_linear"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:gravity="center"
                    android:orientation="vertical">
                <ProgressBar
                    style="?android:attr/progressBarStyleInverse"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:indeterminate="true"
                    android:theme="@style/ProgressBarTheme"
                    android:id="@ id/progress"
                    android:layout_gravity="center" />
                </LinearLayout>
            <LinearLayout
                android:orientation="vertical"
                android:layout_marginLeft="20dp"
                android:layout_marginRight="20dp"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                tools:ignore="MissingConstraints">
                 <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="24dip"
                    android:text="@string/txt_setup"
                    android:layout_marginBottom="16dp"
                    /><RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="42dp"
                    android:layout_marginTop="8dp"
                    android:id="@ id/spinner_layout"
                    android:background="@drawable/spinner_back"\>
                     <Spinner
                        android:id="@ id/spinner"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:dropDownWidth="match_parent"
                        android:dropDownVerticalOffset="40dp"
                        android:background="@android:color/transparent"
                        android:spinnerMode="dropdown" />
                         <ImageView
                        android:id="@ id/spinner_arr"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center"
                        android:src="@drawable/ic__2_web_icons_ic_caretdown_gra"/>
                </RelativeLayout>
            </LinearLayout>
            </FrameLayout>
        </androidx.constraintlayout.widget.ConstraintLayout>
        </ScrollView>

CodePudding user response：

Have you tried:


<LinearLayout
    android:id="@ id/progress_linear"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical"
    android:elevation="1dp">
    <ProgressBar
         style="?android:attr/progressBarStyleInverse"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:indeterminate="true"
         android:theme="@style/ProgressBarTheme"
         android:id="@ id/progress"
         android:layout_gravity="center" />
</LinearLayout>

That would possibly bring this layout to the front

android:translationZ="1dp"

Could also possibly work

CodePudding user response：

You might want to read up on how a FrameLayout works, but generally for every subview in a FrameLayout, the one at the bottom of the hierarchy will be displayed on top. So for your case, you need to make the change as below

   <FrameLayout
                    android:id="@ id/linearLayout5"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent">
                   
                <LinearLayout
                    android:orientation="vertical"
                    android:layout_marginLeft="20dp"
                    android:layout_marginRight="20dp"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    tools:ignore="MissingConstraints">
                     <TextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginTop="24dip"
                        android:text="@string/txt_setup"
                        android:layout_marginBottom="16dp"
                        /><RelativeLayout
                        android:layout_width="match_parent"
                        android:layout_height="42dp"
                        android:layout_marginTop="8dp"
                        android:id="@ id/spinner_layout"
                        android:background="@drawable/spinner_back"\>
                         <Spinner
                            android:id="@ id/spinner"
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:dropDownWidth="match_parent"
                            android:dropDownVerticalOffset="40dp"
                            android:background="@android:color/transparent"
                            android:spinnerMode="dropdown" />
                             <ImageView
                            android:id="@ id/spinner_arr"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_gravity="center"
                            android:src="@drawable/ic__2_web_icons_ic_caretdown_gra"/>
                    </RelativeLayout>
                </LinearLayout>

               <LinearLayout
                        android:id="@ id/progress_linear"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:gravity="center"
                        android:orientation="vertical">
                    <ProgressBar
                        style="?android:attr/progressBarStyleInverse"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:indeterminate="true"
                        android:theme="@style/ProgressBarTheme"
                        android:id="@ id/progress"
                        android:layout_gravity="center" />
                    </LinearLayout>

                </FrameLayout>

Notice how i moved your progress_linear LinearLayout to the bottom within the FrameLayout