在 iOS 上彰显品牌风格

一句话判断

iOS 26 的 Liquid Glass（液态玻璃）彻底终结了”魔改导航栏”的时代，Apple 明确划定界限：UI 层老老实实用系统组件，品牌个性全部塞进内容层。

这场 Session 讲了什么

以前很多 App 为了彰显品牌，喜欢把 NavigationBar 和 TabBar 改得面目全非，结果就是用户换个 App 就要重新学一遍怎么返回。iOS 26 引入 Liquid Glass 后，Apple 直接给出了分层模型：悬浮的 UI 层和底部的 Content 层（内容层）。

现在的规矩是，UI 层必须保持原生，用标准的网格、表格和上下文菜单（Context Menu）。你的品牌色、全出血（full-bleed）图片、自定义字体和动效，统统给我塞进 Content 层。比如把以前顶部的品牌色移到 ScrollView 里，让 Liquid Glass 控件去”吸取”底部的颜色。

这对那些喜欢高度定制导航栏的 App 影响最大。设计师和客户端开发需要重构 UI 架构，把精力从”造轮子”转移到”打磨内容区动效和排版”上。说白了，别在系统控件上抢戏，去你的内容画布里发光发热。

值得深挖的点

Liquid Glass 带来的”颜色下沉”与 UI 分层

Apple 这次强推 Liquid Glass，其实是想解决以前品牌色导致导航栏笨重、遮挡内容的问题。以前我们在 NavigationBar 上糊一层高饱和度的品牌色，不仅让界面显得头重脚轻，还压缩了内容区的可视面积。

现在 Apple 建议把颜色移入内容区域（Content area）。当用户在 ScrollView 里滚动时，品牌色在底部铺开，顶部的 Liquid Glass 控件会动态吸取这些颜色，产生折射和融合效果。这个设计的 trade-off 很明显：牺牲了顶部导航栏的强品牌曝光，换取了更沉浸的内容体验和极高的系统一致性。

坑在哪？如果你的内容区顶部没有颜色，或者颜色太碎、对比度太低，Liquid Glass 控件就会显得灰暗，甚至看不清里面的图标。开发者需要在 ScrollView 顶部做好颜色铺垫，或者在内容区使用大面积的渐变色（像 Session 里提到的 Moonlitt 模拟夜空渐变），给玻璃提供足够的”底色”。

自定义字体与 Dynamic Type 的强制绑定

排版是彰显品牌最廉价也最有效的方式，但很多 App 用了自定义字体后，就彻底抛弃了 Dynamic Type（动态字体）。这在 Apple 看来是绝对不可接受的，因为无障碍（Accessibility）是底线。

Session 里特意拿 Crumbl 举例，他们用了自己的 Crumbl Sans 字体，但当用户在系统设置里把字号调到最大时，布局依然能完美折行，没有截断。这背后的设计选择是：放弃”固定像素的排版美感”，拥抱”弹性的内容可读性”。

如果你用 SwiftUI，千万别直接写死 .font(.custom("MyFont", size: 24))。必须使用 relativeTo 参数，让自定义字体跟随系统的文本样式（Text Style）缩放。如果不这么做，视障用户放大字号时，你的 UI 会直接文字重叠或溢出屏幕，这种体验比不用自定义字体还要糟糕。

代码片段

1. 让自定义字体完美支持 Dynamic Type

场景：使用品牌自定义字体，同时确保用户在系统设置中放大字号时，布局能自动适应。

Text("本周新口味：巧克力碎片")
    // 使用自定义字体，并绑定到系统的 .title 样式
    // 当用户调整系统字号时，它会按 .title 的比例缩放
    .font(.custom("CrumblSans-Bold", size: 24, relativeTo: .title))
    // 允许文本在空间不足时换行，而不是截断
    .lineLimit(nil) 
    .fixedSize(horizontal: false, vertical: true)

坑：如果不加 relativeTo: .title，字体大小就写死了。另外，别忘了加 .fixedSize(horizontal: false, vertical: true)，否则放大字号后文本高度算不对，会被直接切断。

场景：放弃自己手写的长按弹出框，使用系统标准的上下文菜单，并带入品牌图标，白嫖系统的形变动效。

struct MoonPhaseView: View {
    var body: some View {
        Image("moon_full")
            .resizable()
            .frame(width: 100, height: 100)
            // 使用系统标准的上下文菜单
            .contextMenu {
                Button {
                    // 处理设置逻辑
                } label: {
                    Label("月相设置", systemImage: "gearshape")
                }
                
                Button(role: .destructive) {
                    // 处理删除逻辑
                } label: {
                    Label("移除观测", systemImage: "trash")
                }
            }
    }
}

坑：如果你在 Label 里用自定义的 Image("my_icon")，尺寸和基线没对齐的话，系统自带的弹出形变动效（morphing animation）会非常诡异。尽量用 SF Symbols，或者确保自定义图标严格遵循 24x24 且带正确的 baseline。

最佳实践

已有项目的迁移策略：全面审查 App 的 NavigationBar 和 TabBar。移除自定义背景色、阴影和高度魔改。把品牌色下移到 ScrollView 的 Header 或背景中。检查所有自定义字体，补全 relativeTo 参数以支持 Dynamic Type。
新项目的采用建议：直接使用标准组件（网格、表格、Context Menu）。把设计资源投入到内容区的插图、UX 写作（语气和语调）以及动效上。比如用 SwiftUI 的 .transition(.scale) 或 matchedGeometryEffect 让内容区的交互更丝滑。
实战中容易踩的坑：千万别在 Liquid Glass 悬浮的区域放高对比度的复杂图案或细密条纹，会导致玻璃折射效果显得”脏乱”。另外，Logo 不要常驻在导航栏正中间，最好像 NYT Cooking 那样只在主页显示，并在滚动时淡出，把宝贵的屏幕空间留给内容。

还有什么值得关注

SF Symbols 扩充到 7000+：而且直接内置在 Xcode 里，客户端开发可以直接敲代码调用，再也不用等设计师切图导出和交接了。
跨平台图标规范：即使你设计了极具品牌特色的自定义图标，“分享”这种通用操作也必须遵循 iOS 原生范式（向上箭头），别把 Android 或 Web 的分享图标直接搬过来。
小组件（Widget）是品牌延伸的利器：Crumbl 的小组件设计被点名表扬，如果用户觉得你的数据有价值，一个高辨识度、配色柔和的桌面小组件比 App 内的开屏广告更能强化品牌心智。