Karzin Lab

[Swift5] 화면 전환하기

(storyboard와 show함수 사용)

Android에서 화면전환을 할때에는 Intent를 생성하여 startActivityForResult 함수를 사용하여 다른 액티비티로 전환을 했습니다. (Manifest도 적용을 해줘야 에러가 안난다는건 잊지말아야 하구요!)

하지만 iOS에서는 화면전환시 어떠한형식으로 전환을 하면 좋을까요?

사실 화면전환 방법은 다양한 방법이 있지만, 오늘은 storyboard에 id를 입력해주고, controller클래스에서 show 함수를 사용하여 화면을 전환하는 형식을 배워보도록 하겠습니다.

사실 storyboard의 경우 저는 Android의 xml에 대응한다고 생각을 하고 있습니다. (조금 다른면이 많이 있지만)

때문에 Android에서의 Intent 형식과 비슷한 형식을 취하는 방법을 알려드릴까 합니다.

요약해서 보기

프로젝트를 생성하시고,

Main.storyboard에서 기본생성된 ViewController에는 버튼을 생성하고(다음화면으로 이동할 이벤트 발생용),

이동할 ViewController를 추가로 생성합니다.

이동할 ViewController를 선택하시고 Identity의 Storyboard ID input 상자를 입력해줍니다.

입력된 Storyboard Id를 잘 기억하고 계시고,

초기 생성된 ViewController의 class로 이동합니다.

class에서 Button의 멤버생성 및 action이벤트를 생성합니다.

생성된 action이벤트에 아래와 같은 코드를 생성합니다.

//생성된 Main.storyboard와 연동작업 (변수에 담는 작업)
let myStoryBoard : UIStoryboard = UIStoryboard(name: "Main", bundle: nil)
//aController에 이동할 storyBoard의 ID를 지정합니다. (다음화면의 ID)
let aController = myStoryBoard.instantiateViewController(widthIdentifier: "여기에 기억하고 계신 StoryBoard ID를 입력")
//show함수에 생성한 aController 변수를 매개변수로 넘겨줌으로써 클릭이벤트가 발생하면 이동할 storyBaord ID와 매칭되어 화면이 전환됩니다.
self.show(aController, sender: self)

따라해보기

0. 프로젝트를 생성하시고,

1. Main.storyboard로 이동하여 기본 생성된 ViewController와 별개로 두개의 ViewController를 생성하겠습니다.

  -> 기호에 따라 저처럼 NavigationController를 붙이셔도 됩니다!

2. View를 이동하기 위한 이벤트를 걸어줄 Button을 생성합니다.

 2.1. Button에 Title을 지정하는 방법입니다.

 - 생성된 버튼 클릭

 - 우측 상단의 Show the Attributes inspector 아이콘을 선택합니다. (선택되어있는지 확인)

 - 하단의 Title input 상자에 버튼에 보여질 Title을 입력하시면 됩니다.

3. 알아보기 쉽게 생성된 Controller에 각각 Label을 추가합니다.

4. A를 입력한 Controller를 선택하시고,

    우측 상단의 Show the Identity Inspector 아이콘을 클릭하신 후,

    Storyboard ID input 상자를 입력해줍니다. (입력한 Storyboard ID는 잘 기억해둡니다.)

5. B를 입력한 Controller도 4번과 동일하게 만들어줍니다.

   단, Storyboard ID는 고유해야하므로 B는 BController등의 형식으로 입력해줍니다.

 -> 여기까지 Storyboard ID를 지정해 줌으로써 Android에서 xml의 android:id="@+id/~~~"와 동일한 작업을 했다고 생각하시면 되겠습니다.

6. 기본 생성되었던 View에 연결된 ViewController class를 storyboard와 함께 보이게 합니다.

   - 함께 보이는 방법은 우측 상단의 Add Editor on Right 버튼을 찾아 클릭하신 후, 하나는 class를 선택하시고, 하나는 storyboard를 선택하시면 됩니다.

7. 버튼을 우클릭한 상태로 클래스로 드래그하여 변수로 연결시켜줍니다.

8. 7번처럼 동일한 방식으로 Action(onClick) 이벤트 함수도 생성시켜줍니다.

9. 아래와 같이 myStoryBoard 변수의 추가와, onClick 이벤트 내 코드를 추가합니다.

10. 실행을 해보시면 A와 B button을 누름에 따라 다른 화면(A, B)이 나옴을 확인할 수 있습니다.

완성된 코드

class ViewController: UIViewController {


    @IBOutlet weak var btn_a: UIButton!
    @IBOutlet weak var btn_b: UIButton!
    
    //추가
    let myStoryBoard : UIStoryboard = UIStoryboard(name: "Main", bundle: nil)
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
    }
    
    
    @IBAction func onClick_a(_ sender: Any) {
        //추가
        let aController = myStoryBoard.instantiateViewController(withIdentifier: "AController")
        
        self.show(aController, sender: self)
    }
    
    @IBAction func onClick_b(_ sender: Any) {
        //추가
        let bController = myStoryBoard.instantiateViewController(withIdentifier: "BController")
        
        self.show(bController, sender: self)
    }
    
}

금방 정리할 줄 알았더니 시간이 좀 걸려버렸네요.ㅠㅠㅠ

테스트 장비 : 맥미니(2020)

버전정보 (v1.0)

 - v1.0 2020.07.02 배포

* 저작권에 위반될 수 있는 컨텐츠(이미지, 동영상 등)나 게시글은 삭제되거나 수정될 수 있습니다.

* 문제의 여지가 될 수 있는 컨텐츠의 경우 댓글 달아 주시면 빠른 시일 내에 조치하도록 하겠습니다.

* Karzin은 항상 공부중입니다. 설명이 틀리거나 잘못된 부분이 있다면 의견내주시는대로 수정하도록 하겠습니다.

Karzin

abbeea@naver.com

[독서계획] 2020년 7월 독서계획 0 + 2권

이번 7월에는 0+2권입니다!

뭐지? 싶으실텐데요;;

본래 제가 책을 읽을때에는 어지간하면 전공책은 안읽기로 했었는데..

회사 프로젝트라던가, 개인적인 공부때문에 전공책을 2권이나 구입하게 되었습니다. ㅜ.ㅜ

모두 아시겠지만, 전공책이 저렴한 가격도 아니다보니..

(2권 사는데 벌써 5만원이 훌쩍 넘.. 이 금액이면 소설이라던가의 책이 5권... )

0 + 1. 스위프트 프로그래밍 (Swift5)

 - 선택 이유 : 공부 + 프로젝트 스킬 업

0 + 1. 나의 첫 머신러닝/딥러닝 (파이썬)

 - 선택 이유 : 공부 + 읽어보고 싶어서

간만에 프로그래밍 책 사니까 두근대긴하네요 ㅋㅋ

저는 보통 프로그래밍 언어 하나 배울때 책한권사서 너덜해질때까지 읽고 따라하는 타입이라..

다음달에는 좀 제대로된 독서계획을 세울 수 있었으면 좋겠네요 ㅠㅠ