관리 메뉴

김종권의 iOS 앱 개발 알아가기

[iOS - SwiftUI] Slider 사용 방법 본문

iOS 기본 (SwiftUI)

[iOS - SwiftUI] Slider 사용 방법

jake-kim 2022. 8. 21. 19:10

목차) SwiftUI의 기본 - 목차 링크

Slider

struct Slider<Label, ValueLabel> where Label : View, ValueLabel : View

  • Slide(value:in:onEditingChanged:)를 사용하여 구현
    • value - 초기값
    • in - 범위
    • onEditingChanged - 변경되었을때 호출되는 클로저
struct ContentView: View {
  @State private var value = 30.0
  @State private var isEditing = false
  
  var body: some View {
    VStack {
      Slider(
        value: $value,
        in: 0...100
      ) { editing in
          isEditing = editing
        }
      Text("\(value)")
        .foregroundColor(isEditing ? .red : .blue)
    }
  }
}

  • 증분 단위 설정
    • 생성자에 step 파라미터를 추가하여 적용
Slider(
  value: $value,
  in: 0...100,
  step: 5 // <-
) { editing in
    isEditing = editing
  }
Text("\(value)")
  .foregroundColor(isEditing ? .red : .blue)

  • 범위에 label 붙이기

Slider(
  value: $value,
  in: 0...100,
  step: 5
) {
  Text("Title")
} minimumValueLabel: {
  Text("0")
} maximumValueLabel: {
  Text("100")
} onEditingChanged: { editing in
  isEditing = editing
}

 

* 전체 코드: https://github.com/JK0369/ExSlider-SwiftUI

* 참고

https://developer.apple.com/documentation/swiftui/slider

Comments