android compose DropdownMenu 菜单项列表 使用

android compose DropdownMenu 菜单项列表 使用

/**
 * Author : wn
 * Email : maoning20080809@163.com
 * Date : 2026/1/7 20:33
 * Description : 菜单项列表
 */
class DropdownMenuActivity : ComponentActivity(){

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        setContent {
            testDropdownMenu()
        }
    }

    @Preview
    @Composable
    private fun testDropdownMenu() {
        var expanded by remember { mutableStateOf(false) }
        var items = listOf("菜单1", "菜单2", "菜单3")
        var selectedIndex by remember { mutableStateOf(0) }

        Column(
            modifier = Modifier.fillMaxSize(),
            horizontalAlignment = Alignment.CenterHorizontally
        ) {
            Text(text = "DropdownMenu菜单项列表")

            Spacer(modifier = Modifier.height(20.dp))

            Box(
                modifier = Modifier.fillMaxWidth(),
                contentAlignment = Alignment.Center
            ) {
                // 将 Button 和 DropdownMenu 放在同一个 Box 中
                Box {
                    Button(onClick = {
                        expanded = true
                    }) {
                        Text(text = items[selectedIndex])
                    }

                    // DropdownMenu 默认会锚定到调用它的位置
                    // 这里它会在 Button 的位置弹出
                    DropdownMenu(
                        expanded = expanded,
                        onDismissRequest = { expanded = false },
                        offset = DpOffset(x = 60.dp, y = 0.dp) // 向右偏移 60dp（大约在右下角）
                    ) {
                        items.forEachIndexed { index, label ->
                            DropdownMenuItem(
                                text = { Text(text = label) },
                                onClick = {
                                    selectedIndex = index
                                    expanded = false
                                }
                            )
                        }
                    }
                }
            }
        }
    }
}