Liquid Glass 是苹果公司为其图形用户界面开发的一种设计语言和动态视觉材质。它于 2025 年 6 月 9 日推出,将半透明表面与模拟的反射(光学)、折射及流畅的形态变换相结合。苹果为 iOS 26、iPadOS 26、macOS Tahoe 26、watchOS 26 和 tvOS 26 宣布的统一设计更新均以此为基础。这个名称描述的是通过软件渲染呈现的外观与行为,而非实体玻璃材料。(apple.com)
起源与应用范围
苹果在 2025 年全球开发者大会上展示了 Liquid Glass。该公司表示,此次设计更新的灵感来自 visionOS 的纵深感和立体感。面向开发者的介绍还回顾了其他设计渊源,包括 Mac OS X 的 Aqua 界面、iOS 7 引入的实时背景模糊、iPhone X 以手势驱动的流畅交互,以及能够改变形态的灵动岛。苹果将 Liquid Glass 描述为一种光学外观和运动方式可随情境变化的数字材质,而不是对普通实体物质的复刻。(apple.com)
此次设计更新并不局限于单个按钮,还涵盖导航栏、侧边栏、系统控件、应用图标、小组件及其他系统界面表面。其宣称的目标是在保留各平台自身特色的同时,提高苹果各操作系统之间的一致性。苹果还推出了 Icon Composer,用于制作具有浅色、深色、色调和透明外观的分层应用图标。(apple.com)
视觉与交互特征
光学效果
Liquid Glass 利用实时计算机图形学,营造出半透明物体悬浮于其他界面元素之上的观感。背景内容会影响其颜色,高光和阴影则有助于勾勒边界。其中一项核心效果是透镜效果:在表面轮廓附近,下方图像看起来会发生弯曲,从而无需使用完全不透明的背景,也能传达形状和层次区隔。(apple.com)
这种效果并非简单的透明填充。苹果的实现方式会模糊下方内容、反射周围颜色,并响应触摸和指针交互。这些特性还与形状变化及相关控件之间的过渡相结合。自定义元素可以移动、融合并相互变形,而不只是作为彼此独立的面板出现或消失。(developer.apple.com)
自适应与动态效果
这种材质的外观会根据周围环境和功能状态发生变化。苹果的演示展示了亮度、阴影及视觉厚度的调整。例如,当工具栏控件展开为菜单时,其纵深线索可以变得更明显,光散射也可以变得更柔和,使扩大后的表面显得更有实体感。因此,动态效果也参与表达控件与其所展开界面之间的关系。(developer.apple.com)
界面层级与材质变体
苹果的《人机界面指南》将 Liquid Glass 与界面其他位置使用的标准材质区分开来。Liquid Glass 主要用于包含导航与控件的功能层,例如标签栏和侧边栏。该层悬浮于内容之上,使下方的部分内容仍然可见。标准材质则用于在内容层内部形成视觉区隔。(developer.apple.com)
这一区分赋予了这种材质结构性作用,而不是将其视为适用于所有表面的装饰。苹果的指南不鼓励在内容背景中大范围使用它,也不鼓励不加区分地将其应用于自定义控件,因为这样可能削弱内容与交互之间的区隔。内容中短暂处于活动状态的控件,如滑块和开关,则属于例外。(developer.apple.com)
对于自定义组件,这种材质主要有两种变体:
- **常规(Regular):**通用的自适应变体。
- **透明(Clear):**透明度更高的变体,适用于视觉内容丰富的背景之上的元素,尤其适合媒体内容。
它们的外观还可以响应系统偏好设置,包括降低透明度或增强对比度的设置。因此,两者并不是可以简单互换的不透明度预设。(developer.apple.com)
开发者实现
Liquid Glass 已集成到苹果的界面框架中,包括 SwiftUI、UIKit 和 AppKit。当应用使用相应的软件开发工具包构建,并在支持它的系统版本上运行时,标准控件和导航组件便会采用更新后的外观。因此,采用这一设计不一定需要从头重建应用界面。(developer.apple.com)
自定义实现使用各框架专用的应用程序编程接口,包括 SwiftUI 的 glassEffect(_:in:)、UIKit 的 UIGlassEffect 和 AppKit 的 NSGlassEffectView。SwiftUI 还支持配置形状、着色和交互响应。其默认玻璃效果会在视图内容后方,以胶囊形状应用常规材质。(developer.apple.com)
采用这一设计时,仍需考虑现有的自定义背景、导航样式和动画。苹果的迁移文档要求审查这些自定义设置,并测试不同的显示与辅助功能配置,因为标准组件会自动适应,而独立实现的效果未必如此。(developer.apple.com)
无障碍支持与技术限制
Liquid Glass 包含与数字无障碍相关的适配。“降低透明度”“增强对比度”和“减弱动态效果”等设置可以改变其视觉呈现或动画。这些适配属于系统实现的一部分,说明这种材质并非只有一种固定的呈现方式。使用标准框架组件的应用会继承相应行为,自定义元素则需要单独测试。(developer.apple.com)
其透明度和动态效果也带来了设计约束。苹果提醒,过多的玻璃效果可能分散用户对内容的注意力,并降低界面层级的清晰度。要实现预期效果,关键在于前景控件、下方图像和材质自适应处理之间的关系,而不只是透明度本身。(developer.apple.com)
渲染开销是另一项限制。苹果的开发者文档指出,效果容器过多,或在容器之外应用过多效果,都可能导致性能下降。因此,除了视觉外观之外,同时呈现的效果数量及其渲染耗时也都是需要单独考虑的因素。(developer.apple.com)
参考来源
- Apple introduces a delightful and elegant new software designapple.com
- Liquid Glass | Apple Developer Documentationdeveloper.apple.com
- Meet Liquid Glass - WWDC25 - Videos - Apple Developerdeveloper.apple.com
- Materials | Apple Developer Documentationdeveloper.apple.com
- Adopting Liquid Glass | Apple Developer Documentationdeveloper.apple.com
- Applying Liquid Glass to custom views | Apple Developer Documentationdeveloper.apple.com