Android ProgressBar .xml Layout

Question

I have this for an XML file:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <ProgressBar
        android:id="@+id/progressbar"
        style="?android:attr/progressBarStyleLarge"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical|center_horizontal"
        android:visibility="visible" />

    <WebView
        android:id="@+id/web_engine"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:visibility="gone" />

</LinearLayout>

And I want the ProgressBar to be the Large style, and be centered in the middle of the screen vertically and horizontally... When I set layout_width and height to fill_parent, it increases the size of the actual loading spinner to the entire screen... How can I make the layout fit the entire screen and center the actual loading icon?

Answer 1

I have checked few possibilities and in my experience the best option for such task is:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <ProgressBar
        android:id="@+id/progressbar"
        style="?android:attr/progressBarStyleLarge"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:visibility="visible" />

    <WebView
        android:id="@+id/web_engine"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"       
        android:visibility="gone" />

</RelativeLayout>

I am using RelativeLayout with android:layout_centerInParent="true" which works better than LinearLayout.

Cheers

Answer 2

You can also use FrameLayout insetad of LinearLayout. That way visible view will overlap invisible one. I revised you code:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

<ProgressBar
    android:id="@+id/progressbar"
    style="?android:attr/progressBarStyleLarge"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center_vertical|center_horizontal"
    android:visibility="visible" />

<WebView
    android:id="@+id/web_engine"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:visibility="gone" />

</FrameLayout>