Architecture Pattern

Model View Presenter

We covered Model View View-Model, an alternative design pattern to MVC, in the last portion of this article. In this pattern, we develop a new component called View Model that handles data manipulation duties. There is a lack of distribution in MVC and certain MVVM, however we can have a better solution because the view controller still does a lot of tasks.

Additionally, because a controller and the view lifecycle are closely related, testing a view controller becomes a very difficult operation. This lesson segment will cover MVP (Model View Presenter), an additional alternative design pattern that incorporates the main component presenter into the overall layout.

What is the MVP?

A design pattern called Model View Presenter (MVP) divides items into three primary parts: Presenter, View, and Model. All of the application’s business logic is now included in the presenter, which is referred to as the View Controller.

View: The View is made up of the View Controller and the View. Only the view-related code is contained in it. It handles all aspect of UI setup and operation.
Presenter: The application’s whole business logic is contained in the presenter. Through the usage of delegate methods, it defines the user actions and modifies the UI accordingly. Since it is not UIKit reliant, testing it is simple.
Model: The application data is contained in the model. This is where the networking calls, parser, extensions, manager, and so on happen.

The MVP adheres to the passive view paradigm, which means that all actions are routed to the presenter, who uses delegates to update the UI elements. The view will hear the presenter updates and send along the actions. In accordance, the presenter also modifies the Model.

Example

We’ll create a straightforward login application using MVP architecture in this example. Here, we’ll build the UserModel, the View Controller, and the Presenter.

Interface Builder

We are going to overlay two views onto a view controller in this project’s storyboard. Two text fields for user input and a submit button will be added to the first view, while a success message will be shown on the second view. The second view will be visible after a successful login, although it will initially be concealed.

The storyboard’s interior perspective is displayed in the image above. We will now add a second view above the first and set the background color to black with a 60% opacity. It will resemble the picture below.

We will now discuss the project’s design pattern. In this case, the MVP will serve as the design pattern. In the project, we’ll set up the folder structure shown below.

The application’s whole business logic will be contained in the LoginPresenter. When the user clicks the submit button after providing their login and password, the submitButtonClicked method will be activated. After the confirmation, it does the validation and generates the model object. Additionally, it makes use of the View Controller’s delegate method to change the user interface.

LoginPresenter.swift

				
					import Foundation  
  
  
protocol PresenterView:class {  
    func updateLoginUI()  
}  
class LoginPresenter{  
    weak var presenterView:PresenterView?  
    var userName:String?  
    var password:String?  
      
    init(view:PresenterView){  
        self.presenterView = view  
    }  
      
    func submitButtonClicked(){  
        if(self.userName == "root" && self.password == "root"){  
            let userModel = UserModel(name:self.userName, password:password)  
            self.presenterView?.updateLoginUI()  
        }  
    }  
}

LoginViewController.swift

				
					import UIKit  
  
  
class LoginViewController: UIViewController {  
  
  
    @IBOutlet weak var sucessView: UIView!  
    @IBOutlet weak var userEmail: UITextField!  
    @IBOutlet weak var userPassword: UITextField!  
      
    lazy var presenter = LoginPresenter(view:self)  
      
    override func viewDidLoad() {  
        super.viewDidLoad()  
        // Do any additional setup after loading the view.  
        self.sucessView.isHidden = true  
    }  
      
    @IBAction func clickedSubmitBtn(_ sender: Any) {  
        presenter.userName = userEmail.text  
        presenter.password = userPassword.text  
        presenter.submitButtonClicked()  
    }  
}  
  
  
extension LoginViewController : PresenterView{  
    func updateLoginUI() {  
        self.sucessView.isHidden = false  
    }  
      
      
}

UserModel.swift

				
					import Foundation  
  
  
class UserModel{  
    public var userName:String?  
    public var password:String?  
      
    init(name:String?, password:String?) {  
        self.userName = name  
        self.password = password  
    }  
}

Model View Presenter