LineAnimationView en Android con ejemplo

LineAnimationView es una biblioteca de animación que ayuda a captar la atención del usuario. Es útil para crear animaciones muy bonitas. En esta animación, un objeto emerge de la parte inferior y sube a la parte superior. Algunas funciones y aplicaciones útiles de LineAnimationView son:

• Utilice esta vista si desea que el usuario espere un tiempo.
• ProgressBar se puede usar en lugar de esto, pero debido a su interfaz de usuario única, atraerá al usuario y, por lo tanto, los usuarios esperarán el tiempo suficiente.
• También proporciona control total al desarrollador.
• Se puede agregar dibujable a la Vista de LineAnimation de acuerdo con los requisitos.

Acercarse

• Paso 1: agregue la biblioteca de soporte en el archivo raíz build.gradle (no en el archivo del módulo build.gradle). Esta biblioteca jitpack es un repositorio de paquetes novedosos. Está hecho para JVM para que cualquier biblioteca que esté presente en github y bigbucket se pueda usar directamente en la aplicación.

  allprojects {             repositories {                    maven { url 'https://jitpack.io' }                 }           }

• Paso 2: agregue la biblioteca de soporte en el archivo build.gradle y agregue la dependencia en la sección de dependencias.

  implementation 'com.github.tushar09:LineAnimation:1.1.9'

• Paso 3: pegue el archivo png en la carpeta dibujable y agréguelo a LineAnimaionView en el archivo activity_main.xml . Descarga el archivo png desde este enlace .
• Paso 4: agregue el siguiente código en el archivo activity_main.xml . En este archivo, agregue la vista LineAnimation al diseño.

  actividad_principal.xml

  <?xml version="1.0" encoding="utf-8"?> <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"     tools:context=".MainActivity">        <com.captaindroid.lineanimation.Animator         android:id="@+id/lineAnimatorView"         android:layout_width="match_parent"         android:layout_height="match_parent"         app:dashPathSize="12dp"         app:dashPathGap="12dp"         app:pathColor="@color/colorAccent"         app:pathStrokeWidth="4dp"         app:drawable="@drawable/ic_water"         app:enableDashPath="true"         app:drawableAminationSpeed="5"         app:repeatable="true"         app:layout_constraintBottom_toBottomOf="parent"         app:layout_constraintLeft_toLeftOf="parent"         app:layout_constraintRight_toRightOf="parent"         app:layout_constraintTop_toTopOf="parent" />    </androidx.constraintlayout.widget.ConstraintLayout>

• Paso 5: agregue el siguiente código en el archivo MainActivity.java . En este archivo, agregue PathListner a LineAnimation View .

  MainActivity.java

  package org.geeksforgeeks.lineanimation;    import androidx.appcompat.app.AppCompatActivity; import android.graphics.Path; import android.os.Bundle; import com.captaindroid.lineanimation.Animator; import com.captaindroid.lineanimation.utils.OnPathListener;    public class MainActivity extends AppCompatActivity                      implements OnPathListener {     private Animator animator;     @Override     protected void onCreate(Bundle savedInstanceState) {         super.onCreate(savedInstanceState);         setContentView(R.layout.activity_main);         animator = findViewById(R.id.lineAnimatorView);         animator.startAnimateArrow();     }        @Override     public Path setOnPathUpdateListener(int bitmapPositionX,                                         int bitmapPositionY) {         // create a new Path object         Path p = new Path();                    // moveTo(float x, float y) takes two parameter         // The x and y are the start of a new contour         // moveTo set the beginning of the next          // contour to the point (x,y)         p.moveTo(animator.getWidth() / 2, 0);                    // cubicTo(float x1, float y1, float x2, float y2,         // float x3, float y3) takes six parameter         // The x1 and y1 are the 1st control          // point on a cubic curve         // The x2 and y2 are the 2nd control          // point on a cubic curve         // The x3 and y3 are the end point         // on a cubic curve         // Add a cubic bezier from the last point,         // approaching control points         // (x1,y1) and (x2,y2), and ending at (x3,y3).         // If no moveTo() call has been         // made for this contour, the first point is         // automatically set to (0,0).         p.cubicTo(0, animator.getHeight() / 2, animator.getWidth(),           animator.getHeight() / 2,            animator.getWidth() / 2, animator.getHeight());            return p;     }        @Override     public void setOnAnimationCompleteListener() {        } }

Salida: ejecutar en el emulador