如何允许 ForEach 布局项在 SwiftUI 中显示数组中的重复项?
How to allow ForEach layout item to show duplicate item from array in SwiftUI?
我正在开发多选答案测验应用程序。
var itemsTemp = ["ant","bat", "bear", "bee", "bird", "butterfly", "camel", "cat", "cheetah","chick", "chicken"]
已更新
这是我的测验应用程序示例。
let answerIndex = Int.random(in: 0...3) // for correct answer
itemsTemp!.shuffle() // to multiple choose option change.
这里是错误:
Thread 1: Fatal error: each layout item may only occur once
波纹管代码崩溃
LazyVGrid(columns: [GridItem(),GridItem()],spacing: 16) {
ForEach(itemsTemp) { item in
VStack {
Text(item).id(UUID())
.matchedGeometryEffect(id:UUID(), in: namespace, isSource: !show)
.onTapGesture{
print(" tapped!")
}
}.matchedGeometryEffect(id: "container\(UUID())", in: namespace)
}
}
这是一个测验应用程序,因此可以选择多个选项来 select 正确答案。数组项将在每个循环中多次出现。
所以需要每个布局项多次出现。
为唯一标识符。使用模型数组而不是字符串数组。
首先,创建一个模型。
struct Item: Identifiable {
var id = UUID()
var name: String
}
那么,你的数组是
var itemsTemp: [Item] = [
.init(name: "ant"),
.init(name: "bat"),
.init(name: "ant"),
.init(name: "bear"),
.init(name: "bee"),
.init(name: "ant"),
.init(name: "butterfly"),
.init(name: "bear")
]
现在,你的循环是
//Other Code
ForEach(itemsTemp, id:\.id) { item in
//Other Code
}
//Other Code
第二种方法是使用.indices
。
//Other Code
ForEach(itemsTemp.indices) { index in
let item = temsTemp[index]
//Other Code
}
//Other Code
尝试使用模型:
struct Item: Identifiable {
var id = UUID()
var name: String
}
class Model: ObservableObject {
var items: [Item] = [
.init(name: "ant"),
.init(name: "bat"),
.init(name: "ant"),
.init(name: "bear"),
.init(name: "bee"),
.init(name: "ant"),
.init(name: "butterfly"),
.init(name: "bear")
]
@Published var itemsSuffled: [Item] = []
init() {
shuffle()
}
func shuffle() {
itemsSuffled = items.shuffled()
}
}
struct ContentView: View {
@Namespace private var namespace
@ObservedObject private var model: Model = Model()
var body: some View {
VStack {
LazyVGrid(columns: [GridItem(),GridItem()],spacing: 16) {
ForEach(model.itemsSuffled) { item in
VStack {
Text(item.name).id(UUID())
.matchedGeometryEffect(id:UUID(), in: namespace, isSource: true)
.onTapGesture{
print(" tapped!")
}
}.matchedGeometryEffect(id: "container\(UUID())", in: namespace)
}
}
Button(action: {
model.shuffle()
}, label: {
Text("new shuffle")
})
}
}
}
我正在开发多选答案测验应用程序。
var itemsTemp = ["ant","bat", "bear", "bee", "bird", "butterfly", "camel", "cat", "cheetah","chick", "chicken"]
已更新 这是我的测验应用程序示例。
let answerIndex = Int.random(in: 0...3) // for correct answer
itemsTemp!.shuffle() // to multiple choose option change.
这里是错误:
Thread 1: Fatal error: each layout item may only occur once
波纹管代码崩溃
LazyVGrid(columns: [GridItem(),GridItem()],spacing: 16) {
ForEach(itemsTemp) { item in
VStack {
Text(item).id(UUID())
.matchedGeometryEffect(id:UUID(), in: namespace, isSource: !show)
.onTapGesture{
print(" tapped!")
}
}.matchedGeometryEffect(id: "container\(UUID())", in: namespace)
}
}
这是一个测验应用程序,因此可以选择多个选项来 select 正确答案。数组项将在每个循环中多次出现。
所以需要每个布局项多次出现。
为唯一标识符。使用模型数组而不是字符串数组。
首先,创建一个模型。
struct Item: Identifiable {
var id = UUID()
var name: String
}
那么,你的数组是
var itemsTemp: [Item] = [
.init(name: "ant"),
.init(name: "bat"),
.init(name: "ant"),
.init(name: "bear"),
.init(name: "bee"),
.init(name: "ant"),
.init(name: "butterfly"),
.init(name: "bear")
]
现在,你的循环是
//Other Code
ForEach(itemsTemp, id:\.id) { item in
//Other Code
}
//Other Code
第二种方法是使用.indices
。
//Other Code
ForEach(itemsTemp.indices) { index in
let item = temsTemp[index]
//Other Code
}
//Other Code
尝试使用模型:
struct Item: Identifiable {
var id = UUID()
var name: String
}
class Model: ObservableObject {
var items: [Item] = [
.init(name: "ant"),
.init(name: "bat"),
.init(name: "ant"),
.init(name: "bear"),
.init(name: "bee"),
.init(name: "ant"),
.init(name: "butterfly"),
.init(name: "bear")
]
@Published var itemsSuffled: [Item] = []
init() {
shuffle()
}
func shuffle() {
itemsSuffled = items.shuffled()
}
}
struct ContentView: View {
@Namespace private var namespace
@ObservedObject private var model: Model = Model()
var body: some View {
VStack {
LazyVGrid(columns: [GridItem(),GridItem()],spacing: 16) {
ForEach(model.itemsSuffled) { item in
VStack {
Text(item.name).id(UUID())
.matchedGeometryEffect(id:UUID(), in: namespace, isSource: true)
.onTapGesture{
print(" tapped!")
}
}.matchedGeometryEffect(id: "container\(UUID())", in: namespace)
}
}
Button(action: {
model.shuffle()
}, label: {
Text("new shuffle")
})
}
}
}