How to Increase/Decrease Fading Rate of FadingTextView in Android?
Prerequisite: How to add fading TextView animation in Android
TextView is the basic building block of user interface components. It is used to set the text and display it to the user. It is a very basic component and used a lot. A Fading TextView is a TextView that changes its content automatically every few seconds. So the question is now why to increase/decrease the fading rate of FadingTextView. This completely depends on the elements that are displayed on the screen. This is related to the aesthetics of the application. A slower fading text view with a grey or black text could be used for showing certain messages. Similarly, a faster fading text view with a red text could be used for showing warning or error messages. This completely depends on the developer what they wish to show. Through this article, we implemented a model to demonstrate how this functionality works. One can make use of this functionality accordingly. Note that we are going to implement this project using the Kotlin language.
Approach
Step 1: Create a New Project
To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that select Kotlin as the programming language.
Step 2: Add dependency to the build.gradle file
When the setup is ready, go to the app build.gradle and add the following dependency. Sync the project now.
implementation ‘com.tomer:fadingtextview:2.5’
Step 3: Working with the activity_main.xml file
Next, go to the activity_main.xml file, which represents the UI of the project. We have added a FadingTextView element to display the fading text and a Button, so whenever the user will click on the button the Fading Rate will increase/decrease accordingly. Below is the code for the activity_main.xml file. Comments are added inside the code to understand the code in more detail.
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" > <!--FadingTextView element--> < com.tomer.fadingtextview.FadingTextView android:id = "@+id/fadingTextView" android:layout_width = "match_parent" android:layout_height = "wrap_content" android:layout_centerInParent = "true" android:gravity = "center" android:textSize = "30sp" /> <!--A button to increase or Decrease fading rate--> < Button android:id = "@+id/btnStart" android:layout_width = "wrap_content" android:layout_height = "wrap_content" android:layout_centerHorizontal = "true" android:layout_below = "@id/fadingTextView" android:text = "Faster or Slower" /> </ RelativeLayout > |
Step 4: Working with the MainActivity.kt file
Finally, go to the MainActivity.kt file, and refer the following code. Below is the code for the MainActivity.kt file. Comments are added inside the code to understand the code in more detail.
For Increasing the Fading Rate (Faster):
Kotlin
import android.os.Bundle import androidx.appcompat.app.AppCompatActivity import com.tomer.fadingtextview.FadingTextView import java.util.concurrent.TimeUnit class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super .onCreate(savedInstanceState) setContentView(R.layout.activity_main) // Strings to display in the FadingTextView val texts = arrayOf( "Welcome!" , "Hello" , "Geek" ) // Declaring FadingTextView val ftv = findViewById<FadingTextView>(R.id.fadingTextView) // Set the text array to FadingTextView (ftv) ftv.setTexts(texts) var timeout:Long = 1000 // setTimeout(Long or Double value only, TimeUnit) // TimeUnits: HOURS, MINUTES, SECONDS, MILLISECONDS // For every 1000 Milliseconds, the text in FTV will change ftv.setTimeout(timeout,TimeUnit.MILLISECONDS) // btn to increase the change rate or make things faster. val btn = findViewById<Button>(R.id.btnStart) btn.setOnClickListener{ // Setting timeout to the half of the current timeout /= 2 ftv.setTimeout(timeout,TimeUnit.MILLISECONDS) // Toast that displays current Timeout Toast.makeText(applicationContext, "Changes every $timeout Milliseconds" , Toast.LENGTH_SHORT).show() } } } |
Output: Run on Emulator
For Decreasing the Fading Rate (Slower):
Kotlin
import android.os.Bundle import androidx.appcompat.app.AppCompatActivity import com.tomer.fadingtextview.FadingTextView import java.util.concurrent.TimeUnit class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super .onCreate(savedInstanceState) setContentView(R.layout.activity_main) // Strings to display in the FadingTextView val texts = arrayOf( "Welcome!" , "Hello" , "Geek" ) // Declaring FadingTextView val ftv = findViewById<FadingTextView>(R.id.fadingTextView) // Set the text array to FadingTextView (ftv) ftv.setTexts(texts) var timeout:Long = 1 // setTimeout(Long or Double value only, TimeUnit) // TimeUnits: HOURS, MINUTES, SECONDS, MILLISECONDS // For every 1 Milliseconds, the text in FTV will change ftv.setTimeout(timeout,TimeUnit.MILLISECONDS) // btn to decrease the change rate or make things slower. val btn = findViewById<Button>(R.id.btnStart) btn.setOnClickListener{ // Setting timeout to twice of the current timeout *= 2 ftv.setTimeout(timeout,TimeUnit.MILLISECONDS) // Toast that displays current Timeout Toast.makeText(applicationContext, "Changes every $timeout Milliseconds" , Toast.LENGTH_SHORT).show() } } } |