[ IOS, Swift ] ScreenTransition : 화면 전환 방식을 적용한 기초 프로젝트 2

 

https://jinudmjournal.tistory.com/101

 

[ IOS, Swift ] ScreenTransition : 화면 전환 방식을 적용한 기초 프로젝트 1

LED 전광판 앱 제작 : 기초 프로젝트 - ScreenTransition 앱은 텍스트와 배경 색상을 설정하고, 전광판에 표시할 글자를 표시하는 기능을 한다. - UINavigation Controller 를 통해서 화면을 전환하고, 원하는

jinudmjournal.tistory.com

 

ScreenTransition 의 두번째 포스팅이다.

이전에  Sugue : Push, Present 를 사용한 화면전환 방식을 배웠으므로,

이번에는 Code 를 통한 Push, Present 화면 전환 방식을 배운다.

 

 

3. Code 를 통한 Push 적용하기

 

기존의 Sugue의 방식처럼 Controller를 만들고, Label과 Button을 추가, 클래스를 등록한다.

 

class CodePushViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
    
    }
}

 

Code Push View Controller

이 후에 Code 로 Push 버튼을 클릭 후 Assistant 를 통해서 Code 작성을 진행한다.

    @IBAction func tabCodePushButton(_ sender: UIButton) {
        // 스토리 보드에 있는 뷰 컨트롤러를 인스턴스화 해주어야 함
        // 옵셔널로 반환하기 때문에 Guard 문으로 처리
        guard let viewController = self.storyboard?
            .instantiateViewController(withIdentifier: "CodePushViewController")
        else {
            return
        }
        
        // navigationController 의 push View Controller를 호출해서 뷰를 연결
        self.navigationController?.pushViewController(viewController, animated: true)
    }

 

뷰 컨트롤러에 Code 로 Push 버튼을 연결한다.

스토리보드에 만든 Code PUsh View Controller를 상단 View Controller로 연결하기 위해서

해당 뷰 컨트롤러를 인스턴트화 해주어야 한다.

 

storyboard의 instantiateViewController를 통해서 뷰 컨트롤러 인스턴스를 생성한다.

이 때 withIdentifier 변수가 필요한데, 어떤 VIew Controller에 연결 할지 지정해주어야 한다.

 

아래 그림과 같이 스토리보드의 Identity 탭에서 StoryBoard ID를 지정할 수 있다.

 

지정한 아이디로 인스턴스를 생성했다면, navigationController의 push를 통해서 버튼 클릭에 대한 이벤트를 설정한다.

마지막으로 Back Button에 대한 클릭 이벤트로 설정해준다.

 

3. Code 를 통한 Present 적용하기

 

마지막으로 코드를 통한 Present를 적용한다.

참고로 Present를 통한 화면 전환은 Left 슬라이드로 이전 화면으로 돌아가는 동작이 불가능하다.

대신 풀 스크린이 아닐 경우 하단 슬라이드를 통해서 이전 화면으로 전환이 가능하다.

 

Code 로 Present 화면을 나타낼 View Controller 를 생성한다.

Cocoa Touch Class를 선언하고 클래스 명을 등록해준다. 

이 후에 StoryBoard ID 값을 미리 지정한다. (CodePresentViewController)

 

이제 Code 로 Present 버튼에 클릭 이벤트를 적용해야 하므로 드래그해서 Assistant 에서 인스턴스를 생성한다.

guard 문으로 처리하며, instantiateViewController를 통해서 View Controller와 연결한다.

 

    @IBAction func tabCodePresentButton(_ sender: UIButton) {
        // 마찬가지로 스토리 보드에 있는 뷰 컨트롤러를 인스턴스화
        guard let viewController  = self.storyboard?
            .instantiateViewController(withIdentifier: "CodePresentViewController")
        else{
            return
        }
        
        // 풀 스크린으로 변환 -> present 이전에 실행해야 함
        viewController.modalPresentationStyle = .fullScreen
        
        // present 메서드에 인스턴스한 Controller를 전달
        self.present(viewController, animated: true, completion: nil)
        
    }

present로 Controller를 전달하기 이전에 viewController를 fullScreen으로 설정했다.

주의할 점은 present 이전에 작성해야 적용이 된다.

 

이제 CodePresentViewController에서 BackButton에 대한 동작만 처리하면 된다.

마찬가지로 Assistant를 통해서 Back Button에 대한 동작을 제어한다.

 

    @IBAction func tabBackButton(_ sender: UIButton) {
        self.presentingViewController?
            .dismiss(animated: true, completion: nil)
    }

 

 

기기로 테스트하면 4가지 화면전환 방식이 정상적으로 동작하는 것을 알 수 있다.