Jetpack составляет BottomNavBar? Как можно использовать bottomNavbar любой пример?

Question

Я работаю над jectpack compose в приложении для Android. Поэтому я хочу использовать bottomAppbar. Не нашли ни одного примера, может кто-нибудь помочь?

Answer 1

Да jetpack compose поддержка BottomAppBar с простым и FloatingActionButton Проверьте приведенный ниже пример кода, который поможет вам больше

BottomAppBarWithoutFab

@Composable
fun BottomAppBarNoFab(getMyActionImage: () -> Image, getMyNavigationImage: () -> Image) {
    val someActionImage: Image = getMyActionImage()
    val someNavigationImage: Image = getMyNavigationImage()
    val navigationIcon: @Composable() () -> Unit = {
        AppBarIcon(someNavigationImage) { /* doSomething()*/ }
    }
    val actionData = listOf(someActionImage)
    BottomAppBar(
        navigationIcon = navigationIcon,
        actionData = actionData
    ) { actionImage ->
        AppBarIcon(actionImage) { /* doSomething()*/ }
    }
}

Проверка BottomAppbarWithoutFab Снимок экрана

BottomAppBarWithCutout

@Composable
fun BottomAppBarCutoutFab(
    getMyActionImage: () -> Image,
    getMyNavigationImage: () -> Image
) {
    val someActionImage: Image = getMyActionImage()
    val someNavigationImage: Image = getMyNavigationImage()
    val navigationIcon: @Composable() () -> Unit = {
        AppBarIcon(someNavigationImage) { /* doSomething()*/}
    }
    val actionData = listOf(someActionImage)
    BottomAppBar(
        navigationIcon = navigationIcon,
        fabConfiguration = BottomAppBar.FabConfiguration(cutoutShape = CircleShape) {
            FloatingActionButton(
                color = +themeColor { secondary },
                icon = +imageResource(R.drawable.ic_add_icon),
                onClick = { /** doSomething() */ })
        },
        actionData = actionData
    ) { actionImage ->
        AppBarIcon(actionImage) { /* doSomething()*/  }
    }
}

Проверка bottomAppbarcutoutFab снимок экрана

Проверьте ниже код, как мы вызываем в @Compose функцию

Column(mainAxisAlignment = MainAxisAlignment.End) {
        BottomAppBarNoFab(getMyActionImage = {
            +imageResource(R.drawable.ic_home_icon)
        }, getMyNavigationImage = {
            +imageResource(R.drawable.ic_heart_icon)
        })
    }