Android Progress Wheel Loading Overlay

ほとんどの Android アプリケーションでは、サードパーティからデータをロードすることが不可欠です。 このデータは通常、アプリケーションの起動時に取得され、UI に読み込まれます。 データが読み込まれていることをユーザーに示す良い方法は、UI 上のローディング サークル オーバーレイを使用することです。

では、アプリケーションでデータの読み込み中にプログレス ホイール オーバーレイを設計および実装する 1 つの方法を探ってみましょう。

implementation 'com.pnikosis:materialish-progress:1.7

次に、UI の上に配置できるレイヤーとしてプログレス ホイールを表示する XML ファイルを作成しました。

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:wheel="http://schemas.android.com/apk/res-auto"
android:id="@+id/progress_overlay"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:alpha="0.4"
android:animateLayoutChanges="true"
android:background="@android:color/black"
android:clickable="true"
android:focusable="true"
android:visibility="gone">
<com.pnikosis.materialishprogress.ProgressWheel
android:id="@+id/progress_wheel"
android:layout_width="80dp"
android:layout_height="80dp"
android:clickable="true"
android:layout_gravity="center"
wheel:matProg_barColor="#5588FF"
wheel:matProg_progressIndeterminate="true" />
</FrameLayout>

以下の 2 行を FrameLayout に含めることにより、UI がクリック可能になるのを防ぎます。 また、このビューが使用されていない時間帯に非表示になることを確実にしたいので、visibility を gone に設定します。 このライブラリを使用すると、進捗ホイールの視覚的な属性をカスタマイズできます。

android:clickable="true" 
android:focusable="true"
android:visibility="gone"

これをアプリケーション全体の任意のレイアウト内で使用するには、レイアウト XML ファイルにこれを含めるだけです。

<include layout="@layout/include_progress_overlay"/>

ロード中にこのレイアウトを UI 上に表示するには、visible として可視性を設定する必要があります。 読み込みが完了したら、可視性を invisible に設定するコールバック メソッドを持つことができます。

/* Progress overlay visible */
progressOverlay = findViewById(R.id.progress_overlay);
progressOverlay.setVisibility(View.VISIBLE);...
...
...public void setInvisible() {
progressOverlay.setVisibility(View.INVISIBLE);
}public void setVisible() {
progressOverlay.setVisibility(View.VISIBLE);
}

オーバーレイの最終的な製品は、以下のとおりです。

Leave a Reply