iOS

[iOS] RIBs 튜토리얼1

Kim_Baechu 2022. 3. 11. 18:13

https://github.com/uber/RIBs/wiki/iOS-Tutorial-1

Create your first RIB

simple TicTacToe game using the RIBs architecture and associated tooling.

소스파일 → here. / 설치 및 오픈프로젝트 리드미 → README

Goal

RIB의 구성요소를 알고 어떻게 상호 작용하는지 알기

사용자의 이름을 받아서 콘솔에 출력하기

Project Structure

boilerplate code에 두개의 RIBs가 포함되어 있습니다.

앱이 실행되면AppDelegate 가 Root RIB을 빌드합니다.

Root RIB 은 RIBs 트리역할을 하고 필요한 경우 자식에게 컨트롤을 전달합니다.

Root RIB's code는 Xcode 템플릿으로 자동으로 생성됩니다.

두번째 Rib은 LoggedOut 입니다.

로그인 인터페이스를 포함하고 인증 관련 이벤트를 관리합니다.

Root RIB이  AppDelegate 로부터 컨트롤을 얻으면 즉시 LoggedOut RIB 으로 로그인 양식을 보여주기 위해 전환합니다.

빌드와 프레젠팅 관련 코드는 LoggedOut RIB 이 이미 가지고 있으며  RootRouter 에서 찾을 수 있습니다..

LoggedOut RIB이 없습니다. LoggedOut 그룹에  DELETE_ME.swift 가 있는데 이 튜토리얼에서 LoggedOut 을 구현할겁니다.

Create LoggedOut RIB

LoggedOut 그룹에 RIB파일을 만들고  DELETE_ME.swift 를 삭제합니다.

RIB은 view(controller)가 필수는 아닙니다.

하지만 우리는 뷰컨트롤러를 만들건데, 왜냐하면 RIB이 로그인 인터페이스(텍스트 필드, 로그인 버튼)를 구현해야하기 때문입니다.

“Owns corresponding view” 체크박스를 해서 뷰컨트롤러 클래스를 만드세요.

Understanding the generated code

LoggedOut RIB을 구성하는 모든 클래스를 생성했습니다.

  • LoggedOutBuilder 는 LoggedOutBuildable 을 준수하므로 RIBs가 빌더블 프로토콜을 준수하는 mock 인스턴스를 사용할 수 있습니다.
  • LoggedOutInteractor 는 LoggedOutRouting 프로토콜을 사용하여 라우터와 통신합니다. 이것은 인터렉터가 필요한 것을 선언하고, 이 경우 LoggedOutRouter 가 구현을 제공하여 의존성 반전(dependency inversion)원리를 따릅니다. 빌더블 프로토콜처럼, 인터렉터가 유닛테스트되도록 지원합니다. LoggedOutPresentable 는 비슷한 컨셉으로 인터렉터와 뷰컨트롤러가 통신하도록합니다.
  • LoggedOutRouter 는 LoggedOutInteractable 가 인터렉터와 통신하기 위한 사항을 선언합니다. LoggedOutViewControllable 을 이용해서 뷰컨트롤러와 통신합니다.
  • LoggedOutViewController 는 LoggedOutPresentableListener 를 동일한 dependency inversion principle를 따르는 인터렉터와 통신합니다.

LoggedOut UI

use our code

Login logic

유저가 "Login" 버튼을 탭한 후, LoggedOutViewController 유저가 로그인하기 원하는것을 알리기 위해 리스너를 호출해야합니다.(LoggedOutPresentableListener)

리스너는 플레이어 이름을 받아야합니다.

이 로직을 구현하기 위해 리스너가 뷰컨트롤러에게 로그인 리퀘스트를 받도록 업데이트해야합니다.

LoggedOutViewController.swift 에 있는LoggedOutPresentableListener 프로토콜를 다음과 같이 수정합니다.

protocol LoggedOutPresentableListener: class {
    func login(withPlayer1Name player1Name: String?, player2Name: String?)
}

플레이어 이름이 옵셔널인데, 이름이 둘다 입력 될때까지 버튼을 비활성화해야합니다.

LoggedOutInteractor 가 비어진 이름을 다루도록 할 겁니다.

이름이 비어져있으면 디폴트 값으로 "Player 1", "Player 2" 라 합니다.

LoggedOutInteractor가 수정된  LoggedOutPresentableListener 프로토콜을 따르도록 수정합니다.

// MARK: - LoggedOutPresentableListener

func login(withPlayer1Name player1Name: String?, player2Name: String?) {
    let player1NameWithDefault = playerName(player1Name, withDefaultName: "Player 1")
    let player2NameWithDefault = playerName(player2Name, withDefaultName: "Player 2")

    print("\\(player1NameWithDefault) vs \\(player2NameWithDefault)")
}

private func playerName(_ name: String?, withDefaultName defaultName: String) -> String {
    if let name = name {
        return name.isEmpty ? defaultName : name
    } else {
        return defaultName
    }
}

이제 유저가 로그인하면 유저 이름을 프린트합니다.

마지막으로 로그인 버튼을 누르면 리스너의 메서드를 호출하도록 연결합니다.

LoggedOutViewController.swift에 didTapLoginButton를 수정합니다.

@objc private func didTapLoginButton() {
    listener?.login(withPlayer1Name: player1Field?.text, player2Name: player2Field?.text)
}

 

튜토리얼2 보러가기

 

[iOS] RIBs 튜토리얼2

https://github.com/uber/RIBs/wiki/iOS-Tutorial-2 Composing RIBs Goals 로그인 이후 게임 필드 표시 자식 RIB가 부모 RIB과 통신하기 부모 인터렉터가 결정하면 RIB을 붙이거나 분리하기 뷰 없는 RIB 뷰 없는 R..

baechukim.tistory.com