Shaky bottom nav icon animation I have this material bottom navigation view inside every fragment for each feature(plan, edu, therapy, profile):

<com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bottomNavigation"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:elevation="@dimen/elevation_6dp"
            app:backgroundTint="@color/md_theme_surface"
            app:itemIconTint="@color/bottom_nav_icon_color_selector"
            app:itemTextColor="@color/bottom_nav_text_color_selector"
            app:itemTextAppearanceActive="@style/label_medium"
            app:labelVisibilityMode="labeled"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:menu="@menu/bottom_navigation_menu" />

and im using function declaring the nav controller inside every Fragment, for example in the EducationFragment.kt:

private fun setupBottomNavigationView() {
        binding.bottomNavigation.menu.getItem(0).isCheckable = true  // Plan
        binding.bottomNavigation.menu.getItem(1).isChecked = true    // Education (selected)
        binding.bottomNavigation.menu.getItem(2).isCheckable = true  // Therapy
        binding.bottomNavigation.menu.getItem(3).isCheckable = true  // Profile

        binding.bottomNavigation.setOnItemSelectedListener { menuItem ->
            when (menuItem.itemId) {
                R.id.menuNavbarPlan -> {
                    findNavController().navigate(R.id.action_educationFragment_to_planFragment)
                    true
                }

                R.id.menuNavbarEducation -> {
                    // Already on education fragment
                    true
                }

                R.id.menuNavbarTherapy -> {
                    findNavController().navigate(R.id.action_educationFragment_to_therapyFragment)
                    true
                }

                R.id.menuNavbarProfile -> {
                    findNavController().navigate(R.id.action_educationFragment_to_profileFragment)
                    true
                }

                else -> false
            }
        }
    }

but somehow, as you can see in the gif the icon of the navbar is shaky when i’m changing between features, and sometimes it’s like the Plan menu is about to be selected.

I’ve tried to declare the iconSize app:itemIconSize="24dp" inside the xml fragment file of the bottomNavigationView, but it still didn’t work, I’m guessing the problem occurs in each Plan/Education/Therapy/ProfileFragment.kt file but i didn’t know how to solve it. Should i move the private fun setupBottomNavigationView() to the MainActivity? (for context i only have 1 Activity file which is MainActivity and it’s instantly navigating into the SplashFragment.