简体   繁体   English

SwiftUI - 使用 Toggle 隐藏列表项

[英]SwiftUI - hide list items using Toggle

I have found almost the perfect code for my needs.我找到了几乎可以满足我需求的完美代码。 But there is one problem:但是有一个问题:

I would like to use toggles in each row instead of buttons.我想在每一行中使用切换而不是按钮。

Original code posted by @kontiki here: SwiftUI hide list item from list item view @kontiki 在此处发布的原始代码: SwiftUI hide list item from list item view

import SwiftUI

struct Item: Identifiable {
    let id = UUID()
    var isComplete: Bool = false
}

class Model: ObservableObject {
    @Published var isOn: Bool = false
    @Published var arr = [Item(isComplete: true), Item(isComplete: false), Item(isComplete: true), Item(isComplete: false), Item(isComplete: true), Item(isComplete: true)]
}

struct ContentView: View {
    @ObservedObject var model = Model()

    var body: some View {
        List {

            Toggle(isOn: $model.isOn) { Text("Toggle") }

            ForEach(self.model.arr.filter { model.isOn ? true : $0.isComplete }) { item in
                Row(item: item, model: self.model)
            }
        }
    }
}

struct Row: View {
    let item: Item
    @ObservedObject var model: Model

    var body: some View {
        HStack {

            Button(action: {

                if let idx = self.model.arr.firstIndex(where: { $0.id == self.item.id }) {
                    self.model.arr[idx].isComplete.toggle()
                    self.model.isOn = false
                }

            }) {

                Text("Button")

            }

            Text(item.isComplete ? "Complete" : "Not complete")

        }
    }
}

Instead of button I have tried to use toggle like this:我尝试使用这样的切换而不是按钮:

Toggle(isOn: $item.isComplete) {
                Text("Done")
            }

There is this if statement inside button that I don't understand.按钮内有这个 if 语句,我不明白。 I have tried to take this let idx declaration outside of button too to make it easier for using toggle (as I don't know how to make such complicated toggle) but this also failed.我也尝试在按钮之外使用这个 let idx 声明,以便更容易地使用切换(因为我不知道如何进行如此复杂的切换),但这也失败了。

Note: There is known issue with Toggle control update in List.注意:列表中的切换控件更新存在已知问题。 Please be aware.请注意。 The details are in Problems with layout of some rows in SwiftUI list topic.详细信息在 SwiftUI 列表主题中某些行的布局问题中。

Here is possible approach.这是可能的方法。 Modified lines are marked in comments.修改的行在注释中标记。

import SwiftUI

struct Item: Identifiable, Equatable { // <<
    let id = UUID()
    var isComplete: Bool = false
}

class Model: ObservableObject {
    @Published var isOn: Bool = false
    @Published var arr = [Item(isComplete: true), Item(isComplete: false), Item(isComplete: true), Item(isComplete: false), Item(isComplete: true), Item(isComplete: true)]
}

struct ContentView: View {
    @ObservedObject var model = Model()

    var body: some View {
        List {

            Toggle(isOn: $model.isOn) { Text("Toggle") }

            ForEach(self.model.arr.filter { model.isOn ? true : $0.isComplete }) { item in
                Row(item: self.$model.arr[self.model.arr.firstIndex(of: item)!]) // <<
            }
        }
    }
}

struct Row: View {
    @Binding var item: Item // <<

    var body: some View {
        HStack {
            Toggle(isOn: $item.isComplete) {
                Text("Done")
            }
            Text(item.isComplete ? "Complete" : "Not complete")

        }
    }
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM