Shine Effect in Android

To improve the animation appearance of an ImageView, Button, or View, apply the Shine Effect. The implementation is quite simple. For an understanding of what we will be doing in this article, please refer to the example GIF provided below. Keep in mind that Kotlin will be used to implement this project.

In this article, you will learn how to create your shine effect Example of shine effect in Android. So let’s take example of shine effect  in Android of Mobile application.   

Example of shine effect

                                                                                

Step-by-Step Implementation 

​Step 1: Create a New Project in Android ​studio (File >new  project).


Step 2: Create an main_activity.xml file in your layout folder . path (res>layout) 

Implement the same in​voke the following code inside main_activity.xml file.  

 <?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:id="@+id/main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity3">
<RelativeLayout
android:layout_width="200dp"
android:layout_height="80dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="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">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="3"
android:gravity="center"
android:text="@string/English"
android:textColor="@color/white"
android:textSize="20sp" />
</LinearLayout>
<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>
Step 3: Create an MainActivity.kt file in your layout folder 

Implement the same in​voke the following code inside MainActivity.kt file. 

 import android.os.Bundle
import android.view.View
import android.view.animation.Animation
import android.view.animation.AnimationUtils
import androidx.appcompat.app.AppCompatActivity

class MainActivity3 : AppCompatActivity() {
lateinit var shine: View
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main4)
shine = findViewById(R.id.shine)
shineAnimation()

}
private fun shineAnimation() {
val anim = AnimationUtils.loadAnimation(this, R.anim.left_right)
shine.startAnimation(anim)
anim.setAnimationListener(object : Animation.AnimationListener {
override fun onAnimationEnd(p0: Animation?) {
shine.startAnimation(anim)
}

override fun onAnimationStart(p0: Animation?) {}

override fun onAnimationRepeat(p0: Animation?) {}

})
}
}
Step 4 : Output of the above example.

                                                   

Happy coding!

365Bloggy July 25, 2024
Share this post
Tags
SUBSCRIBE THIS FORM


Archive