具有 10 多个项目的 SwiftUI 菜单按钮答案

【问题标题】：SwiftUI MenuButton with more than 10 Items具有 10 多个项目的 SwiftUI 菜单按钮
【发布时间】：2020-05-06 13:30:35
【问题描述】：

我有一个 SwiftUI 菜单按钮，可以很好地处理 10 个或更少的项目：

struct ContentView: View {
    var body: some View {
        MenuButton("My Button") {
            Button("A") { }
            Button("B") { }
            Button("C") { }
            Button("D") { }
            Button("E") { }
            Button("F") { }
            Button("G") { }
            Button("H") { }
            Button("I") { }
            Button("J") { }
        }
    }
}

但是，当添加第 11 个项目时，它不会编译，因为 SwiftUI 将组的大小限制为 10。对于普通组（如 VStack），我只会将一些项目包装在 Group 或 @ 987654330@，但这会破坏MenuButton 的视觉效果。

将前 5 个元素包装在 Group 中：

将前 5 个元素包装在 Section 中：

将前 5 个元素包裹在 VStack 中（间距很好，但整个组可以一起选择）：

这样做的正确方法是什么？

【问题讨论】：

标签： macos swiftui

【解决方案1】：

这是一个解决方案 - 您可以保留一系列项目来配置每个菜单项按钮。使用 Xcode 11.4 测试。

struct TestLongMenuButton: View {
    let actions = ["A","B","C","D","E","F","G","H","I","J","K","L"]

    var body: some View {
        MenuButton("My Button") {
            ForEach(actions, id: \.self) { action in
                Button(action) { }
            }
        }
    }
}

【讨论】：

【解决方案2】：

Asperi 的解决方案是可靠的。这是一个版本，它允许对具有相对编译安全性的每个项目执行不同的操作（只要每个标签可以不同）。

struct ContentView: View {
    enum Item: String, CaseIterable {
        case a = "Label A"
        case b = "Label B"

        func performAction() -> Void {
            switch self {
            case .a:
                print("Doing a")
            case .b:
                print("Doing b")
            }
        }
    }

    var body: some View {
        MenuButton("My Button") {
            ForEach(Item.allCases, id: \.self) { key in
                Button(key.rawValue, action: key.performAction)
            }
        }
    }
}

【讨论】：