SwiftUI WatchOS实现文本左侧带图片的Toggle列表报错求助

你的代码报错核心原因是Toggle构造器调用错误——SwiftUI（包括WatchOS）没有Toggle(Image, String, isOn: Binding<Bool>)这个重载方法，同时WatchOS的Form布局和iOS有细微差异，直接照搬iOS示例会导致显示异常。

以下是修正后的代码，可实现你需要的「文本左侧放图片」的Toggle列表效果：

import SwiftUI

struct EmailList: Identifiable {
    var img: Image
    var id: String
    var isOn = false
}

struct ContentView: View {
    @State var lists = [
        EmailList(img: Image(systemName: "car.fill"), id: "Monthly Updates", isOn: true),
        EmailList(img: Image(systemName: "car.fill"), id: "News Flashes", isOn: false),
        EmailList(img: Image(systemName: "car.fill"), id: "Special Offers", isOn: true)
    ]
    
    var body: some View {
        Form {
            Section {
                ForEach($lists) { $list in
                    // 使用自定义标签的Toggle构造器
                    Toggle(isOn: $list.isOn) {
                        HStack(alignment: .center, spacing: 12) {
                            list.img
                                .foregroundColor(.accentColor)
                            Text(list.id)
                        }
                    }
                }
            }
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

关键修改说明： #

• 替换了错误的Toggle初始化方式：改用Toggle(isOn: <Binding>) { /* 自定义标签内容 */ }的标准构造器，这是SwiftUI跨平台通用的自定义Toggle标签写法
• 用HStack包裹Image和Text：明确控制图片在左、文本在右的布局，同时通过spacing调整元素间距，适配WatchOS的小屏幕
• 可选优化：给Image添加foregroundColor，让图标和系统 accent 色统一，提升视觉一致性

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