Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
Tags
- tableView
- collectionview
- 리펙터링
- Refactoring
- Clean Code
- Protocol
- Human interface guide
- UICollectionView
- RxCocoa
- swiftUI
- Xcode
- uitableview
- SWIFT
- Observable
- swift documentation
- uiscrollview
- clean architecture
- UITextView
- ribs
- map
- 스위프트
- 리팩토링
- 클린 코드
- MVVM
- combine
- 리펙토링
- rxswift
- HIG
- ios
- 애니메이션
Archives
- Today
- Total
김종권의 iOS 앱 개발 알아가기
[iOS - swift] ToggleButton 만드는 방법 (#UIKit, #CheckBox) 본문
토글 버튼 만드는 아이디어
- 토글 버튼을 만드는 방법은 여러가지가 있지만, "토글에 관한 기능"을 생각해보면 여러곳에서 사용될 수 있는 여지가 있으므로 공통화가 필요
- UIButton에는 selected 상태가 있는데 이 상태는 직접 특정 타이밍에 isSelected 값을 변경해주어서 사용이 가능
- touchUpInside 시점에 selected 값을 변경해주어서 구현
토글 버튼 만들기
- UIButton을 상속하여 ToggleButton 추가
class ToggleButton: UIButton {
}
- touchUpInside 시점에 isSelected 상태를 변경해주는게 필요하므로 addTarget(_:action:for:)를 사용하여 touchUpInside이벤트 처리
class ToggleButton: UIButton {
override init(frame: CGRect) {
super.init(frame: frame)
bind()
}
required init?(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)
bind()
}
private func bind() {
addTarget(self, action: #selector(changeSelectedState), for: .touchUpInside)
}
@objc private func changeSelectedState() {
isSelected = !isSelected
}
}
- isSelected가 변경될때마다 이것을 사용하는 쪽에 이벤트를 주기 위해 closure 추가하면 완료
class ToggleButton: UIButton {
var onToggle: ((Bool) -> Void)? // <-
override init(frame: CGRect) {
super.init(frame: frame)
bind()
}
required init?(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)
bind()
}
private func bind() {
addTarget(self, action: #selector(changeSelectedState), for: .touchUpInside)
}
@objc private func changeSelectedState() {
isSelected = !isSelected
onToggle?(isSelected) // <-
}
}
ex) ViewController에서 위 버튼 사용
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let toggleButton = ToggleButton(frame: CGRect(x: 100, y: 100, width: 100, height: 50))
toggleButton.setTitle("OFF", for: .normal)
toggleButton.setTitle("ON", for: .selected)
toggleButton.backgroundColor = .systemBlue
toggleButton.onToggle = { isSelected in
print("ToggleButton 상태: \(isSelected ? "ON" : "OFF")")
}
view.addSubview(toggleButton)
}
}
완성)
'iOS 응용 (SwiftUI)' 카테고리의 다른 글
[iOS - SwiftUI] LayoutPriority 개념 (뷰 우선순위) (0) | 2024.12.17 |
---|---|
[iOS - SwiftUI] 설계 관점에서 클로저를 이해하며 잘 사용하기 (클로저를 잘 사용하는 방법, 위임하기) (0) | 2024.11.28 |
[iOS - SwiftUI] 뷰를 주입 받는 형태의 커스텀 뷰 만드는 방법 (custom view에 View 주입하는 테크닉) (0) | 2024.11.26 |
[iOS - SwiftUI] Sticky Header 구현 방법 (Sticky 헤더) (0) | 2024.11.19 |
[iOS - SwiftUI] frame 사용 시 뷰 정렬 주의 사항, frame(alignemnt:) 코드 이해하기 (2) | 2024.11.14 |
Comments