Fix grid ids (#65)

* try to make item IDs work correctly * Add back tuple initializers
spacenation · Dec 30, 2019 · 9eb16bf · 9eb16bf
1 parent 40bf1ea
commit 9eb16bf
Show file tree

Hide file tree

Showing 2 changed files with 79 additions and 25 deletions.
diff --git a/Sources/Grid/Grid+Inits.swift b/Sources/Grid/Grid+Inits.swift
@@ -2,48 +2,97 @@ import SwiftUI
 
 extension Grid {
     public init<Data, Item>(_ data: Data, @ViewBuilder item: @escaping (Data.Element) -> Item) where Content == ForEach<Data, Data.Element.ID, Item>, Data : RandomAccessCollection, Item : View, Data.Element : Identifiable {
-        self.items = data.map({ AnyView(item($0)) })
+        self.items = data.map { GridItem(view: AnyView(item($0)), id: AnyHashable($0.id)) }
     }
 
     public init<Data, ID, Item>(_ data: Data, id: KeyPath<Data.Element, ID>, @ViewBuilder item: @escaping (Data.Element) -> Item) where Content == ForEach<Data, ID, Item>, Data : RandomAccessCollection, ID : Hashable, Item : View {
-        self.items = data.map({ AnyView(item($0)) })
+        self.items = data.map { GridItem(view: AnyView(item($0)), id: AnyHashable($0[keyPath: id])) }
     }
 
     public init<Item>(_ data: Range<Int>, @ViewBuilder item: @escaping (Int) -> Item) where Content == ForEach<Range<Int>, Int, Item>, Item : View {
-        self.items = data.map({ AnyView(item($0)) })
+        self.items = data.map { GridItem(view: AnyView(item($0)), id: AnyHashable($0)) }
     }
 }
 
 extension Grid {
     public init<C0: View, C1: View>(@ViewBuilder content: () -> Content) where Content == TupleView<(C0, C1)> {
-        self.items = [AnyView(content().value.0), AnyView(content().value.1)]
+        self.items = [GridItem(view: AnyView(content().value.0), id: AnyHashable(0)),
+                      GridItem(view: AnyView(content().value.1), id: AnyHashable(1))]
     }
-    
+
     public init<C0: View, C1: View, C2: View>(@ViewBuilder content: () -> Content) where Content == TupleView<(C0, C1, C2)> {
-        self.items = [AnyView(content().value.0), AnyView(content().value.1), AnyView(content().value.2)]
+        self.items = [GridItem(view: AnyView(content().value.0), id: AnyHashable(0)),
+                      GridItem(view: AnyView(content().value.1), id: AnyHashable(1)),
+                      GridItem(view: AnyView(content().value.2), id: AnyHashable(2))]
     }
-    
+
     public init<C0: View, C1: View, C2: View, C3: View>(@ViewBuilder content: () -> Content) where Content == TupleView<(C0, C1, C2, C3)> {
-        self.items = [AnyView(content().value.0), AnyView(content().value.1), AnyView(content().value.2), AnyView(content().value.3)]
+        self.items = [GridItem(view: AnyView(content().value.0), id: AnyHashable(0)),
+                      GridItem(view: AnyView(content().value.1), id: AnyHashable(1)),
+                      GridItem(view: AnyView(content().value.2), id: AnyHashable(2)),
+                      GridItem(view: AnyView(content().value.3), id: AnyHashable(3))]
     }
 
     public init<C0: View, C1: View, C2: View, C3: View, C4: View>(@ViewBuilder content: () -> Content) where Content == TupleView<(C0, C1, C2, C3, C4)> {
-        self.items = [AnyView(content().value.0), AnyView(content().value.1), AnyView(content().value.2), AnyView(content().value.3), AnyView(content().value.4)]
+        self.items = [GridItem(view: AnyView(content().value.0), id: AnyHashable(0)),
+                      GridItem(view: AnyView(content().value.1), id: AnyHashable(1)),
+                      GridItem(view: AnyView(content().value.2), id: AnyHashable(2)),
+                      GridItem(view: AnyView(content().value.3), id: AnyHashable(3)),
+                      GridItem(view: AnyView(content().value.4), id: AnyHashable(4))]
     }
-    
+
     public init<C0: View, C1: View, C2: View, C3: View, C4: View, C5: View>(@ViewBuilder content: () -> Content) where Content == TupleView<(C0, C1, C2, C3, C4, C5)> {
-        self.items = [AnyView(content().value.0), AnyView(content().value.1), AnyView(content().value.2), AnyView(content().value.3), AnyView(content().value.4), AnyView(content().value.5)]
+        self.items = [GridItem(view: AnyView(content().value.0), id: AnyHashable(0)),
+                      GridItem(view: AnyView(content().value.1), id: AnyHashable(1)),
+                      GridItem(view: AnyView(content().value.2), id: AnyHashable(2)),
+                      GridItem(view: AnyView(content().value.3), id: AnyHashable(3)),
+                      GridItem(view: AnyView(content().value.4), id: AnyHashable(4)),
+                      GridItem(view: AnyView(content().value.5), id: AnyHashable(5))]
     }
-    
+
     public init<C0: View, C1: View, C2: View, C3: View, C4: View, C5: View, C6: View>(@ViewBuilder content: () -> Content) where Content == TupleView<(C0, C1, C2, C3, C4, C5, C6)> {
-        self.items = [AnyView(content().value.0), AnyView(content().value.1), AnyView(content().value.2), AnyView(content().value.3), AnyView(content().value.4), AnyView(content().value.5), AnyView(content().value.6)]
+        self.items = [GridItem(view: AnyView(content().value.0), id: AnyHashable(0)),
+                      GridItem(view: AnyView(content().value.1), id: AnyHashable(1)),
+                      GridItem(view: AnyView(content().value.2), id: AnyHashable(2)),
+                      GridItem(view: AnyView(content().value.3), id: AnyHashable(3)),
+                      GridItem(view: AnyView(content().value.4), id: AnyHashable(4)),
+                      GridItem(view: AnyView(content().value.5), id: AnyHashable(5)),
+                      GridItem(view: AnyView(content().value.6), id: AnyHashable(6))]
     }
-
+
+    public init<C0: View, C1: View, C2: View, C3: View, C4: View, C5: View, C6: View, C7: View>(@ViewBuilder content: () -> Content) where Content == TupleView<(C0, C1, C2, C3, C4, C5, C6, C7)> {
+        self.items = [GridItem(view: AnyView(content().value.0), id: AnyHashable(0)),
+                      GridItem(view: AnyView(content().value.1), id: AnyHashable(1)),
+                      GridItem(view: AnyView(content().value.2), id: AnyHashable(2)),
+                      GridItem(view: AnyView(content().value.3), id: AnyHashable(3)),
+                      GridItem(view: AnyView(content().value.4), id: AnyHashable(4)),
+                      GridItem(view: AnyView(content().value.5), id: AnyHashable(5)),
+                      GridItem(view: AnyView(content().value.6), id: AnyHashable(6)),
+                      GridItem(view: AnyView(content().value.7), id: AnyHashable(7))]
+    }
+
     public init<C0: View, C1: View, C2: View, C3: View, C4: View, C5: View, C6: View, C7: View, C8: View>(@ViewBuilder content: () -> Content) where Content == TupleView<(C0, C1, C2, C3, C4, C5, C6, C7, C8)> {
-        self.items = [AnyView(content().value.0), AnyView(content().value.1), AnyView(content().value.2), AnyView(content().value.3), AnyView(content().value.4), AnyView(content().value.5), AnyView(content().value.6), AnyView(content().value.7), AnyView(content().value.8)]
+        self.items = [GridItem(view: AnyView(content().value.0), id: AnyHashable(0)),
+                      GridItem(view: AnyView(content().value.1), id: AnyHashable(1)),
+                      GridItem(view: AnyView(content().value.2), id: AnyHashable(2)),
+                      GridItem(view: AnyView(content().value.3), id: AnyHashable(3)),
+                      GridItem(view: AnyView(content().value.4), id: AnyHashable(4)),
+                      GridItem(view: AnyView(content().value.5), id: AnyHashable(5)),
+                      GridItem(view: AnyView(content().value.6), id: AnyHashable(6)),
+                      GridItem(view: AnyView(content().value.7), id: AnyHashable(7)),
+                      GridItem(view: AnyView(content().value.8), id: AnyHashable(8))]
     }
-    
+
     public init<C0: View, C1: View, C2: View, C3: View, C4: View, C5: View, C6: View, C7: View, C8: View, C9: View>(@ViewBuilder content: () -> Content) where Content == TupleView<(C0, C1, C2, C3, C4, C5, C6, C7, C8, C9)> {
-        self.items = [AnyView(content().value.0), AnyView(content().value.1), AnyView(content().value.2), AnyView(content().value.3), AnyView(content().value.4), AnyView(content().value.5), AnyView(content().value.6), AnyView(content().value.7), AnyView(content().value.8), AnyView(content().value.9)]
+        self.items = [GridItem(view: AnyView(content().value.0), id: AnyHashable(0)),
+                      GridItem(view: AnyView(content().value.1), id: AnyHashable(1)),
+                      GridItem(view: AnyView(content().value.2), id: AnyHashable(2)),
+                      GridItem(view: AnyView(content().value.3), id: AnyHashable(3)),
+                      GridItem(view: AnyView(content().value.4), id: AnyHashable(4)),
+                      GridItem(view: AnyView(content().value.5), id: AnyHashable(5)),
+                      GridItem(view: AnyView(content().value.6), id: AnyHashable(6)),
+                      GridItem(view: AnyView(content().value.7), id: AnyHashable(7)),
+                      GridItem(view: AnyView(content().value.8), id: AnyHashable(8)),
+                      GridItem(view: AnyView(content().value.9), id: AnyHashable(9))]
     }
 }
diff --git a/Sources/Grid/Grid.swift b/Sources/Grid/Grid.swift
@@ -1,9 +1,14 @@
 import SwiftUI
 
+struct GridItem: Identifiable {
+    let view: AnyView
+    let id: AnyHashable
+}
+
 /// A view that arranges its children in a grid.
 public struct Grid<Content>: View where Content: View {
     @Environment(\.gridStyle) private var style
-    let items: [AnyView]
+    let items: [GridItem]
     @State private var itemsPreferences: [AnyHashable : GridItemPreferences] = [:]
 
     public var body: some View {
@@ -26,15 +31,15 @@ public struct Grid<Content>: View where Content: View {
     private func grid(with geometry: GeometryProxy) -> some View {
         ScrollView(self.style.axis == .vertical ? .vertical : .horizontal) {
             ZStack(alignment: .topLeading) {
-                ForEach(0..<self.items.count, id: \.self) { index in
-                    self.items[index]
+                ForEach(self.items) { item in
+                    item.view
                         .frame(
-                            width: self.style.autoWidth ? self.itemsPreferences[AnyHashable(index)]?.bounds.width : nil,
-                            height: self.style.autoHeight ? self.itemsPreferences[AnyHashable(index)]?.bounds.height : nil
+                            width: self.style.autoWidth ? self.itemsPreferences[item.id]?.bounds.width : nil,
+                            height: self.style.autoHeight ? self.itemsPreferences[item.id]?.bounds.height : nil
                         )
-                        .alignmentGuide(.leading, computeValue: { _ in self.itemsPreferences[AnyHashable(index)]?.bounds.origin.x ?? 0 })
-                        .alignmentGuide(.top, computeValue: { _ in self.itemsPreferences[AnyHashable(index)]?.bounds.origin.y ?? 0 })
-                        .background(GridItemPreferencesModifier(id: AnyHashable(index), bounds: self.itemsPreferences[AnyHashable(index)]?.bounds ?? .zero))
+                        .alignmentGuide(.leading, computeValue: { _ in self.itemsPreferences[item.id]?.bounds.origin.x ?? 0 })
+                        .alignmentGuide(.top, computeValue: { _ in self.itemsPreferences[item.id]?.bounds.origin.y ?? 0 })
+                        .background(GridItemPreferencesModifier(id: item.id, bounds: self.itemsPreferences[item.id]?.bounds ?? .zero))
                         .anchorPreference(key: GridItemBoundsPreferencesKey.self, value: .bounds) { [geometry[$0]] }
                 }
             }