Post

Replies

Boosts

Views

Activity

Reply to How to create a scrollable list in which the items can be edited, reordered, added, and removed?
After a crazy amount of effort, I finally managed to create a view that resembles the images in the question. Here is the result: Here is how I did it List(selection: $selectedObject) { Foreach($objectList) { object in Text(object.name) .tag(object) } .onMove(perform: moveRows) .onDelete(perform: deleteRow) /* this use swiping to remove a row */ } .listStyle(.bordered(alternatesRowBackgrounds: true)) .safeAreaInset(edge: .bottom) { HStack { Button(action: addRow) { Image(systemName: "plus") } /* uncomment this if you don't want to use swipe to delete a row Button(action: deleteRow) { Image(systemName: "minus") } */ Spacer() } .buttonStyle(.plain) .padding(5) .background(.background) /* otherwise the background is translucent */ .border(.tertiary) /* otherwise no border is shown */ } func addRow() { /* make a new object */ objectList.append(newObject) } func deleteRow(offset: IndexSet) { objectList.remove(atOffsets: offset) } func moveRows(from source: IndexSet, to destination: Int) { objectList.move(fromOffsets: source, toOffset: destination) } The solution is a bit complicated and involves several manual adjustion. It seems like this style is not implemented as a native style in SwiftUI
Topic: UI Frameworks SubTopic: SwiftUI Tags:
Mar ’23