如果您想在 iOS 应用程序的导航栏中放置 3 个图标，您会怎么做？

Question

我有一个 iOS 应用程序，我需要向导航栏添加 3 个图标，但是，当用户滚动屏幕时，这 3 个图标在导航栏中占用了太多空间，以至于页面标题 (这将移动到导航栏的顶部中心）在 SE 上被截断为只有几个字母（320 像素宽度）。

我也觉得 3 个图标对于 iPhone 上的导航栏来说太多了，我以前从未见过它。

有没有人有解决这个难题的解决方案或他们设计或看到的屏幕示例？

我考虑过旧的省略号，但设置和操作 Sheet 不应该在省略号内。 谢谢

---

---

Answer 1

我可以想到三种方法来在保留导航栏标题的同时让所有这些按钮都适合屏幕：

浮动角按钮

Outlook 应用就是一个很好的例子，如下所示： code-along 上的很棒的例子 Medium 如果你想了解如何制作它的细节。本质上是一个带有按钮和视图其余部分的 ZStack。

列表按钮

我目前在我自己的应用程序中使用它来释放导航栏中的一些 space： 无论列表中有什么，“添加新类别”按钮始终是列表视图中的第一项。

导航栏 VStack 按钮

Outlook 也做类似的事情，但您可以在 ToolbarItem object 中使用 VStack 将按钮放在导航栏标题下方，如下所示： 这是使用以下代码完成的：

NavigationView {
    Text("Hello, SwiftUI!")
        .navigationBarTitleDisplayMode(.inline)
        .toolbar {
            ToolbarItem(placement: .principal) {
                VStack {
                    Text("Title").font(.headline)
                    Button("Subtitle") {
                        
                    }
                }
            }
        }
}

（从 surunw.com 复制）

除了您说要避开的省略号选项外，这三个是我能想到的突出选项。