缩放与适应性#
GNOME 支持各种设备类型,包括桌面电脑、笔记本电脑、二合一设备和手机。在桌面电脑上,窗口也可以以各种尺寸使用,并且有时可以与其他窗口并排显示。因此,确保应用程序窗口在各种尺寸下都能良好地显示和运行非常重要。
自适应设计#
“自适应”一词指的是这种设计应用程序的方法,它可以根据不同的尺寸进行调整。自适应应用程序可以从适合手机或分屏的窄尺寸缩放到非常大的桌面尺寸,同时始终提供相同的功能。
关于设计和构建自适应应用程序的一些通用指导
遵循 GNOME 应用程序结构和渐进式披露的设计规范将有助于确保您的应用程序在各种尺寸下都能正常工作。将窗口细分为许多小窗格或面板很难使其具有适应性。
在设计 UI 布局时,从最受约束的环境(最小屏幕尺寸、最有限的输入设备)开始,然后逐步扩展到最不受约束的环境。这不仅有助于避免设计无法缩小的布局,还有助于集中界面并确保清晰的结构。
使用既定的模式和控件(例如 视图切换器)通常会更容易,因为它们通常是考虑到适应性而设计的。
鼓励使用列表模式来显示内容,因为它们可以很好地缩放到非常窄和非常宽的视图宽度。
确保每个容器的宽度始终感觉良好,无论窗口宽度如何,而无需用户手动调整大小。例如,侧边栏相对于主窗口区域不应显得过宽或过窄。
可以使用断点根据可用空间在不同的 UI 布局之间切换,这可用于优化不同形态因素的设计。例如,当窗口较窄时,可以使用底部面板替换实用窗格,或者可以将控件动态移动到仅在窄宽度下显示的工具栏。
调整窗口大小应平滑且无故障。例如,控件不应在没有动画的情况下跳动或消失。
请注意,硬件功能通常是动态的,并且可能与特定物理形态因素的预期不同。例如,大屏幕可以具有触摸功能,而小屏幕设备可以与物理键盘配对。
小尺寸处理#
GNOME 在桌面上的最小推荐显示尺寸为 1024×600px,所有应用程序都应支持此尺寸。适用于手机形态因素的应用程序应缩放到 360×294px。
大尺寸处理#
大窗口尺寸可能会带来一些挑战,包括
相关控件在物理上相距甚远
文本行变得不舒服地长
视觉结构(如网格)丢失
为了避免这些问题,请将内容放置在具有最大宽度的容器中。这些容器可以包括可见容器,例如 列表,或充当约束框架的不可见容器。