为了适应不断增大的屏幕尺寸,我们在 ProtoLayout Material 布局模板和 Figma 设计布局中纳入了自适应行为,以便槽位自动调整。从本质上讲,槽的设计目的是填充可用宽度。我们的边距设为百分比,并在屏幕底部和顶部的槽中添加了额外的内边距,以应对屏幕放大时曲线的波动。
为了充分利用更大的屏幕尺寸和额外的空间,不妨考虑利用额外的屏幕空间,让用户访问更多信息或选项,从而提供更多价值。除了内置的响应式行为之外,实现这些布局还需要进行额外的自定义。为此,您可以在断点后面向布局添加更多实用内容。请务必注意,建议的断点设置为 225dp 屏幕尺寸。
基本术语
响应式设计:一种设计方法,可让布局动态设置按钮、文本字段和对话框等元素的格式和位置,以提供最佳用户体验。利用自适应设计实践,在更大的屏幕上自动为用户提供额外价值。无论是一次可查看更多文字、屏幕上显示更多操作,还是更大、更易于访问的点按目标,响应式做法都能为大屏设备用户提供更出色的体验。
自适应设计:一种设计方法,界面会根据已知的用户、设备或环境条件而发生变化。Material 中的自适应设计包括布局和组件自适应。
构建自适应且经过优化的设计
为了确保您的设计布局能够适应较大的屏幕尺寸,我们更新了布局和组件的行为,使其具有内置的响应式行为,包括基于百分比的内边距和内边距。如果您使用的是我们的 ProtoLayout 模板,则可以通过 ProtoLayout API 和Beta 版版本说明自动继承这些更新,并且只需提供在屏幕尺寸断点后添加了其他内容或组件的布局。如需有关如何充分利用更大屏幕尺寸的完整指南和建议,请参阅我们的功能块指南。功能块的屏幕高度是固定的,因此我们调整了内边距,以最大限度地利用有限的屏幕空间,同时避免出现不必要的剪裁。