SwiftUI-Agent-Skill 玩转 Liquid GlassiOS 26 玻璃效果的完整 API 与降级策略【免费下载链接】SwiftUI-Agent-SkillAdd expert SwiftUI Best Practices guidance to your AI coding tool (Agent Skills open format).项目地址: https://gitcode.com/gh_mirrors/sw/SwiftUI-Agent-SkillSwiftUI-Agent-Skill是一个面向 AI 编程工具的 SwiftUI 最佳实践技能包其中专门收录了Liquid GlassiOS 26 新设计语言的完整 API 清单与降级策略。安装后你的 AI 助手在帮你写玻璃效果代码时会自动遵循glassEffect、GlassEffectContainer的使用规范并为旧版 iOS 自动准备 Material 材质兜底方案避免玻璃只在 iOS 26 上才生效的尴尬。为什么新手要关注 Liquid Glass 玻璃效果Liquid Glass 是 Apple 在iOS 26推出的全新设计语言半透明、会随内容与交互流动的玻璃质感界面。它不只是调个模糊背景而是一整套新 APIglassEffect—— 给任意视图加玻璃效果的核心修饰符GlassEffectContainer—— 让一组玻璃元素共享采样区域视觉更统一玻璃按钮样式——.glass与.glassProminent内置样式glassEffectID—— 配合Namespace实现玻璃元素的形变过渡对新手来说最大的坑在于这些 API 全部要求 iOS 26低版本必须降级。这也是 liquid-glass.md 这份参考文档存在的原因——它把这些坑和对策一次性讲清楚了。glassEffect 核心 API三种风格一次说清glassEffect接受一个Glass风格参数只有三种可选值不存在.prominent风格效果适用场景.regular标准玻璃外观最常用按钮、卡片、工具栏.clear近乎隐形的玻璃面轻提示、装饰性元素.identity无操作的透传占位、条件切换两个高频用法染色.glassEffect(.regular.tint(.blue))给玻璃加上品牌色需要更突出时调高 tint 透明度即可交互响应.glassEffect(.regular.interactive())让玻璃对触摸/悬停有反馈——但只用在真正可点击的元素上静态内容别加一个容易翻车的细节修饰符顺序玻璃效果必须放在布局与视觉修饰符之后顺序是字体 → 颜色 → 内边距 → 最后才是.glassEffect()。顺序写反玻璃形状就会和预期不符。GlassEffectContainer玻璃不能采样另一块玻璃这是新手最容易忽视的一条规则玻璃材质是靠采样自身更大范围的内容来折射光影的相邻的两块玻璃互相看不见。如果把两个玻璃按钮随意放在一起视觉结果会不一致。解决办法是把它们包进GlassEffectContainer让整组元素共享一个采样区域GlassEffectContainer(spacing: 24) { HStack(spacing: 24) { GlassChip(icon: pencil) GlassChip(icon: eraser) } }⚠️ 容器里的spacing参数要和布局里的实际间距保持一致否则玻璃渲染会出错。此外如果多个玻璃视图需要视觉上合并成一块但结构上保持独立还可以用glassEffectUnion(id:namespace:)。形变过渡让玻璃像水一样流动想要小卡片展开成大卡片的丝滑动画需要满足 4 个条件两个视图使用相同的glassEffectID使用同一个Namespace外层包上GlassEffectContainer动画如.animation(.smooth, value: ...)施加在容器或父视图上这套玻璃形变写法在 liquid-glass.md 的 Morphing Transitions 一节有完整示例。降级策略旧版 iOS 的 Material 材质兜底所有 Liquid Glass API 都需要 iOS 26 或更高版本所以降级不是可选项而是必选项。文档给出的标准做法是if #available(iOS 26, *) { content.glassEffect() } else { content.background(.ultraThinMaterial, in: RoundedRectangle(cornerRadius: 16)) }五个 Material 材质按透明度从高到低排列其中.ultraThinMaterial最接近玻璃观感是首选兜底.ultraThinMaterial→.thinMaterial→.regularMaterial→.thickMaterial→.ultraThickMaterial。进阶技巧可以封装一个glassEffectWithFallback扩展在扩展内部完成#available判断业务代码就完全不用关心版本了。上手方式让 AI 助手替你把关这个技能的价值在于自动化。把仓库克隆到本地后交给你的 AI 编程工具即可git clone https://gitcode.com/gh_mirrors/sw/SwiftUI-Agent-Skill关键文件一览主技能定义SKILL.md —— 规定了仅在用户明确要求时才采用 Liquid Glass等 10 条操作规则玻璃效果完整参考liquid-glass.md工具栏玻璃按钮补充toolbar-patterns.md其他安装方式INSTALLATION.md值得注意的是技能的克制原则AI 不会主动把你的界面全部改成玻璃风只有你明确说用 Liquid Glass 重做这个界面时才会启用这套参考。Liquid Glass 最佳实践清单照着这份清单自检就能避开绝大多数坑✅ 每个玻璃 API 都有#available(iOS 26, *) 材质降级✅ 成组的玻璃元素包在GlassEffectContainer里间距参数与布局一致✅glassEffect写在所有布局修饰符之后✅.interactive()只给可交互元素❌ 别给每个元素都套玻璃——点到为止❌ 别在工具栏后加自定义压暗背景它会和新版滚动边缘自动模糊效果打架❌ 半高 Sheet 默认就是 Liquid Glass 背景自定义presentationBackground(_:)记得删掉一句话总结玻璃效果的新 API 不难难的是顺序、分组和降级三件事——而这正是 SwiftUI-Agent-Skill 帮你锁死的部分。【免费下载链接】SwiftUI-Agent-SkillAdd expert SwiftUI Best Practices guidance to your AI coding tool (Agent Skills open format).项目地址: https://gitcode.com/gh_mirrors/sw/SwiftUI-Agent-Skill创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考