如何在macOS中将SwiftUI菜单项与复选标记对齐?

如何在macOS中将SwiftUI菜单项与复选标记对齐?,swift,xcode,macos,swiftui,Swift,Xcode,Macos,Swiftui,我正在尝试在MacOS应用程序中使用swiftUI制作菜单 基于此: 我正在使用这个特定的代码 struct SelectionRow: View { var title: String var isSelected: Bool var action: () -> Void var body: some View { Button(action: self.action) { HStack {

我正在尝试在MacOS应用程序中使用swiftUI制作菜单

基于此:

我正在使用这个特定的代码

struct SelectionRow: View {
    var title: String
    var isSelected: Bool
    var action: () -> Void

    var body: some View {
        Button(action: self.action) {
            HStack {
                if self.isSelected {
                    Image("checkmark")
                        .resizable()
                        .renderingMode(.template)
                        .scaledToFit()
                } else {
                    //FIXME: What to add here ???!!! <-- Need to add solution here I believe
                }
                Text(self.title)
                    //.frame(alignment: .trailing). <-- Not effective
            }
        }.foregroundColor(Color.black)
    }
}

如果您查看图像,“两个”菜单项与“一个”和“三个”菜单选项不对齐,因为存在选项“一”和“三个”的复选标记图像。 我尝试使用最小宽度的间隔棒(以及其他一些选项),但似乎不起作用,并且将“二”与“一”和“三”对齐


您能推荐任何可以解决此问题并使“二”与“一”和“三”对齐的方法吗?

以下是可能的方法-只需使其不可见,而不是删除:

Image("checkmark")
    .resizable()
    .renderingMode(.template)
    .scaledToFit()
    .opacity(self.isSelected ? 1 : 0)
    .id(self.isSelected ? 1 : 2)        // << try to add !!
图像(“选中标记”)
.可调整大小()
.renderingMode(.template)
.scaledofit()
.不透明度(自选?1:0)

.id(self.isSelected?1:2)/这并没有完全回答您提出的问题,而是指向我认为您的目标。尝试切换,而不是按钮,如下所示:

Menu("Example Menu") {
    let oneBinding = Binding<Bool>(
        get: { return true },
        set: { _,_ in } )
    Toggle(isOn: oneBinding) {
        Text("One")
    }

    Button {
        print("Two as a Button")
    } label: {
        Text("Two as a Button")
    }

    let twoBinding = Binding<Bool>(
        get: { return false },
        set: { _,_ in } )
    Toggle(isOn: twoBinding) {
        Text("Two as a Toggle")
    }

    let threeBinding = Binding<Bool>(
        get: { return true },
        set: { _,_ in } )
    Toggle(isOn: threeBinding) {
        Text("Three")
    }
}
菜单(“示例菜单”){
让oneBinding=Binding(
获取:{return true},
集合:{{,{in})
切换(isOn:oneBinding){
文本(“一”)
}
钮扣{
打印(“两个作为一个按钮”)
}标签:{
文本(“两个作为一个按钮”)
}
让twoBinding=绑定(
获取:{return false},
集合:{{,{in})
切换(isOn:twoBinding){
文本(“两个作为切换”)
}
让三个绑定=绑定(
获取:{return true},
集合:{{,{in})
切换(isOn:threeBinding){
文本(“三”)
}
}
以下是它在macOS上的外观:

以下是iOS:

项目标题全部对齐,无论是切换还是按钮,并且复选标记沿主方向扩展菜单。这不允许在菜单项中使用任意图像,但它适用于指示切换菜单项的复选标记的特定情况

像这样及时创建绑定并不是一种很好的编码风格,但是对于这样的代码片段来说,它是很有用的,并且可以清楚地说明发生了什么。对于这些,我已经硬编码了条件,但是您可以在绑定get和set方法中任意使用它们


我有一些类似这样的代码,可以在表示从远程服务器提取的数据的核心数据对象中切换几个布尔值。在绑定的get方法中,我返回已传递给视图的对象属性的值。在bindings的set方法中,我做了一点NSManagedObjectContext jig来创建对象的私有副本,在其中我将正在使用的属性设置为非自身,然后,我将私有对象传递给另一个对象中的方法,该方法将数据写入远程服务器并刷新持久存储中的真实副本。

只需为选中标记图像设置帧,然后添加一个具有相同帧的空视图,如果未选中,则使用EmptyView().frame(宽度:30),并为图像使用相同帧,但它不起作用。不知道为什么。可能是菜单不接受itI我尝试了相同的方法,但似乎不起作用,菜单不允许更改图像的不透明度(与问题无关:事实上我也尝试过更改图像的颜色,这似乎也不起作用)尝试使用
.id
强制重新创建,如更新的快照中所示
Menu("Example Menu") {
    let oneBinding = Binding<Bool>(
        get: { return true },
        set: { _,_ in } )
    Toggle(isOn: oneBinding) {
        Text("One")
    }

    Button {
        print("Two as a Button")
    } label: {
        Text("Two as a Button")
    }

    let twoBinding = Binding<Bool>(
        get: { return false },
        set: { _,_ in } )
    Toggle(isOn: twoBinding) {
        Text("Two as a Toggle")
    }

    let threeBinding = Binding<Bool>(
        get: { return true },
        set: { _,_ in } )
    Toggle(isOn: threeBinding) {
        Text("Three")
    }
}