how to remove default animation transition when using navigation component in Android?

Question

I am using Navigation component, and I have a bottom navigation view in the main activity. when I tap the tab in that bottom navigation view, it seems that there is a fade in animation when the fragment appear. I don't think I manually set the animation, it seems that the animation will be there by default.

I want to remove that animation. here is the code I use in my Main Activity.

class MainActivity : AppCompatActivity(), NavController.OnDestinationChangedListener {

    private lateinit var navController : NavController
    lateinit var destinationTitleTextView : TextView
    lateinit var progressBar : ProgressBar
    lateinit var topToolbar : Toolbar
    lateinit var bottomNavigationView : BottomNavigationView

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        FirebaseApp.initializeApp(this)

        // Initial Setup views
        navController = Navigation.findNavController(this,R.id.nav_host_fragment)
        setupBottomNavMenu(navController)
        setupActionBar(navController)
        setUpViewDeclaration()


        // Add Listeners
        navController.addOnDestinationChangedListener(this)


    }



    private fun setUpViewDeclaration() {
        destinationTitleTextView = findViewById(R.id.destination_label_text_view)
        progressBar = findViewById(R.id.progressBar_main_activity)
        topToolbar = findViewById(R.id.top_toolbar)
        bottomNavigationView = findViewById(R.id.bottom_nav)

    }

    private fun setupBottomNavMenu(navController: NavController) {
        bottom_nav.setupWithNavController(navController)
    }


    private fun setupActionBar(navController: NavController) {

        setSupportActionBar(top_toolbar)
        supportActionBar?.setDisplayShowTitleEnabled(false)

        // set up top hierarchy destination
        val appBarConfiguration = AppBarConfiguration(setOf(
            R.id.destination_home,
            R.id.destination_search,
            R.id.destination_user_control,
            R.id.destination_create_event)
        )

        top_toolbar.setupWithNavController(navController,appBarConfiguration)

    }


}

Answer 1

UPDATE: The latest file path please see comment below.

---

You can add anim file to replace the default animation.

• res/anim/nav_default_enter_anim.xml
• res/anim/nav_default_exit_anim.xml
• res/anim/nav_default_pop_enter_anim.xml
• res/anim/nav_default_pop_exit_anim.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <!--Empty to disable animation-->
</set>

[Navigation Component] I can`t change animation from NavigationUI.setupWithNavController()

Answer 2

@HvSimon has provided a solution to set the global default which hasn't worked for me. Also I would like to choose/disable the animations per transition.

You can supply additional arguments to navigate() with a NavOptions object.

First create an animation in your res folder like res/anim/nav_enter_anim.xml (empty for no animation):

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <!--Empty to disable animation-->
</set>

Create one animation xml per animation or reuse the same. Then supply a NavOptions object to your navigate() call like so:

val animationOptions = NavOptions.Builder().setEnterAnim(R.anim.nav_enter_anim)
            .setExitAnim(R.anim.nav_exit_anim)
            .setPopEnterAnim(R.anim.nav_pop_enter_anim)
            .setPopExitAnim(R.anim.nav_pop_exit_anim).build()

findNavController().navigate(MyFragmentDirections.toMainActivity(), animationOptions)

Answer 3

As per this issue:

NavigationUI is a set of helpers which follow the material design guidelines and that includes animations between BottomNavigationView items.

And you'll note in the Transitions section of the Material design guidelines, they specifically state:

Transition between active and inactive bottom navigation destinations using a cross-fade animation.

Therefore Navigation does not provide any API for customizing or removing the animations.

Note that the Navigation 2.1.0-alpha03 release did have this change:

The default animations provided by NavigationUI have been sped up from 400ms to 220ms to match the default animation speed of activities and fragments. b/130055522

So I'd suggest 1) upgrading to Navigation 2.1.0-alpha03 or higher to get the updated animations and 2) following the material design guidelines.

Of course, NavigationUI is totally optional and you can certainly do whatever you want using the underlying OnDestinationChangedListener that NavigationUI uses under the hood.