对于包含的信息超出屏幕高度或需要更长、更沉浸式体验的网页,请使用滚动视图。
预设滚动布局组件
底部按钮堆栈对话框

底部按钮堆栈对话框

底部带有双按钮的对话框

自定义滚动布局示例
滚动应用界面不限于设置的组件,而是可以组合元素来创建所需的布局。请注意滚动屏幕的长度,并使用响应式(百分比)边距和内边距,以验证组件是否能适应可用的屏幕尺寸。
大屏幕上的其他内容

按钮列表:图标大小为 26dp 的图标按钮

按钮列表:应用按钮,图标大小为 32dp

按钮列表:图标大小为 36dp 的应用按钮

包含切换按钮的按钮列表

包含单行元素的混合列表

包含多行元素的混合列表

包含应用卡片的卡片列表

包含标题卡片的卡片列表

包含自定义卡片的卡片列表

文字列表

响应式和自适应行为
Compose 库中的所有组件都会自动适应更宽的屏幕尺寸,并增加宽度和高度。采用自适应设计实践的滚动视图通常可以适应各种屏幕尺寸。不过,在某些特殊情况下,您可以使用断点来替换尺寸并扩充布局,从而扩展功能、提高一览性或使内容更适合屏幕。
如需验证自适应参数是否已正确定义,请使用以下核对清单:
- 应用建议的顶部、底部和侧边距。
- 以百分比值定义外边距,以防止在可滚动容器的开头和结尾处出现剪裁。
- 在界面元素之间应用固定 DP 值的边距。
- 考虑在 225dp 处应用断点,以便在大屏幕尺寸下引入更多内容或使现有内容更易于浏览。