Android @Compose将如何处理 Android 中的屏幕尺寸和方向



Android@Compose将如何处理 Android 中的屏幕大小和方向。 谷歌搜索后我找不到合适的答案。有人可以回答这个问题吗?

您可以像这样检查方向:

val configuration = LocalConfiguration.current
when(configuration.orientation) {
Configuration.ORIENTATION_LANDSCAPE -> {}
Configuration.ORIENTATION_PORTRAIT -> {}
Configuration.ORIENTATION_SQUARE -> {}
Configuration.ORIENTATION_UNDEFINED -> {}
}

对于屏幕尺寸:

BoxWithConstraints() {
// thats what you can access:
this.maxWidth
this.maxHeight
this.minWidth
this.minHeight
}

有了1.0.x,您可以使用可组合BoxWithConstraints根据屏幕大小定义不同的 UI。

像这样:

BoxWithConstraints {
if (minWidth < 480.dp) {
/* .... */
} else if (minWidth < 720.dp) {
/* .... */
} else {
/* .... */
}
}

要处理方向,您可以使用LocalConfiguration.
如下所示:

val configuration = LocalConfiguration.current
when (configuration.orientation) {
Configuration.ORIENTATION_LANDSCAPE -> {
/* ... */
}
else -> {
/* ... */
}
}

}

这两件事都可以在返回Configuration对象的LocalConfiguration.current的帮助下访问。

对于定向,如您所知,存在一个属性orientation

LocalConfiguration.current.orientation

同样,还有另外两个属性。

LocalConfiguration.current.screenWidthDpLocalConfiguration.current.screenHeightDp

这应该有助于您的方案,您希望在可组合对象的签名中使用它,而不必在其范围内执行相同的操作,例如,这可以在修饰符中用于相应地调整可组合对象的大小。

但是,对于Modifier用于调整可组合大小,我建议改用fillMaxHeight(/*fraction/*)fillMaxWidth(/*fraction*/)。很明显,分数是它应该占用的父可组合空间的分数。如果父可组合是setContent,或者如果父可组合拉伸到整个屏幕(例如,使用fillMaxSize()修饰符的Surface(,则这将相对于屏幕尺寸本身。因此,fillMaxHeight(0.1f)将使可组合物的高度相当于屏幕高度的十分之一。您可以在此处学习作曲途径来学习基本概念。这可能并不简单,但可能有助于为声明式范式建立更好的基础。

根据新的androidx.compose.material3.windowsizeclass库添加更新的答案。

现在,您可以使用WindowSizeClass查询宽度和高度类。此库专门用于构建自适应布局,并在活动的大小/方向更改时自动重构布局。

此 API 为您提供宽度和高度的粗略大小(COMPACTMEDIUMEXPANDING(。这使得处理可折叠设备和大屏幕显示器等设备变得容易。

这是我写的一个简单的示例实现:-

class MainActivity {
/* ...... */
setContent {
val windowSizeClass = calculateWindowSizeClass(this)
/* .... */
MyApp(windowWidthSizeClass = windowSizeClass.widthSizeClass, /* .... */ )
}
}
@Composable
fun MyApp(windowWidthSizeClass: WindowWidthSizeClass, /* ... */) {
when(windowWidthSizeClass) {
WindowWidthSizeClass.Expanded -> // orientation is landscape in most devices including foldables (width 840dp+)
WindowWidthSizeClass.Medium -> // Most tablets are in landscape, larger unfolded inner displays in portrait (width 600dp+)
WindowWidthSizeClass.Compact -> // Most phones in portrait
}
}

在这里,我可以将布局设置为windowWidthSizeClass等于WindowWidthSizeClass.Expanded时的横向视图。 我可以使用WindowWidthSizeClass.Medium宽度来优化平板电脑和可折叠设备等大型设备的布局。 最后,WindowWidthSizeClass.Compact告诉我大多数手机都是纵向的,我可以相应地更新我的 UI。

这些相同的枚举也可用于活动的高度,但文档指出 -

大多数应用可以通过仅考虑宽度来构建响应式 UI 窗口大小类。

(到目前为止,对我来说是正确的(

请注意,此库仍处于 alpha 阶段,并显式标记为实验性,因此可能会更改。

官方指南 - https://developer.android.com/guide/topics/large-screens/support-different-screen-sizes#window_size_classes

可以在 JetNews 示例应用程序 - https://github.com/android/compose-samples/tree/main/JetNews 中找到示例实现。

文档 - https://developer.android.com/reference/kotlin/androidx/compose/material3/windowsizeclass/package-summary

发行说明(在 1.0.0-alpha10 中发布,当前版本 - alpha13( - https://developer.android.com/jetpack/androidx/releases/compose-material3#1.0.0-alpha10

最新更新