https://github.com/gitfrandu4/android-bottom-navigation-view

Bottom Navigation View
https://github.com/gitfrandu4/android-bottom-navigation-view

Last synced: 6 days ago
JSON representation

Bottom Navigation View

• Host: GitHub
• URL: https://github.com/gitfrandu4/android-bottom-navigation-view
• Owner: gitfrandu4
• Created: 2022-10-17T16:32:20.000Z (about 2 years ago)
• Default Branch: main
• Last Pushed: 2022-10-17T16:52:31.000Z (about 2 years ago)
• Last Synced: 2023-12-09T19:42:38.575Z (about 1 year ago)
• Language: Kotlin
• Size: 2.18 MB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Bottom Navigation View



https://material.io/components/bottom-navigation/android

Otro de los componentes que vemos en muchas apps  es el de BottomNavigationView, que es como una

barra de navegación con pestañas situada debajo de la pantalla.

Este componente se parece mucho al TabLayout, pero funcionan ligeramente diferente.

## Implementación

### Implementación 1/3

El siguiente código corresponde al componente en sí, habría que añadirlo en un fragment o bien en 

un activity

```xml

    

    

```

### Implementación 2/3

A continuación, hay que crear un recurso layout de tipo menu

The @menu/bottom_navigation_menu resource should point to a file named bottom_navigation_menu.xml 

inside a menu resource directory:

```xml

    

    

```

Note: BottomNavigationView does not support more than 5 menu items.

### Implementación 3/3

Por último, faltaría cambiar el componente en la activity o fragment

```kotlin

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {

        super.onCreate(savedInstanceState)

        setContentView(R.layout.activity_main)

        val bottom_navigation_view = findViewById(R.id.bottom_navigation_view)

        bottom_navigation_view.setOnItemSelectedListener { menuItem ->

            when(menuItem.itemId) {

                R.id.action_music -> {

                    goToFragment(MusicFragment())

                    true

                }

                R.id.action_films -> {

                    goToFragment(FilmsFragment())

                    true

                }

                R.id.action_books -> {

                    goToFragment(BooksFragment())

                    true

                }

                else -> false

            }

        }

        bottom_navigation_view.selectedItemId = R.id.action_music

    }

    fun goToFragment(fragment: Fragment) {

        supportFragmentManager.beginTransaction().replace(R.id.main_container, fragment).commit()

    }

    // childFragmentmanager.beginTransaction().replace(R.id.main_container, f).commit()

    // Para implementarlo en un Fragment en lugar de en un activity

}

```