显示加载图标，直到 Firebase Firestore 将数据完全加载到文本视图中

Question

当我的应用将 Firebase Firestore 数据加载到其中时，如何实现加载图标？现在，当我加载应用程序时，它显示一个空的文本视图，一旦它从数据库中获取数据，它就会弹出。我希望有一个加载屏幕，直到数据在显示之前完全加载到活动中，所以没有数据弹出。

我尝试查看此网站上的其他解决方案，但它们都来自不同的编程语言，或者我难以理解。

这是我从数据库中获取数据并将其存储在 textView 中的简单代码。

    welcomeTv = findViewById(R.id.welcomeTv);
    fStore = FirebaseFirestore.getInstance();

    fStore.collection("Users").document(FirebaseAuth.getInstance().getCurrentUser().getUid()).get().addOnCompleteListener(new OnCompleteListener<DocumentSnapshot>() {
        @Override
        public void onComplete(@NonNull Task<DocumentSnapshot> task) {

            if (task.isSuccessful() && task.getResult() != null) {
                username = task.getResult().getString("username");
                welcomeTv.setText(username);

                //other stuff
            } else {
                Toast.makeText(HomeActivity.this, "Currently logged in", Toast.LENGTH_SHORT).show();
            }


        }
    });

Answer 1

在您的项目中添加SweetAlert。因此，当您的数据正在加载时，您可以输入您的甜蜜警报。

使用以下库：

implementation 'com.github.f0ris.sweetalert:library:1.5.1'

当您触发加载数据的事件时启动sweetalert，然后当接收到数据时它将关闭

//Global Declaration
SweetAlertDialog pDialog;

pDialog = new SweetAlertDialog(this, SweetAlertDialog.PROGRESS_TYPE);
pDialog.getProgressHelper().setBarColor(Color.parseColor("#A5DC86"));
pDialog.setTitleText("Loading");
pDialog.setCancelable(false);
pDialog.show();
fStore.collection("Users").document(FirebaseAuth.getInstance().getCurrentUser().getUid()).get().addOnCompleteListener(new OnCompleteListener<DocumentSnapshot>() {
        @Override
        public void onComplete(@NonNull Task<DocumentSnapshot> task) {

            if (task.isSuccessful() && task.getResult() != null) {
                pDialog.dismiss();
                pDialog.dismissWithAnimation();
                username = task.getResult().getString("username");
                welcomeTv.setText(username);

                //other stuff
            } else {
                pDialog.dismiss();
                pDialog.dismisswithAnimation();
                Toast.makeText(HomeActivity.this, "Currently logged in", Toast.LENGTH_SHORT).show();
            }


        }
});

Answer 2

加载数据后，您可以使用ProgressBar 和调用ProgressBar.setVisibility(View.GONE) 隐藏进度条。

首先在布局的其余部分之外添加ProgressBar，然后将要隐藏的布局的可见性设置为已消失

<androidx.constraintlayout.widget.ConstraintLayout 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="match_parent">

    <ProgressBar
        android:id="@+id/progressBar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/mainContent"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:visibility="gone"> // Initially hide all the body

        <TextView
            android:id="@+id/welcomeTv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Welcome"
            app:layout_constraintBottom_toTopOf="@+id/logOutBtn"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintVertical_bias="0.84000003" />

        <Button
            android:id="@+id/logOutBtn"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Log out"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />
    </androidx.constraintlayout.widget.ConstraintLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

一旦加载数据，隐藏 ProgressBar 并使 mainContent 布局可见

ProgressBar progressBar = findViewById(R.id.progressBar); // Get ProgressBar reference
ConstraintLayout mainContent = findViewById(R.id.mainContent);
welcomeTv = findViewById(R.id.welcomeTv);
fStore = FirebaseFirestore.getInstance();


fStore.collection("Users").document(FirebaseAuth.getInstance().getCurrentUser().getUid()).get().addOnCompleteListener(new OnCompleteListener<DocumentSnapshot>() {
        @Override
        public void onComplete(@NonNull Task<DocumentSnapshot> task) {
            progressBar.setVisibility(View.GONE); // Hide Progress bar 
            mainContent.setVisibility(View.VISIBLE); // Show TextView

            if (task.isSuccessful() && task.getResult() != null) {

                username = task.getResult().getString("username");
                welcomeTv.setText(username);

                //other stuff
            } else {
                Toast.makeText(HomeActivity.this, "Currently logged in", Toast.LENGTH_SHORT).show();
            }


        }
    });

希望对你有帮助

更新：用您在 cmets 中提到的布局更新了代码。