How to create a custom view for TextView and change text dynamically

Issue

The scenario I'd like to reproduce is :

Having a textView with a drawable left with a green text color (also the tint of the drawable) when tap on that TextView then change the color of the text and change the start drawable (also the tint of the drawable) that is shown for 5 seconds, once these 5 seconds have passed with a fade in/fade out animation change back to the initial state.

I've started creating a custom view

class MyCustomTextView @JvmOverloads constructor(
    context: Context,
    attrs: AttributeSet? = null,
    defStyleAttr: Int = 0,
    val coroutineScope: CoroutineScope,
) : ConstraintLayout(
    context,
    attrs,
    defStyleAttr
) {

    fun onClickToCopy(){
        //Add the animation to the new state
        coroutineScope.launch {
            delay(5_000L)
        }
        //With an animation come back to the initial state
    }

}

But now I'm stuck I don't know how to proceed with this, do I have to create an init{} with the initial state ?

Solution

Just to give a rough idea, you can do something like this:

<LinearLayout
     android:orientation="horizontal">
     <ImageView
          android:id="@+id/imageView"
          android:layout_height="40dp"
          android:layout_width="40dp"
          android:tint="@color/green"/>
     <TextView
          android:id="@+id/textView"
          android:textColor="@color/green"/>
</LinearLayout>

Then in your Activity/Fragment:

textView.setOnClickListener {
    textView.textColor = // New color
    imageView.imageResource = // New image
    imageView.tint = // New tint
    // For the delay you can use a normal Handler
    Handler(Looper.getMainLooper()).postDelayed(
        {
            // Animate these changes however you wish
            textView.textColor = // Original color
            imageView.imageResource = // Original image
            imageView.tint = // Original tint
        }, 
        5_000 // 5 sec delay
    )
}

(I don't remember all the properties so might have used some wrong property names here, but this should give you the general idea)

For the fade in/out part, you can use the common view animation apis. Checkout this and this SO threads to get some idea on how to animate views.

Answered By - Arpit Shukla