Skip to content

iOS Tutorial 1

Tuomas Artman edited this page Oct 27, 2017 · 22 revisions

Create your first RIB

The goal of this exercise is to understand the various pieces of a RIB, and more importantly, how they interact and communicate with each other. At the end of this exercise, we should have an app that launches into a screen where the user can type in player names and tap on a login button. Tapping the button should then print player names to the Xcode console.
image1

Create LoggedOut RIB

  1. Select New File menu item on the LoggedOut group.
    image2
  2. Select the Xcode RIB templates.
    image3
  3. Name the new RIB "LoggedOut" and check the "Owns corresponding view" checkbox.
    image4
    1. LoggedOut RIB has its own view to display a "Sign Up" button and player name text fields.
  4. Create the files and make sure it’s in the "TicTacToe" target and in the "LoggedOut" folder.
    image5
  5. Now we can delete the DELETE_ME.swift file. It was only temporarily needed so the project can compile without the LoggedOut RIB we just created.
    image6

Understanding generated code

image7

  • LoggedOutBuilder conforms to LoggedOutBuildable so other RIBs that uses the builder can use a mocked instance that conforms to the buildable protocol.
  • LoggedOutInteractor uses the protocol LoggedOutRouting to communicate with its router. This is based on the dependency inversion principle where the interactor declares what it needs, and some other unit, in this case the LoggedOutRouter, provides the implementation. Similar to the buildable protocol, this allows the interactor to be unit tested. LoggedOutPresentable is the same concept that allows the interactor to communicate with the view controller.
  • LoggedOutRouter declares what it needs in LoggedOutInteractable to communicate with its interactor. It uses the LoggedOutViewControllable to communicate with the view controller.
  • LoggedOutViewController uses LoggedOutPresentableListener to communicate with its interactor following the same dependency inversion principle.

LoggedOut UI

Below is the UI we want to build. To save time, you can also use the provided UI code here.

image1

Login Logic

LoggedOutViewController calls to its listener, LoggedOutPresentableListener, to perform the business logic of login, by passing in the player 1 and 2 names.

protocol LoggedOutPresentableListener: class {
    func login(withPlayer1Name player1Name: String?, player2Name: String?)
}
  • Notice that both player names are optional, since the user may not have entered anything. We could disable the Login button until both names are entered, but for this exercise, we’ll let the LoggedOutInteractor deal with the business logic of handling nil names.
  • If player names are empty, we default to "Player 1" and "Player 2".

Once you've read through the documentation, learn the core concepts of RIBs by running through the tutorials and use RIBs more efficiently with the platform-specific tooling we've built.

Tutorial 1

iOS, Android

Tutorial 2

iOS, Android

Tutorial 3

iOS, Android

Tutorial 4

iOS, Android

Tooling

iOS, Android

Clone this wiki locally