기어가더라도 제대로

[SwiftUI-기초] onDelete() - List의 row 삭제하기(Array item delete) 본문

SwiftUI - 기초

[SwiftUI-기초] onDelete() - List의 row 삭제하기(Array item delete)

Damagucci-juice 2022. 11. 4. 16:59
  • list - forEach 는 짝궁이다.
  • 간편하게 list를 만드는 방법도 있음
List(0..<arr.count) {
    Text("Row \(arr[$0])")
}
  • 그러나, 근본은 List 와 ForEach 를 조합해서 사용하는 것..
struct ContentView: View {
    @State private var numbers = [Int]()
    @State private var currentNumber = 1

    var body: some View {
        VStack {
            List {
                ForEach(numbers, id: \.self) {
                    Text("Row \($0)")
                }
            }

            Button("Add Number") {
                numbers.append(currentNumber)
                currentNumber += 1
            }
        }
    }
}
  • 이렇게 보통은 List 를 쓴다.
  • 여기서 특정 item을 지우고 싶을 때 어떻게 하면 좋을까?
    • ForEach에 .onDelete() 를 사용
  • Array, Set, Dictionary 와 같은 타입들을 Collection 이라고하는데, 각각의 element 들은 자신들의 위치에 해당하는 IndexSet 이라는 것을 가지고 있음
  • 그래서 IndexSet을 이용해서 배열을 편집할 수 있음
// content view.body
ForEach(numbers, id: \.self) {
    Text("Row \($0)")
}
.onDelete(perform: removeRows)

// contentView
func removeRows(at offsets: IndexSet) {
    numbers.remove(atOffsets: offsets)
}
  • numbers 배열에서 특성 IndexSet 을 삭제하는 함수를 만들었음
  • .onDelete() modifier 에서는 그것을 실행할 것인데, 파라미터를 나타내는 부분이 없음
    • 파라미터를 안넘기는 것이 아니라, onDelete() 에서도 특정 파라미터를 넘겨받고, removeRows 에서도 같은 타입의 파라미터를 받기 때문에 이를 따로 표시를 하지 않는 것임
  • List 에서 아이템이 삭제될 때마다 아래의 함수가 실행될 것이다.

ondelete

 

Edit 버튼 다는 방법

  • VStack 을 NavigationView 로 감싸고, VStack에 .toolbar { EditButton() } 만 달아주면 된다 .
NavigationView {
    VStack {
		// 
    }
    .toolbar {
        EditButton()
    }
}

 

 

 

Comments