iOS - Switch 사용법

안녕하세요:)

 

오늘은 Switch를 활용해서 on/off 상태를 구현하는 방법에 대해서 알아보도록 하겠습니다.

 

 

1. 프로젝트 생성하기

우선 프로젝트를 하나 만들겠습니다.

프로젝트 생성

프로젝트 생성

2. 이미지 추가

 

Assets.xcassets를 선택한 후 이미지를 추가하겠습니다.

전구 off.png

0.08MB

전구 on.png

0.13MB

 

3. View 추가

Shift + Command + L !

Label, Image View, Switch, Button을 추가해 줍니다.

그다음 Attributes inspector에서 설정을 해주겠습니다.

Label을 선택한 후 Attributes inspector에서 Font 크기를 50, Bold Style로 변경, Alignment에서 center!

 

Image View를 선택한 후 image, highlighted에서 이미지를 전구 off, 전구 on으로 변경합니다.

 

원하시는 제약을 추가하세요

 

4. 코드 작성

Main.storyboard에서 option 키를 누른 상태로 ViewController.swift 클릭!

Label은 변경하지 않을 거기 때문에 코드로 옮기지 않겠습니다.

Image view를 선택한 후 control 버튼을 누른 상태로 코드로 옮겨 줍니다.

Image View는 Outlet으로 연결해 줍니다. 이름은 편하신 대로 작성하시면 됩니다.

그다음 Switch를 Outlet과 Action으로 연결해 줍니다.

Button도 Action으로 연결해 줍니다.

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var bulimageView: UIImageView!
    
    @IBOutlet weak var testSwitch: UISwitch!
    
    @IBAction func stateChanged(_ sender: UISwitch) {
        bulimageView.isHighlighted = sender.isOn
        
    }
    
    
    @IBAction func toggle(_ sender: Any) {
        testSwitch.setOn(!testSwitch.isOn, animated: true)
        stateChanged(testSwitch)
    }
    
    override func viewDidLoad() {
        super.viewDidLoad()
        testSwitch.isOn = bulimageView.isHighlighted
    }
}

5. 실행

Command + R !