Android Layout Transitions w/ Kotlin

Learn how to create layout transitions via my Tutorial on YouTube

Ever wonder how you can add simple animations to button clicks? Well, you came to the right place! You can either read below or head to my Tutorial on YouTube!

First create a new Android Project using Kotlin. Next modify the app build gradle to support layout transitions.

defaultConfig {
    applicationId "com.test.animationsdemo"
    minSdkVersion 21
    targetSdkVersion 28
    versionCode 1
    versionName "1.0"
    testInstrumentationRunner
    "android.support.test.runner.AndroidJUnitRunner"
}

Next we want to add some views to the MainActivity layouts.

Notice that I did create a custom button background btn_blue_bg.xml . Below is that code as well.

App layout

This is what the xml results in! We now have three layout transitions to create!

• Hide/Show TextView on click of a button
• Changing text of a button on click
• Changing height of a button on click

Hide/Show TextView on click of a button.

NoticeLayoutTransition.CHANGING_DISAPPEARING , there are a few different options but since we are hiding/showing an element we use that. We are also setting the LayoutTransition duration to 1000ms, which is 1 second. Below is the code and a gif of the transition.

Hide/Show TextView Animation

Changing Text of a button on click

Since we only want to change the text of the button we use LayoutTransition.CHANGING. Again we set the duration to 1 second. Below is the code and a gif of the transition.

Changing Text of a button on click

Changing Height of a button on click

Again since we are only changing the height we use LayoutTransition.CHANGING. Below is the code and a gif of the transition.

Change Height of button on click

Thank you for reading! Click here to check out my Social Media and other content!

If you have any questions leave them below!