Android - How to prevent all user interaction on an activity when loading screen appears?-CodePudding

I have a sign up activity that has a loading state.

This is what the activity looks like when it is not in its loading state:

When the activity is in its loading state, the progress bar appears:

The loading state consists of a View and ProgressBar widget.

The user can still interact with the activity and the button is still clearly visible when the activity is in the loading state. How can I prevent all user interaction and make the button appear behind the View widget?

Edit:

I was able to solve the above problem with the code below:

SignUp.xml:

<?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="fill_parent"
    android:layout_height="match_parent"
    android:background="@drawable/home_edit"
    android:fillViewport="true"
    tools:layout_editor_absoluteX="1dp"
    tools:layout_editor_absoluteY="1dp">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:textAlignment="gravity"
        tools:context=".MainActivity">

        <TextView
            android:id="@ id/textView2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:fontFamily="cursive"
            android:text="Header"
            android:textColor="#FF0000"
            android:textSize="60sp"
            android:visibility="invisible"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            tools:layout_editor_absoluteY="10dp" />

        <TextView
            android:id="@ id/textView3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:fontFamily="cursive"
            android:text="Subheader"
            android:textColor="#00B7FF"
            android:textSize="60sp"
            android:visibility="invisible"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@ id/textView2" />

        <TextView
            android:id="@ id/textView4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginStart="20dp"
            android:layout_marginTop="30dp"
            android:fontFamily="sans-serif-medium"
            android:text="Sign Up"
            android:textColor="#FFFFFF"
            android:textSize="34sp"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@ id/textView3" />

        <EditText
            android:id="@ id/username_sign_up"
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:layout_marginStart="20dp"
            android:layout_marginTop="20dp"
            android:layout_marginEnd="20dp"
            android:background="@android:drawable/editbox_background"
            android:ems="10"
            android:hint="Username"
            android:inputType="textPersonName"
            android:paddingLeft="5dp"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@ id/textView4" />

        <EditText
            android:id="@ id/name_sign_up"
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:layout_marginStart="20dp"
            android:layout_marginEnd="20dp"
            android:background="@android:drawable/editbox_background"
            android:ems="10"
            android:hint="Name"
            android:inputType="textPersonName"
            android:paddingLeft="5dp"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.0"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@ id/username_sign_up" />

        <EditText
            android:id="@ id/surname_sign_up3"
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:layout_marginStart="20dp"
            android:layout_marginEnd="20dp"
            android:background="@android:drawable/editbox_background"
            android:ems="10"
            android:hint="Surname"
            android:inputType="textPersonName"
            android:paddingLeft="5dp"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="1.0"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@ id/name_sign_up" />

        <Button
            android:id="@ id/register_sign_up"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginStart="20dp"
            android:layout_marginTop="30dp"
            android:layout_marginEnd="20dp"
            android:layout_marginBottom="30dp"
            android:background="#00F7FF"
            android:onClick="SignUpButton"
            android:text="Register"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.0"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@ id/password_confirm_sign_up"
            app:layout_constraintVertical_bias="0.0" />

        <EditText
            android:id="@ id/email_sign_up"
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:layout_marginStart="20dp"
            android:layout_marginEnd="20dp"
            android:background="@android:drawable/editbox_background"
            android:ems="10"
            android:hint="Email"
            android:inputType="textEmailAddress"
            android:paddingLeft="5dp"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@ id/surname_sign_up3" />

        <EditText
            android:id="@ id/password_sign_up"
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:layout_marginStart="20dp"
            android:layout_marginEnd="20dp"
            android:background="@android:drawable/editbox_background"
            android:ems="10"
            android:hint="Password"
            android:inputType="textPassword"
            android:paddingLeft="5dp"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@ id/email_sign_up" />

        <EditText
            android:id="@ id/password_confirm_sign_up"
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:layout_marginStart="20dp"
            android:layout_marginEnd="20dp"
            android:background="@android:drawable/editbox_background"
            android:ems="10"
            android:hint="Password Confirm"
            android:inputType="textPassword"
            android:paddingLeft="5dp"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.0"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@ id/password_sign_up" />

        <View
            android:id="@ id/interaction_blocker_sign_up"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="#CC000000"
            android:clickable="true"
            android:elevation="5dp"
            android:visibility="invisible"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <ProgressBar
            android:id="@ id/loading_icon_sign_up"
            style="?android:attr/progressBarStyle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:elevation="6dp"
            android:visibility="invisible"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="@ id/interaction_blocker_sign_up"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

    </androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>

SignUp.java:

public class SignUp extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_sign_up);
    }

    public void SignUpButton(View view)
    {
        getWindow().setFlags(WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE, WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE);

        findViewById(R.id.interaction_blocker_sign_up).setVisibility(View.VISIBLE);
        findViewById(R.id.loading_icon_sign_up).setVisibility(View.VISIBLE);
    }
}

However, getWindow().setFlags(WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE, WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE); does not work as expected. I am still able to type text into an EditText after the loading widget appears. How can I remove focus from all widgets?

CodePudding user response：

For the button issue you just have to make sure that the view is after the button in the yourLayout.xml file

for the interacting issue just add this method for showing/hiding the progress indecator

private void loading (Boolean isLoading){
    if(isLoading){
        progressView.setVisibility(View.VISIBLE);
        container.setEnabled(false); // your container that contains your items that should be disabled
    }
    else{
        progressView.setVisibility(View.INVISIBLE);
        container.setEnabled(true); // your container that contains your items that should be disabled
    }
}

I think this would solve your problem , if you have any problem please post the code that has the issue to determine where the problem is because we did not get enough information about the problem.

CodePudding user response：

As I said earlier, you just need to put your ProgressBar in a layout (any) and set the clickable property of that layout to be true, as you see in the code:

...

<androidx.constraintlayout.widget.ConstraintLayout
    android:id="@ id/progress_layout"
    android:layout_width="match_parent"
    android:visibility="gone"
    android:clickable="true"
    android:layout_height="match_parent">
    <ProgressBar
        android:id="@ id/loading_icon_sign_up"
        style="?android:attr/progressBarStyle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:elevation="6dp"
        android:visibility="invisible"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

...

Setting up the clickable property in that view will consume all the click events when it's visible and won't let them pass to the widgets present behind it.

Now, toggles the visibility of this layout named progress_layout whenever needed instead of the ProgressBar.

I've already used this way a lot of times and it works flawlessly, you can add Fade in/out effect to make it appear better.