iOS - 인터렉티브 씬

컨트롤

   컨트롤은 뷰의 자식 클래스
   뷰(UIView) : 컨텐츠 출력
   컨트롤(UIControl) : 사용자 입력에 반응(ex : (UIKIt 대표) 버튼, 세그먼티드 컨트롤, 텍스트 필드, 슬라이더, 스위치, 스테퍼)

 

   코드로 컨트롤 다루기

      컨트롤 상태 변경하는 방법

         var isEnabled : Bool
         var isSelected: Bool
         var isHighlighted: Bool

 

      이벤트 처리

         타겟(Target) - 액션(Action)

         타겟/액션/이벤트 등록

func addTarget(_ target: Any?, action: Selector, for controlEvents: UIControlEvents)
func removeTarget(_ target: Any?, action: Selector? for controlEvents: UIControlEvents)

         이벤트 상수 : UIControlEvents

            touchDown : 컨트롤에 터치가 닿는 이벤트
            touchDragExit : 터치가 컨트롤 밖으로 나가는 이벤트
            touchUpInside : 터치가 내부에 닿았다 떨어지는 이벤트
            valueChanged : 값이 변경되는 이벤트

 

버튼

   사용자의 간단한 행위(누르기)
   이미지와 글자 출력
   버튼의 상태 별 이미지와 글자

   버튼 상태(State)

      Default : 보통 상태로 사용 가능
      Highlight : 터치 중인 상태
      Focused : 포커스된 상태(포커스 기반 플랫폼)
      Selected : selected 상태
      Disabled : 사용자 터치 이벤트 동작 안함

 

코드로 버튼 다루기

      버튼 생성과 씬 배치

// 커스텀 버튼
let customButton = UIButton(frame: CGRect(x:50, y:50. width:100, height:50))
self.view.addSubview(customButton)

let infoButton = UIButton(type: .infoLight)

// 버틑의 크기는 미리 정해져 있다.
infoButton.center = CGPoint(x:50, y:150)
self.view.addSubview(infoButton)

      버튼 상태별 속성 설정

textButton = UIButton(frame: CGRectMake(50, 50, 100, 50))

textButton.setTitle("글자 버튼", for: UIControlState.normal)
textButton.setTitleColor(UIColor.black, for: .normal)

textButton.setTitle("터치중", for: .highlighted)
textButton.setTitleColor(UIColor.red, for: highlighted)

self.view.addSubview(textButton)

 

 

버튼 이벤트 다루기

 

   버튼 클릭 이벤트 : touch up inside

 

   액션 메소드 생성 : @IBAction

      파라미터 사용

// 파라미터 사용 안하기
@IBAction func handleClick() {}

// 파라미터 1개 사용, 파라미터는 sender - 이벤트 메소드 호출(버튼 객체)
@IBAction func handleClick(_ sender: Any) {}

// 파라미터 2개 사용, 두 번째 파라미터 이벤트 객체(UIEvent)
@IBAction func handleClick(_ sender: Any, forEvent event: UIEvent) {}

 

   액션 메소드 작성 후 버튼과 컨트롤 연결

 

   코드로 버튼 이벤트 다루기

override func viewDidLoad() {

   // 버튼 생성, 씬에 추가
   let button = UIButton(frame: CGRectMake(20, 200, 100, 50))
   self.view.addSubview(button)
   
   // 버튼의 Touch Up Inside 이벤트 처리
   button.addTarget(self, action: #selector(handleClickByCode(_:)),
             forControlEvents:.touchUpInside)
}

func handleClickByCode(_ sender: Any) {

   print("handleClickByCode")
   
}

 

   버튼 추가

라이브러리에서 버튼 추가 후 우클릭 연결 - Action 메서드 생성 (connection : Action, name : 지정, Type : Any, Touch Up Inside, 보내는 작업자 : Sender)

 

 

 

사용자 선택

 

   세그먼티드 컨트롤

      여러 항목 중 선택
      글자 기반, 이미지 기반
        

      세그먼티드 컨트롤의 이벤트

         인터페이스 빌더로 연결

            1 . 세그먼티드 컨트롤 생성
            2. 우클릭 연결
            3. Connection : Action
                Object : View Controller
                Name : 지정
                Type : Any ( 파라미터 ) 


          코드로 작성

control.addTarget(self
                , action: #selector(handleSegmentChange(_:))
                , forControlEvents: .valueChanged) 

            사용자의 선택 결과 얻기

func handleSegmentChange(_ sender: Any) {
   let control = sender as! UISegmentedControl
   switch control.selectedSegmentIndex {
      case 0:
         print("소나기")
      case 1:
         print("천둥, 번개")
      case 2:
         print("맑음")
      }
}

 

      슬라이더

          연속된 값 입력
          최소/최대값 설정 가능

          이벤트 연속 속성

            continuous Updates
                on : 값 변경 중에 이벤트 계속 발생
                off : 변경 완료됐을 때에만 이벤트 발생

         슬라이더 이벤트 다루기 예제

@IBAction func sliderChanged(_ sender: Any) {
   let slider = sender as! UISlider
   let v = slider.value
   label.text = "슬라이더의 값 \(v)"
}

        

      프로그레스 뷰

         사용자 입력 기능 없음
         이벤트 연결 불가
         최소/최대값 고정 : 0~1 사이

 

 

     스테퍼


         속성

            현재값
            최소/최대값
            증감 단위


         스테퍼의 행위

            누르고 있으면 증감 반복
            누르고 있으면 이벤트 계속 발생
            최소/최대 값 도달 시 순환
            이벤트 : valueChanged

         스테퍼 이벤트 다루기 예제

@IBAction func stepperChanged(_ sender: Any) {
   let slider = sender as! UIStepper
   let v = stepper.value
   label.text = "스테퍼의 값 \(v)"
}

 

      스위치

   
         속성

            꺼짐/켜짐
            틴트 색상
            on/off 이미지

 

씬의 메뉴

   툴바

      

액티비티 인디케이터

   동작 중임을 알리는 목적
   컨트롤이 아닌 뷰
   동작 완료 후 숨기기
   다른 뷰보다 위에 배치


   
   스위치와 액티비티 인디케이터 에제

@IBAction func switchChanged(_ sender: AnyObject) {
   let onOffSwitch = sender as! UISwitch
   if onOffSwitch.isOn {
      indicator.startAnimating()
   }
   else {
      indicator.stopAnimating()
   }
}