-
Notifications
You must be signed in to change notification settings - Fork 98
Open
Description
DemoItem(color: Color.random, colums: 2, rows: 1),
DemoItem(color: Color.random, colums: 2, rows: 1),
DemoItem(color: .random, colums: 2, rows: 2, height: 160),
DemoItem(color: .random, colums: 2, rows: 1),
DemoItem(color: .random, colums: 2, rows: 2, height: 160),
DemoItem(color: .random, colums: 2, rows: 1),
i think the first 6 items will fill the 4 rows, but it will a litter more space
let me show my codes
import ExyteGrid
import SwiftUI
struct DemoItem: Identifiable, Equatable {
var id: UUID = .init()
var color: Color = .red
var colums: Int = 2
var rows: Int = 1
var height: CGFloat = 80
init(id: UUID = UUID(), color: Color, colums: Int, rows: Int, height: CGFloat = 80) {
self.id = id
self.color = color
self.colums = colums
self.rows = rows
self.height = height
}
}
struct PackingExample: View {
@State var gridPacking = GridPacking.sparse
@State var items: [DemoItem] = [
DemoItem(color: Color.random, colums: 2, rows: 1),
DemoItem(color: Color.random, colums: 2, rows: 1),
DemoItem(color: .random, colums: 2, rows: 2, height: 160),
DemoItem(color: .random, colums: 2, rows: 1),
DemoItem(color: .random, colums: 2, rows: 2, height: 160),
DemoItem(color: .random, colums: 2, rows: 1),
DemoItem(color: .random, colums: 2, rows: 1),
DemoItem(color: .random, colums: 4, rows: 2, height: 160),
DemoItem(color: .random, colums: 2, rows: 1),
DemoItem(color: .random, colums: 2, rows: 1),
DemoItem(color: .random, colums: 2, rows: 1),
DemoItem(color: .random, colums: 2, rows: 1),
DemoItem(color: .random, colums: 2, rows: 1),
]
@State private var draggingItem: DemoItem?
private var packingPicker: some View {
Picker("Packing", selection: $gridPacking) {
withAnimation {
ForEach([GridPacking.sparse, GridPacking.dense], id: \.self) {
Text($0 == .sparse ? "SPARSE" : "DENSE")
.tag($0)
}
}
}
.pickerStyle(SegmentedPickerStyle())
}
var body: some View {
VStack {
packingPicker
if #available(iOS 16.0, *) {
Grid(tracks: 4, spacing: 0) {
ForEach(items) { item in
Group {
item.color
.overlay {
Text(item.id.uuidString)
}
}
.gridItemAlignment(.top)
.gridSpan(column: item.colums, row: item.rows)
.frame(height: item.height)
// .frame(height: 80.0 * CGFloat(item.rows) + CGFloat(item.rows - 1) * 10)
.onDrag {
withAnimation {
draggingItem = item
}
return NSItemProvider(object: "\(item.id)" as NSString)
}
.onDrop(
of: [.text],
delegate: DragRelocateDelegate(item: item, list: $items, current: $draggingItem)
)
}
}
.gridPacking(gridPacking)
.gridAnimation(.default)
.gridContentMode(.scroll)
.gridCommonItemsAlignment(.top)
.gridContentAlignment(.top)
} else {
// Fallback on earlier versions
}
}
}
}
struct PackingExample_Previews: PreviewProvider {
static var previews: some View {
PackingExample()
}
}
Metadata
Metadata
Assignees
Labels
No labels
