kotlin,Jetpack Compose使用Scaffold布局,包含底部导航栏

复制代码
package com.example.dibudaohang

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.activity.enableEdgeToEdge
import androidx.compose.foundation.layout.padding
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Home
import androidx.compose.material.icons.filled.Person
import androidx.compose.material.icons.filled.Search
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.Modifier
import com.example.dibudaohang.ui.theme.DibudaohangTheme

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        enableEdgeToEdge()
        setContent {
            DibudaohangTheme {
                BottomNavigationExample()
            }
        }
    }
}

@Composable
fun BottomNavigationExample() {
    // 使用remember保存选中的项,初始值为0
    var selectedItem by remember { mutableStateOf(0) }
    // 定义底部导航栏的项
    val items = listOf("Home", "Search", "Profile")

    // 使用Scaffold布局,包含底部导航栏
    Scaffold(
        bottomBar = {
            // 创建底部导航栏
            NavigationBar {
                // 遍历items列表,为每个项创建一个NavigationBarItem
                items.forEachIndexed { index, item ->
                    NavigationBarItem(
                        // 根据index选择不同的图标
                        icon = {
                            when (index) {
                                0 -> Icon(Icons.Default.Home, contentDescription = item)
                                1 -> Icon(Icons.Default.Search, contentDescription = item)
                                2 -> Icon(Icons.Default.Person, contentDescription = item)
                            }
                        },
                        // 显示项的标签
                        label = { Text(item) },
                        // 判断当前项是否被选中
                        selected = selectedItem == index,
                        // 点击事件,更新选中的项
                        onClick = { selectedItem = index }
                    )
                }
            }
        }
    ) { innerPadding ->
        // 根据选中的项显示不同的内容
        when (selectedItem) {
            0 -> Text("Home Screen", modifier = Modifier.padding(innerPadding))
            1 -> Text("Search Screen", modifier = Modifier.padding(innerPadding))
            2 -> Text("Profile Screen", modifier = Modifier.padding(innerPadding))
        }
    }
}

注意:在最新的 Jetpack Compose 中,BottomNavigation 已经被 NavigationBar 取代。NavigationBar 是 androidx.compose.material3 包中的新组件,用于实现底部导航栏。
相关推荐
imDwAaY15 分钟前
操作系统如何管理程序运行?从线程、进程到内存隔离与用户态切换:CS162 Note2
android·java·redis
熊猫钓鱼>_>40 分钟前
Kotlin Multiplatform for OpenHarmony 实战:kotlinx-coroutines 结构化并发适配
开发语言·kotlin·agent·harmonyos·openharmony·适配·华为云码道
andyweike42 分钟前
Android文件系统
android
studyForMokey1 小时前
【Android 面试】Paging3
android·面试·职场和发展
企业数字化笔记1 小时前
租户停用后数据和任务怎么处理?冻结、恢复与保留策略的实现
android·java·spring boot
熊猫钓鱼>_>2 小时前
Kotlin Multiplatform for OpenHarmony 实战:kotlinx-serialization JSON 适配
开发语言·华为·kotlin·华为云·json·harmonyos·code
小程故事多_8012 小时前
从 Tokenizer 到 Next Token,穿透数据流,完整理解 Transformer 底层逻辑
android·深度学习·transformer
三少爷的鞋15 小时前
Android 协程实践:为什么不应将 `supervisorScope` 作为常规方案
android
承渊政道16 小时前
【从零开始大模型开发与微调:基于PyTorch与ChatGLM】(从ChatGLM本地化到LoRA、PEFT的高级微调)
android·人工智能·pytorch·chatglm·本地化部署·大模型开发与微调
倚楼听风语16 小时前
Kotlin 协程与 suspend 原理详解
java·算法·kotlin