MVVM-1:一般性讨论

哦,我的……我们今天所拥有的……另一个关于MVVM的博客。 有什么新鲜事,否则它会讲同样无聊的事情。

是的,那么一件事是,我们的旅程将是漫长而冒险的,并且会围绕MVVM公园进行详细的游览。 我们不仅会学习基础知识,甚至还会尝试使用复杂UI的实时应用程序场景。 让我们继续进行MVVM冒险.. !!!! 听起来有点有趣;)。 是不是

MVVM或模型—视图— ViewModel是一种设计模式,旨在模块化您的代码并将其构建在测试驱动开发环境中。 当苹果公司的传统MVC设计模式使我们的控制器笨重且单元测试痛苦时,诸如MVVM,VIPER,MVP等不同的设计模式便应运而生。 MVVM非常方便,因为它在所有组件之间提供了松散耦合的机制,将您的视图,业务和数据逻辑隔离开来。 有很多教程和博客对此进行了解释,但是在这里,我们将遵循MVVM的基本规则,并学习如何尊重它们并编写漂亮的代码。

我们将分两部分讨论MVVM:

第-1部分讨论了有关MVVM和小型演示代码的大量讨论。

第2部分 将通过一个复杂的UI示例来处理MVVM中一些常见的漏洞,以及解决这些漏洞的方法。

你会学到什么?

我们将在示例的第-1部分中学习以下内容

  1. 什么是MVVM?
  2. 为什么选择MVVM?
  3. 我们将构建一个示例示例。
  4. MVVM的一些缺点

什么是MVVM?

模型:

模型基本上是应用程序具有的数据模型或实体。 它们只是具有简单关联属性的结构或类。 通常,它们只是保存从原始数据结构映射的数据,这些数据可能来自您的API或其他来源(例如SQLite文件等)。

查看或查看控制器:

视图是显示的视觉元素。 应用程序屏幕上的所有UI组件都是视图。 该视图仅包含UI逻辑,例如数据渲染,导航等。 该视图拥有视图模型。

查看模型:

视图模型接收UI事件并执行业务逻辑,并提供要在UI上显示的输出。 这是负责处理驱动视图的业务逻辑的组件。 但是它在内部不会修改UI,也没有对视图的引用。 它拥有数据模型。

为什么选择MVVM?

好的,我们当中有些人可能会问,当苹果公司提供了美观且更简单的MVC时,为什么还要使用MVVM。 我们可以集成一些不同的设计架构,例如Facade,Coordinator,Singleton等,以构建模块化代码。 好的,现在有以下三个原因使MVVM脱颖而出:

  1. 隔离代码:隔离代码 。 基于MVVM组件将特定的视图处理划分为跨视图,模型和视图模型的部分,从而为我们提供了模块化的代码结构。
  2. 避免使用笨拙的控制器:使用MVC的开发人员知道,当我们的应用程序可扩展且需求不断与我们现有的逻辑混乱时,我们的控制器将继续扩展,直到并且除非将控制器代码路由到单独的文件中。 通过MVVM,我们在视图模型中写下了业务逻辑,仅将输出传递给视图或控制器。
  3. 测试驱动开发 最重要的是,MVVM确实提供了执行TDD的良好平台。 我们可以写下用于视图模型的单元测试用例,并测试驱动UI的业务逻辑。 单元测试用例在开发时确实非常重要,因为它们在很大程度上减少了我们的破码机会。 请点击以下链接在iOS中探索有关TDD的更多信息

iOS中的测试驱动开发,SWIFT 4-第1部分
测试驱动开发(TDD),一种敏捷的软件开发方法,可以使开发过程更加无错误且无代码。

样例代码

好了,此演示通过将简单的View放入图片中,提供了MVVM的基本示例。 我们将仅显示一些电影细节,并尝试了解基本的MVVM流程。

代码流:

您可以下载示例代码并打开“ Simple MVVM”项目。 该代码仅包含一个模块。

哦! 是的! …..它将很快结束…..😉

首先让我们看一下用于示例的所有类。

MovieDetailController 它表示我们的电影详细信息页面。 它包含在视图上呈现的所有UI组件。

MovieDetailVM 电影细节视图的视图模型。 它包含业务逻辑,例如数据获取和处理以进行显示。

Movie 这是表示电影模型的简单结构。

DataGenerator 此类为电影详细信息页面生成数据。 您可以与提供数据的Web服务请求类进行比较。

运行应用程序时,在调试器中,您将看到类似以下的日志:

发生什么了 ??

流程-1:加载视图时

  • 当加载MovieDetailViewController的视图时,我们通过调用ViewModel的viewDidLoad()通知ViewModel该视图已加载。

在这里,UI事件的通信是通过闭包完成的,以便您了解我们如何使用组件之间的不同通信方式。

  • 当用户点击MarkFavourite按钮时,视图通过调用闭包viewModel.markFavoriteButtonPressed()通知ViewModel事件
  • 然后,ViewModel重置isFavourite布尔变量。

然后,控制器重置按钮的图像。

太好了! 您已经完成了第一个MVVM简单演示。

MVVM的缺点:

  • 各种MVVM组件和数据绑定之间的通信可能很痛苦
  • 视图和视图模型的代码可重用性很困难。
  • 难以在嵌套视图和复杂UI中管理视图模型及其状态
  • 初学者的MVVM很难使用。

我们学到了什么?

  1. 什么是MVVM,它如何帮助我们轻松生活?
  2. 您建立了一个简单的MVVM示例。
  3. MVVM的缺点。

下一步是什么?

这是您第一次访问MVVM Jurassic Park。 您刚刚探讨了什么是MVVM,以及我们如何使用它来提高代码质量。 下一部分即MVVM-2处理MVVM的问题,以及如何优雅地处理它们。

示例代码: GitHub链接

我很想听到你的消息

您可以通过以下渠道与我联系,以获取任何查询,反馈或只是想进行讨论:

Twitter — @G_ABHISEK

领英

堆栈溢出

邮件

abhisekbunty94@gmail.com

为了立即连接

SkypeId — gabhisekbunty

请随时与您的其他开发人员分享。