Android开发：如何显示ProgressBar而不改变原有界面布局？

这个问题很典型——你当前的布局里，ProgressBar所在的RelativeLayout是垂直LinearLayout的一个子元素，当它从gone变为可见时，自然会占据LinearLayout的垂直空间，把下面的密码输入框挤下去。要实现“显示ProgressBar不改变原有布局”，核心思路是让ProgressBar层叠在原有内容之上，而不是作为布局流的一部分。

下面给你两种可行的方案：

方案一：用FrameLayout作为根布局（推荐） #

FrameLayout允许子元素层叠显示，我们把原有内容和ProgressBar布局放在同一个FrameLayout下，让ProgressBar布局默认隐藏，显示时覆盖在内容上方：

<FrameLayout 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="wrap_content"
    tools:context=".Login">

    <!-- 原来的内容布局，保持不变 -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:paddingLeft="24dp"
        android:paddingTop="56dp"
        android:paddingRight="24dp">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="72dp"
            android:layout_gravity="center_horizontal"
            android:layout_marginBottom="24dp"
            android:src="@drawable/cenviro" />

        <com.rengwuxian.materialedittext.MaterialEditText
            android:id="@+id/input_email"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="8dp"
            android:layout_marginBottom="8dp"
            android:hint="Email"
            android:inputType="textEmailAddress"
            app:met_floatingLabel="highlight" />

        <com.rengwuxian.materialedittext.MaterialEditText
            android:id="@+id/input_password"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="8dp"
            android:layout_marginBottom="8dp"
            android:hint="Password"
            android:inputType="textPassword"
            app:met_floatingLabel="highlight" />
    </LinearLayout>

    <!-- ProgressBar布局，层叠在内容之上 -->
    <RelativeLayout
        android:id="@+id/relativeLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:visibility="gone"
        android:background="#CCFFFFFF"> <!-- 可选：加半透明背景，增强遮罩效果 -->

        <ProgressBar
            android:id="@+id/progressBar"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_marginRight="10dp"
            android:indeterminate="true"
            android:indeterminateDrawable="@drawable/progress"
            android:max="100"/>

        <TextView
            android:id="@+id/title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_toRightOf="@+id/progressBar"
            android:text="Logging in..."
            android:textSize="20sp"/>
    </RelativeLayout>

</FrameLayout>

关键修改点： #

• 把根布局换成FrameLayout
• 把ProgressBar的RelativeLayout从原来的LinearLayout中移出，作为FrameLayout的直接子元素
• 调整ProgressBar布局的宽高为match_parent，并设置layout_centerVertical让加载提示居中显示
• 可选：给ProgressBar布局加半透明背景，让用户明确知道当前处于加载状态，无法操作下方内容

方案二：用RelativeLayout作为根布局 #

如果你更习惯用RelativeLayout，也可以把原有内容和ProgressBar布局放在同一个RelativeLayout下，让ProgressBar布局居中显示：

<RelativeLayout 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="wrap_content"
    tools:context=".Login">

    <!-- 原来的内容布局，保持不变 -->
    <LinearLayout
        android:id="@+id/content_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:paddingLeft="24dp"
        android:paddingTop="56dp"
        android:paddingRight="24dp">

        <!-- 里面的ImageView、EditText保持原样 -->
    </LinearLayout>

    <!-- ProgressBar布局，居中覆盖在内容上 -->
    <RelativeLayout
        android:id="@+id/relativeLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:visibility="gone"
        android:layout_alignTop="@id/content_layout"
        android:layout_alignBottom="@id/content_layout"
        android:background="#CCFFFFFF">

        <ProgressBar
            android:id="@+id/progressBar"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_marginRight="10dp"
            android:indeterminate="true"
            android:indeterminateDrawable="@drawable/progress"
            android:max="100"/>

        <TextView
            android:id="@+id/title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_toRightOf="@+id/progressBar"
            android:text="Logging in..."
            android:textSize="20sp"/>
    </RelativeLayout>

</RelativeLayout>

两种方案的核心都是让ProgressBar布局脱离原来的线性布局流，以层叠的方式显示，这样就不会挤压原有控件的位置了。

内容的提问来源于stack exchange，提问作者user11135747