¿Cómo crear un efecto de brillo en Android?

Shine Effect se usa para dar a ImageView , Button o View una mejor apariencia de animación. Es muy fácil de implementar. qué

Implementación paso a paso

Paso 1: Crear un nuevo proyecto

Para crear un nuevo proyecto en Android Studio, consulte Cómo crear/iniciar un nuevo proyecto en Android Studio . Tenga en cuenta que seleccione Kotlin como lenguaje de programación

Paso 2: trabajar con el archivo activity_main.xml

Vaya al archivo activity_main.xml y consulte el siguiente código. A continuación se muestra el código para el archivo activity_main.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">
  
    <RelativeLayout
        android:layout_width="200dp"
        android:layout_height="80dp"
        android:layout_marginRight="20dp"
        android:layout_marginBottom="20dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintRight_toRightOf="parent">
  
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="60dp"
            android:layout_marginStart="30dp"
            android:layout_marginTop="10dp"
            android:layout_marginBottom="10dp"
            android:background="@drawable/bg_circular"
            android:gravity="center"
            android:weightSum="6">
  
            <ImageView
                android:layout_width="40dp"
                android:layout_height="40dp"
                android:layout_weight="1"
                android:src="@drawable/ic_baseline_add_24" />
  
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="2"
                android:text="Create"
                android:textColor="@color/white"
                android:textSize="20sp" />
  
        </LinearLayout>
          
        <!--This is the view which we will be animating
            in order to show shine effect-->
        <View
            android:id="@+id/shine"
            android:layout_width="30dp"
            android:layout_height="85dp"
            android:background="@drawable/bg_shine"
            android:rotation="20" />
  
    </RelativeLayout>
      
</androidx.constraintlayout.widget.ConstraintLayout>

Paso 3: cree bg_circular.xml dentro de la carpeta dibujable, lo usaremos como fondo del diseño lineal

Consulte Cómo crear un archivo XML de recursos dibujables en Android Studio .

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners
        android:radius="40dp"/>
  
    <solid
        android:color="#308D46"/>
</shape>

Paso 4: Cree bg_shine.xml dentro de la carpeta dibujable. Lo usaremos como fondo de nuestra vista de animación.

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
        android:centerColor="#AAffffff"
        android:endColor="#00ffffff"
        android:startColor="#00ffffff"/>
</shape>

Paso 5: Cree left_right.xml dentro de la carpeta anim de res. Usaremos esta animación para mostrarla en nuestra Vista

Consulte este artículo Cómo crear una carpeta Anim y un archivo de animación en Android Studio .

Estructura de carpetas:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromXDelta="0"
        android:toXDelta="100%p"
        android:duration="1500"
        />
</set>

Paso 6: trabajar con el archivo MainActivity.kt

Vaya al archivo MainActivity.kt y consulte el siguiente código. A continuación se muestra el código del archivo MainActivity.kt . 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.view.animation.Animation
import android.view.animation.AnimationUtils
import androidx.appcompat.app.AppCompatActivity
  
class MainActivity : AppCompatActivity() {
  
    // Initialize the view
    lateinit var shine: View
  
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
  
        // attach it with the id of view
        // that we will animate
        shine = findViewById(R.id.shine)
        shineAnimation()
    }
  
    private fun shineAnimation() {
        // attach the animation layout Using AnimationUtils.loadAnimation
        val anim = AnimationUtils.loadAnimation(this, R.anim.left_right)
        shine.startAnimation(anim)
        // override three function There will error 
        // line below the object
        // click on it and override three functions
        anim.setAnimationListener(object : Animation.AnimationListener {
            // This function starts the 
            // animation again after it ends
            override fun onAnimationEnd(p0: Animation?) {
                shine.startAnimation(anim)
            }
  
            override fun onAnimationStart(p0: Animation?) {}
  
            override fun onAnimationRepeat(p0: Animation?) {}
  
        })
    }
}

Producción:

Repositorio de Github aquí .