On my previous project I used this library as implementing of BottomNavigationView. I was really enjoying the way author implemented work with onNavigationItemSelectedListener and after that, on my next projects, I wanted to implement it for default BottomNavigationView. And in this article I will show you how to write and use it in MVVM architecture.

Implementing

1. Create interface [xml]&amp;lt;androidx.constraintlayout.widget.ConstraintLayout android:layout_width=&quot;match_parent&quot; android:layout_height=&quot;match_parent&quot; tools:context=&quot;.view.activity.home.MainActivity&quot;&amp;gt; &amp;lt;FrameLayout android:id=&quot;@+id/homeContainer&quot; android:layout_width=&quot;0dp&quot; android:layout_height=&quot;0dp&quot; app:layout_constraintBottom_toTopOf=&quot;@id/bottomNavigation&quot; app:layout_constraintEnd_toEndOf=&quot;parent&quot; app:layout_constraintStart_toStartOf=&quot;parent&quot; app:layout_constraintTop_toTopOf=&quot;parent&quot; /&amp;gt; &amp;lt;com.google.android.material.bottomnavigation.BottomNavigationView android:id=&quot;@+id/bottomNavigation&quot; android:layout_width=&quot;match_parent&quot; android:layout_height=&quot;wrap_content&quot; android:background=&quot;#FFFFFF&quot; android:elevation=&quot;8dp&quot; app:itemIconTint=&quot;@color/selector_bot_nav_color&quot; app:itemTextColor=&quot;@color/selector_bot_nav_color&quot; app:labelVisibilityMode=&quot;labeled&quot; app:layout_constraintBottom_toBottomOf=&quot;parent&quot; app:layout_constraintEnd_toEndOf=&quot;parent&quot; app:layout_constraintStart_toStartOf=&quot;parent&quot; app:menu=&quot;@menu/navigation_menu&quot; /&amp;gt; &amp;lt;/androidx.constraintlayout.widget.ConstraintLayout&amp;gt;[/xml] 2. Create 3 empty fragments with label in the centre of the screen [java]class HomeFragment : Fragment() { override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? { return inflater.inflate(R.layout.&lt;em&gt;fragment_home&lt;/em&gt;, container, false) } }[/java] 3.Create Enum with bottom navigation tabs [java]enum class BottomNavigationPage { TAB_HOME, TAB_EVENTS, TAB_LIBRARY }[/java] 4. Create ViewModel for MainActivity [java]class MainViewModel : ViewModel() { &lt;em&gt;//////////////////////////////////////////////////////////////////// /////////////// Live Data with getters //////////////// ///////////////////////////////////////////////////////////////////&lt;/em&gt; private val _homeItemClickedLD = MutableLiveData&amp;lt;Unit&amp;gt;() val homeItemClickedLD&lt;strong&gt;:&lt;/strong&gt; LiveData&amp;lt;Unit&amp;gt; get() = _homeItemClickedLD private val _eventsItemClickedLD = MutableLiveData&amp;lt;Unit&amp;gt;() val eventsItemClickedLD: LiveData&amp;lt;Unit&amp;gt; get() = _eventsItemClickedLD private val _libraryItemClickedLD = MutableLiveData&amp;lt;Unit&amp;gt;() val libraryItemClickedLD: LiveData&amp;lt;Unit&amp;gt; get() = _libraryItemClickedLD &lt;em&gt;////////////////////////////////////////////////////////////////////&lt;/em&gt; &lt;em&gt;//////////////////////////////// Calls /////////////////////////&lt;/em&gt; &lt;em&gt;/////////////////////////////////////////////////////////////////// &lt;/em&gt; fun onBottomItemChanged(position: Int) { when(values()[position]) { TAB_HOME -&amp;gt; _homeItemClickedLD.&lt;em&gt;execute&lt;/em&gt;() TAB_EVENTS -&amp;gt; _eventsItemClickedLD.&lt;em&gt;execute&lt;/em&gt;() TAB_LIBRARY -&amp;gt; _libraryItemClickedLD.&lt;em&gt;execute&lt;/em&gt;() } } }[/java] 5. Create extension for BottomNavigationView [java]fun BottomNavigationView.onItemSelected(function: (Int) -&amp;gt; Unit) { setOnNavigationItemSelectedListener { item -&amp;gt; for(i in0 &lt;em&gt;until menu&lt;/em&gt;.size()) { if (&lt;em&gt;menu&lt;/em&gt;.getItem(i).&lt;em&gt;itemId &lt;/em&gt;== item.&lt;em&gt;itemId&lt;/em&gt;) { function(i) } } return@setOnNavigationItemSelectedListener true}} fun BottomNavigationView.onItemReselected(function: (Int) -&amp;gt; Unit) { setOnNavigationItemReselectedListener { item -&amp;gt; for(i in0 &lt;em&gt;until menu&lt;/em&gt;.size()) { if(&lt;em&gt;menu&lt;/em&gt;.getItem(i).&lt;em&gt;itemId &lt;/em&gt;== item.&lt;em&gt;itemId&lt;/em&gt;) { function(i) } } } }[/java] 6. And implement these all parts of code in MainActivity [java]class MainActivity : AppCompatActivity() { private lateinit var viewModel: MainViewModel private lateinit var binding: ActivityMainBinding override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) binding = DataBindingUtil.setContentView(this, R.layout.&lt;em&gt;activity_main&lt;/em&gt;) viewModel = ViewModelProviders.of(this).get(MainViewModel::class.&lt;em&gt;java&lt;/em&gt;) binding.&lt;em&gt;bindData&lt;/em&gt;(BR.&lt;em&gt;viewmodel&lt;/em&gt;, viewModel) initViews() initObservers() } private fun initViews() { initBottomNavigation() } private fun initObservers() { viewModel.homeItemClickedLD.&lt;em&gt;obs&lt;/em&gt;(this) {&lt;em&gt;replaceFragment&lt;/em&gt;(R.id.&lt;em&gt;homeContainer&lt;/em&gt;, HomeFragment(), false) } viewModel.eventsItemClickedLD.&lt;em&gt;obs&lt;/em&gt;(this) {&lt;em&gt;replaceFragment&lt;/em&gt;(R.id.&lt;em&gt;homeContainer&lt;/em&gt;, EventsFragment(), false) } viewModel.libraryItemClickedLD.&lt;em&gt;obs&lt;/em&gt;(this) {&lt;em&gt;replaceFragment&lt;/em&gt;(R.id.&lt;em&gt;homeContainer&lt;/em&gt;, LibraryFragment(), false) } } private fun initBottomNavigation() { bottomNavigation.&lt;em&gt;onItemSelected &lt;/em&gt;{viewModel.onBottomItemChanged(it) } bottomNavigation.&lt;em&gt;onItemReselected &lt;/em&gt;{ } &lt;em&gt;replaceFragment&lt;/em&gt;(R.id.&lt;em&gt;homeContainer&lt;/em&gt;, HomeFragment(), false) } } [/java] Example:

So, I hope this article was interesting and useful for you and, of course, if you have any questions or suggestions for improvement, feel free to write me in comments. If you like this article, that I hope, you will probably like my other articles and find something interesting for you in them here. Thanks for reading.

More articles from Stepan:

BottomNavigation View with some magic

How to implement an EmptyState for RecyclerView