Compose 屏幕适配

横竖屏适配

在传统的 Android View 中,横屏需要使用 land,竖屏需要使用 port:

在这里插入图片描述

而在 Compose 中完全可用代码编写:

@Composable
fun MyScreen() {
    val config = LocalConfiguration.current
    if (config.orientation == Configuration.ORIENTATION_LANDSCAPE) {
        // 横屏
        LandscapeScreen()
    } else {
        // 竖屏
        PortraitScreen()
    }
}

@Composable
fun LandscapeScreen() {
    Row(
        horizontalArrangement = Arrangement.Center,
        verticalAlignment = Alignment.CenterVertically
    ) {
        repeat(3) {
            Text(
                "横屏",
                textAlign = TextAlign.Center,
                fontSize = 50.sp
            )
        }
    }
}

@Composable
fun PortraitScreen() {
    Column(
        verticalArrangement = Arrangement.Center,
        horizontalAlignment = Alignment.CenterHorizontally
    ) {
        repeat(5) {
            Text(
                "竖屏",
                textAlign = TextAlign.Center,
                fontSize = 50.sp
            )
        }
    }
}

分辨率适配

需要使用可组合项 BoxWithConstraints 组件。

@Composable
fun MyScreenAdapter() {
    BoxWithConstraints(contentAlignment = Alignment.Center) {
        when {
            minWidth < 360.dp -> {
                Text("小屏")
            }
            minWidth < 480.dp -> {
                Text("中屏")
            }
            minWidth < 720.dp -> {
                Text("大屏")
            }
            else -> {
                Text("其他")
            }
        }
    }
}
GitHub 加速计划 / compose / compose
33.27 K
5.15 K
下载
compose - Docker Compose是一个用于定义和运行多容器Docker应用程序的工具,通过Compose文件格式简化应用部署过程。
最近提交(Master分支:2 个月前 )
501b5acd Add `jhrotko` to Core Maintainers. Signed-off-by: Laura Brehm <laurabrehm@hey.com> 15 天前
f51bc4cd Signed-off-by: Guillaume Lours <705411+glours@users.noreply.github.com> 15 天前
Logo

旨在为数千万中国开发者提供一个无缝且高效的云端环境,以支持学习、使用和贡献开源项目。

更多推荐