CODEWITHSUNDEEP
android
Ana Maria Garcia
Ana Maria Garcia

Reputation: 23

Center progress bar in the middle of the page?

<?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"
    android:orientation="vertical" >

    <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"
        android:layout_centerInParent="true" />

    <WebView
        android:id="@+id/webview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_below="@+id/progressBar1"
        />
</RelativeLayout>

This works but it moves the whole page down to the middle and replace it with black background. I mean it shows in the middle of the page not the content. The content gets pushed down.

enter image description here

Upvotes: 1

Views: 1180

Answers (4)

Rahul
Rahul

Reputation: 5049

Change relative layout to FrameLayout.

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

<WebView
    android:id="@+id/webview"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    />

 <ProgressBar
    android:id="@+id/progressBar1"
    style="?android:attr/progressBarStyleLarge"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center" />
</FrameLayout>

This will do you job. Also this layout processing is much faster than the RelativeLayout and it will increase your application performance (not visible to users)

Upvotes: 0

Nikhil Borad
Nikhil Borad

Reputation: 2085

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

    <WebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

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

Hope this helps..

Upvotes: 0

Riddhiman Adib
Riddhiman Adib

Reputation: 398

RelativeLayout places your UI elements in comparison to other elements. That's why it's getting pushed down. You either need to replace it, or modify the code.

In this case, just remove android:layout_below="@+id/progressBar1" from WebView. This repositions everything in center.

Now, place WebView above ProgressBar to bring and view ProgressBar on top of WebView.

<?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"
     android:orientation="vertical" >

    <WebView
        android:id="@+id/webview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" />

    <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"
        android:layout_centerInParent="true" />

</RelativeLayout>

You can also use FrameLayout in place of RelativeLayout in this code. Hope this helps!

Upvotes: 1

Reena
Reena

Reputation: 1378

This may helpful for you 

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <WebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"     />
    <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_centerInParent="true"
        android:layout_centerVertical="true" />
</RelativeLayout>

You can hide/show progress bar as per your requirement

Upvotes: 0

Related Questions