Estado ProgressBar en Android

State Progress Bar es una de las principales características que vemos en muchas aplicaciones. Podemos llegar a ver esta característica en aplicaciones de reserva de boletos, aplicaciones educativas. Esta barra de progreso ayuda a indicar al usuario los pasos a seguir para realizar una tarea. En este artículo vamos a ver cómo implementar State Progress Bar en Android. qué

Aplicación de la Barra de Progreso del Estado

• Se utiliza en la mayoría de las aplicaciones que brindan servicios, como la reserva de boletos, el llenado de formularios de examen y muchas más.
• Esta barra de progreso de estado ayuda a que los pasos del usuario se lleven a cabo para realizar la tarea.
• Úselo en varias aplicaciones de llenado de formularios de examen.

Atributos de la barra de progreso del estado

Implementación paso a paso

Paso 1: Crear un nuevo proyecto

Cómo crear/iniciar un nuevo proyecto en Android Studio Java

Paso 2: agregue la dependencia de la biblioteca State Progress Bar en el archivo build.gradle

Luego navegue a los scripts de gradle y luego al nivel build.gradle (Módulo) . Agregue la siguiente línea en el archivo build.gradle en la sección de dependencias.

implementación ‘com.kofigyan.stateprogressbar:stateprogressbar:1.0.0’

Ahora haga clic en Sincronizar ahora sincronizará todos sus archivos en build.gradle().

Paso 3: cree una nueva barra de progreso de estado en su archivo activity_main.xml

Vaya a la aplicación > res > diseño para abrir el archivo activity_main.xml . A continuación se muestra el código para el archivo activity_main.xml .

<?xml version="1.0" encoding="utf-8"?>
<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="match_parent"
    tools:context=".MainActivity">
  
    <!--Progress Bar created-->
    <com.kofigyan.stateprogressbar.StateProgressBar
        android:id="@+id/your_state_progress_bar_id"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        app:spb_animateToCurrentProgressState="true"
        app:spb_checkStateCompleted="true"
        app:spb_currentStateDescriptionColor="#0F9D58"
        app:spb_currentStateNumber="one"
        app:spb_maxStateNumber="four"
        app:spb_stateBackgroundColor="#BDBDBD"
        app:spb_stateDescriptionColor="#808080"
        app:spb_stateForegroundColor="#0F9D58"
        app:spb_stateNumberBackgroundColor="#808080"
        app:spb_stateNumberForegroundColor="#eeeeee" />
      
    <!--Button to go on next step-->
    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:text="NEXT" />
      
</RelativeLayout>

Paso 4: trabajar con el archivo MainActivity.java

Vaya al archivo MainActivity.java y consulte el siguiente código. A continuación se muestra el código del archivo MainActivity.java. Se agregan comentarios dentro del código para comprender el código con más detalle.

import android.os.Bundle;
import android.view.View;
import android.widget.Button;
  
import androidx.appcompat.app.AppCompatActivity;
  
import com.kofigyan.stateprogressbar.StateProgressBar;
  
public class MainActivity extends AppCompatActivity {
  
    // steps on state progress bar
    String[] descriptionData = {"Step One", "Step Two", "Step Three", "Step Four"};
  
    Button button;
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
  
        StateProgressBar stateProgressBar = (StateProgressBar) findViewById(R.id.your_state_progress_bar_id);
        stateProgressBar.setStateDescriptionData(descriptionData);
  
        // button given along with id
        button = (Button) findViewById(R.id.button);
  
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                switch (stateProgressBar.getCurrentStateNumber()) {
                    case 1:
                        stateProgressBar.setCurrentStateNumber(StateProgressBar.StateNumber.TWO);
                        break;
                    case 2:
                        stateProgressBar.setCurrentStateNumber(StateProgressBar.StateNumber.THREE);
                        break;
                    case 3:
                        stateProgressBar.setCurrentStateNumber(StateProgressBar.StateNumber.FOUR);
                        break;
                    case 4:
                        stateProgressBar.setAllStatesCompleted(true);
                        break;
                }
            }
        });
    }
}

Ahora haga clic en la opción de ejecución , tomará algún tiempo construir Gradle. Después de eso, obtendrá la salida en su dispositivo como se indica a continuación.

Producción: