Search code examples
androidxmlpositionprogress-barcenter

Where and how to put a progressbar on a existing layout?


i created an activity that includes an AsyncTask for fetching json from internet. I add a progressbar to the existing layout so users can't interact with EditText till up the data download is completed. WHERE to put the progressbar widget on existing layout? HOW to make users not to click on existing widgets (EditText, Spinner and so on) while progressbar loading?

Here is my layout:

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/home"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <LinearLayout 
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:orientation="vertical" >

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:layout_marginBottom="20dp"
            android:contentDescription="@string/mylogo"
            android:src="@drawable/myapp_logo" />    

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal" >

            <TextView
                android:id="@+id/textMethod"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textSize="18sp"
                android:text="@string/method"
                android:textColor="@color/black" />

            <Spinner
                android:id="@+id/spinner1"
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:layout_below="@id/textSpinner"
                android:textSize="18sp"
                android:inputType="text"
                android:textColor="@color/black" />
        </RelativeLayout>

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal"
            android:layout_marginTop="20dp" >

            <TextView
                android:id="@+id/textMethod2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textSize="18sp"
                android:text="@string/method2"
                android:textColor="@color/black" />

            <EditText
                android:id="@+id/editMethod2"
                android:layout_width="100dp"
                android:layout_height="wrap_content"
                android:layout_below="@id/textMethod2"
                android:textSize="18sp"
                android:inputType="text"
                android:textColor="@color/black" />

            <ProgressBar
                android:id="@+id/progressBar1"
                style="?android:attr/progressBarStyleLarge"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerHorizontal="true"
                android:layout_centerVertical="true" />

        </RelativeLayout>

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal"
            android:layout_marginTop="20dp" >

            <TextView
                android:id="@+id/textTotal"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textSize="18sp"
                android:text="@string/total"
                android:textColor="@color/black" />

            <EditText
                android:id="@+id/editTotal"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@id/textTotal"
                android:textSize="18sp"
                android:inputType="text"
                android:textColor="@color/black" />
        </RelativeLayout>

        <Button
            android:id="@+id/button"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"                
            android:layout_marginTop="20dp"
            android:layout_marginBottom="20dp"
            android:background="@drawable/yellow_button_event"
            android:onClick="send"
            android:text="@string/send" />
    </LinearLayout>
</ScrollView>

I used visual xml editor in Eclipse to add the progressbar at the center of the screen, but as you can see by the code it puts the progressbar within existing RelativeLayout, below an EditText. This causes that during showing of progressbar the position of closer widgets changes. How to avoid this? What is the best approach in this cases to add a progressbar in the middle and over and existing layout?

I hope you can help me and please forgive me for my english.


Solution

  • You can define your progress bar and scroll view in relative layout. Update the visibility of progress bar when you you want to show it.

    <?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" >
    
      <ScrollView
        android:id="@+id/home"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >
    
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="20dp"
            android:layout_marginRight="20dp"
            android:layout_marginTop="20dp"
            android:orientation="vertical" >
    
            your layout content here.....
    
        </LinearLayout>
      </ScrollView>
    
      <RelativeLayout
        android:id="@+id/progressBarlayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:visibility="gone" >
    
        <ProgressBar
            style="?android:attr/progressBarStyleLarge"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true" />
      </RelativeLayout>
    </RelativeLayout>