Why do I need to add a dependency on material when I use material3 when I want to use e.g. BottomNavigation?

Question

I don't understand the difference between these two dependencies and why I need them to create e.g. a BottomNavigationItem in M3.

So these are my dependencies:

def composeBom = platform("androidx.compose:compose-bom:2023.05.01")
implementation composeBom
androidTestImplementation composeBom
implementation 'androidx.compose.material3:material3'
implementation 'androidx.compose.material:material'
implementation 'androidx.compose.ui:ui'
implementation 'androidx.compose.runtime:runtime-livedata'

Now why do I need a dependency on both androidx.compose.material3:material3 and androidx.compose.material:material to use BottomNavigationItem and just a regular M3 Text? Isn't this dependency androidx.compose.material:material just M1? Why isn't BottomNavigationItem available in M3?

Because I need to have dependencies on both, I always need to specify which library I want to use when I want to create a UI component, like IconButton:

I already made many mistakes by importing the UI components from both the M3 library and the other one, causing a strange UI because the components are rendered differently.

Why isn't BottomNavigationItem in M3, but many components are? Like Scaffold, Text, Button, etc.

Answer 1

In Material 3 you have a NavigationBar and a NavigationBarItem instead of a BottomNavigationBar. To use a NavigationBar at the bottom of the screen you use a Scaffold and pass the NavigationBar in the bottomBar parameter:

Scaffold(
    bottomBar = { NavigationBar {
        NavigationBarItem(
            icon = ...
            label = ...
            onClick = ...
            selected = ...
        )
        ...
    },
    content = ... 
}