与去年10月发行的first stable version of Material Design 3 for Compose一起,我们还获得了一个名为androidx.compose.material3:material3-window-size-class
的新小图书馆。它处理窗口大小类。
窗口尺寸类别的宽度和高度分为三组, compact , medium 和 展开。
group | 水平 | 垂直 |
---|---|---|
compact | <600 dp | <480 dp |
中 | <840 dp | <900 dp |
展开 | ¥840 dp | ¥900 dp |
这个想法是使用此广泛分类来定义屏幕布局。为了实现这一目标,软件包androidx.compose.material3.windowsizeclass
提供了一个名为calculateWindowSizeClass(activity: Activity)
的顶级组合函数,该功能返回了WindowSizeClass
实例。每当配置更改导致窗口的宽度或高度越过三个断点之一时,例如,当设备旋转或调整窗口大小时,都会返回一个新值。
WindowSizeClass
具有两个重要属性,widthSizeClass
和heightSizeClass
。他们将尺寸类别的尺寸类别用于窗户的宽度和高度,WindowWidthSizeClass
和WindowHeightSizeClass
。
这是一个简单的示例,它显示了如何利用新组合。它取自Googles documentation。
import androidx.activity.compose.setContent
import androidx.compose.material3.windowsizeclass.calculateWindowSizeClass
class MyActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
val windowSizeClass = calculateWindowSizeClass(this)
val useNavRail = windowSizeClass.widthSizeClass > WindowWidthSizeClass.Compact
MyScreen(useNavRail = useNavRail)
}
}
}
那么,这里发生了什么?如果屏幕宽度至少为Medium
,我们告诉MyScreen()
可以组合以显示A 导航导轨,这是一种材料设计组件,专为大屏幕设计。它具有沿左屏幕边框垂直运行的导航栏。
如果您一直关注本系列的先前分期,这听起来很熟悉。但是我没有提到新图书馆,我是吗?
no。
那是因为窗口大小类也是其他地方定义的。
JetPack WindowManager(androidx.window:window
)也有一个WindowSizeClass
类(它在包装内部的androidx.window.core.layout
中)。我在我的文章Code your UI中使用其compute()
功能。
那么,有什么区别?
幸运的是,并不多。虽然JetPack WindowManager类中的断点命名为COMPACT
,MEDIUM
和EXPANDED
(并且具有@JvmField
注释),但androidx.compose.material3.windowsizeclass
实现称为Compact
,Medium
,Medium
和Expanded
。显然,密度独立像素中的值是相同的。
您应该使用哪一个?
好吧,我强烈建议支持可折叠设备。如果这样做,无论如何,您可能需要JetPack WindowManager。而且,如果您还使用我的代码段,则在包装好的数据类中获得窗口大小的类值。我将扩展如何利用窗口大小类在本系列的下一部分中定义您的应用程序布局。
除非提到其他图像,否则所有图像均为(c)thomaskã¼nneth