SwiftUI多平台应用：如何让下拉菜单标题左对齐

问题根源是你给Menu设置固定宽度menuWidth后，SwiftUI默认将菜单内容在frame内居中展示，导致两个菜单的标题无法左对齐。

只需要给frame添加alignment参数，指定内容左对齐即可，修改后的代码如下：

HStack(spacing: 10){
    Menu("Min length:") {
        Button("None") {
            crosswordsState.minWordLength = nil
        }
        ForEach(validWordLengths, id: \.self) { value in
            Button(String(value)) {
                crosswordsState.minWordLength = value
            }
        }
    }
    // 添加alignment: .leading让菜单标题在frame内左对齐
    .frame(width: menuWidth, alignment: .leading)
    Text(crosswordsState.minWordLength.map { String($0) } ?? "None")
    Spacer()
}
HStack(spacing: 10){
    Menu("Max word length:") {
        Button("None") {
            print("None button pressed")
            crosswordsState.maxWordLength = nil
        }
        ForEach(validWordLengths, id: \.self) { value in
            Button(String(value)) {
                print(value)
                crosswordsState.maxWordLength = value
            }
        }
    }
    // 同样添加左对齐参数
    .frame(width: menuWidth, alignment: .leading)
    Text(crosswordsState.maxWordLength.map { String($0) } ?? "None")
    Spacer()
}

这样修改后，两个菜单的标题会在各自的frame内靠左对齐，最终在页面上呈现整齐的左对齐效果。

内容的提问来源于stack exchange，提问作者Duncan C