관리 메뉴

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

[iOS - swift] 1. UISegmentedControl - 기본 사용 방법 본문

iOS 응용 (swift)

[iOS - swift] 1. UISegmentedControl - 기본 사용 방법

jake-kim 2022. 5. 5. 22:45

1. UISegmentedControl - 기본 사용 방법

2. UISegmentedControl - 커스텀 방법, PageViewController와 사용 방법

UISegmenetedControl 사용 방법

  • Swift에는 Radio Button이 따로 없고 UISegmentedControl이 존재

  • ViewController 준비
import UIKit

class ViewController: UIViewController {

}
  • segmentedControl 한 개와 두 개의 뷰 준비
    • segmentedControl에 들어가는 label은 UISegmentedControl의 생성자 파라미터 item에서 주입
  let segmentedControl: UISegmentedControl = {
    let control = UISegmentedControl(items: ["firstView", "secondView"])
    control.translatesAutoresizingMaskIntoConstraints = false
    return control
  }()
  let firstView: UIView = {
    let view = UIView()
    view.backgroundColor = .green
    view.translatesAutoresizingMaskIntoConstraints = false
    return view
  }()
  let secondView: UIView = {
    let view = UIView()
    view.backgroundColor = .yellow
    view.translatesAutoresizingMaskIntoConstraints = false
    return view
  }()
  • segmentedControl의 초기화 인덱스 값과 값이 변경될때마다 view들의 visibility를 관리하는 코드 추가
    // in viewDidLoad()
    self.segmentedControl.addTarget(self, action: #selector(didChangeValue(segment:)), for: .valueChanged)
    
    self.segmentedControl.selectedSegmentIndex = 0
    self.didChangeValue(segment: self.segmentedControl)
  • didChanageValue 메소드와 관련 프로퍼티 정의
  var shouldHideFirstView: Bool? {
    didSet {
      guard let shouldHideFirstView = self.shouldHideFirstView else { return }
      self.firstView.isHidden = shouldHideFirstView
      self.secondView.isHidden = !self.firstView.isHidden
    }
  }
  
  @objc private func didChangeValue(segment: UISegmentedControl) {
    self.shouldHideFirstView = segment.selectedSegmentIndex != 0
  }

* 전체 코드: https://github.com/JK0369/ExSegmentedControl

 

Comments