1.MVVM是什么?
M:模型
V:视图
VM:视图模型
简单理解:mvc是一个cell面向一个model开发
mvvm是一个cell面向一个viewModel开发, viewModel里面又包含model
mvvm优点:抽取方法更加的详细,业务逻辑划分更加明确,让控制器更加轻量级
缺点:不利于维护,可读性不太好
2.MVVM框架的使用(以计算不等高cell为例)
上面的分析指导,计算cell高度要在网络请求里面记性
2.1自定义一个topView模型
定义成员属性接收服务器返回(要展示到view上)的数据
2.2自定义一个viewModel模型
先定义一个topView的模型属性,来保存模型数据
在定义一些属性,来保存计算出来的数据(比如:cell的高度和frame)
2.3数据请求成功,先把我们需要的字典数组转成模型数组
2.4再把模型数组转换成 视图模型 数组,并保存起来(定义一个数组成员变量)
// 模型转视图模型
for (XMGThemeItem *item in themes) {
XMGThemeViewModel *vm = [[XMGThemeViewModel alloc] init];
// 计算cell子控件frame和cellH
vm.item = item;
[self.themeViewModels addObject:vm];
注意:给视图模型赋值的时候(vm.item = item;),会触发视图模型成员属性item的set方法
我们就是在item的set方法里面计算cell的frame和高度的,
也就是说,模型全部转为视图模型之后,cell的frame和高度已经全部确定了
只需要在视图模型定义成员属性保存frame和高度,用的这时候直接取就可以了
3.怎么展示数据?
3.1在自定义cell里面定义 一个视图模型来接收数据
3.2在cellForRow方法里面给cell的视图模型赋值(通过从数组中取出对应的视图模型)
cell.vm = _themeViewModels[indexPath.row];
3.3在给cell的视图模型赋值的时候,会触发vm的set方法,会调用vm的set方法
在set方法里面给topView的模型赋值,并取出cell的frame和高度
- (void)setVm:(XMGThemeViewModel *)vm
{
_vm = vm;
// topView:传递模型
_topView.item = vm.item;
// 设置topViewFrame
_topView.frame = vm.topViewFrame;
}
3.4怎么给模型赋值(也就是展示数据)
在setVm方法里面会触发模型的set方法_topView.item = vm.item;
也就是说,这句代码,就把视图模型保存的服务器数据,传递给topView中定义的模型属性
3.5在topView的item的set方法里面,我们完成给cell的子控件赋值的过程
- (void)setItem:(XMGThemeItem *)item
{
_item = item; [_iconView sd_setImageWithURL:[NSURL URLWithString:item.profile_image]];
_nameView.text = item.name;
_timeView.text = item.create_time;
_textView.text = item.text;
}
topView的这些子控件通过从xib连线获得
3.6在哪里给cell的高度赋值?
在heightForRow方法里面
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath;0
1 - (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
XTThemeViewModel *vm = _themeViewModels[indexPath.row];
return vm.cellH;
}
MVVM框架思想的更多相关文章
-
MVVM框架理解
MVC框架 将整个前端页面分成View,Controller,Modal,视图上发生变化,通过Controller(控件)将响应传入到Model(数据源),由数据源改变View上面的数据. 整个过程看 ...
-
vue.js学习笔记(一):什么是mvvm框架,vue.js的核心思想
一:MVVM框架 MVVM框架的应用场景: 1.针对具有复杂交互逻辑的前端应用 2.提供基础的架构抽象 3.提供ajax数据持久化,保证前端用户体验 二:vue.js的核心思想 (一):数据驱动 ( ...
-
“老坛泡新菜”:SOD MVVM框架,让WinForms焕发新春
火热的MVVM框架 最近几年最热门的技术之一就是前端技术了,各种前端框架,前端标准和前端设计风格层出不穷,而在众多前端框架中具有MVC,MVVM功能的框架成为耀眼新星,比如GitHub关注度很高的Vu ...
-
不要听吹牛逼什么前端MVVM框架就是好,其实都是一帮没学好分层设计的搞出来的,让你彻底看清前端MVVM的本质
最近前端圈子里面,发现大家都在热炒概念,什么knockout,angularJs,都被捧成神了,鄙人不才,最近心情也不好,特地写这篇文章来找骂 写代码的码农都知道,Java社区虽然不是一个提出分层思想 ...
-
我所知道的MVVM框架(转 司徒大大 )
RubyLouvre commented on 6 Sep 2014 avalon http://avalonjs.github.io/ (使用Object.defineProperties. V ...
-
Vue.js-----轻量高效的MVVM框架(一、初识Vue.js)
1.什么是Vue.js? 众所周知,最近几年前端发展非常的迅猛,除各种框架如:backbone.angular.reactjs外,还有模块化开发思想的实现库:sea.js .require.js .w ...
-
SPA和MVVM设计思想
Vue基础篇设计模式SPAMVVMVue简介Vue的页面基本使用Vue的全局环境配置基本交互 插值表达式基础指令 v-text v-html v-pre v-once v-cloak v-on MVV ...
-
Vue中的MVVM框架
ViewModel:数据双向绑定 场景: 针对具有复杂交互逻辑的前段应用 提供基础的架构抽象 通过Ajax数据持久化,保证前端用户体验 什么是vue.js? 是一个轻量级的mvvm框架 数据驱动+组 ...
-
iOS应用千万级架构:MVVM框架
业务模块内的MVC和MVVM架构 目前,唯品会中MVC和MVVM架构并存,后期会偏重于MVVM架构的使用. MVC架构 Model:程序中要操纵的实际对象的抽象,为Controller提供经过抽象的业 ...
随机推荐
-
树莓派实现远程开机局域网电脑(WOL协议+etherwake+华硕主板Z97)秒变花生壳开机棒
一.花生壳映射树莓派 参考: http://www.cnblogs.com/EasonJim/p/6100181.html http://www.cnblogs.com/EasonJim/p/6100 ...
-
我的手机华为荣耀7,运行android程序不输出Log
解决方法:1 进入手机拨号界面2 输入*#*#2846579#*#*3 输入完毕后自动跳转到<工程菜单>界面4 依次选择后台设置-->LOG设置-->在此可以看见一些列关于LO ...
-
java中集合类HashSet、ArrayList、LinkedList总结
[HashSet] 1. HashSet存储不能够存储相同的元素,元素是否相同的判断:重写元素的equals方法.equals方法和hashCode方法必须兼容,如:equals方法判断的是用户的名字 ...
-
BZOJ4970 IOI2004 empodia障碍段
4970: [ioi2004]empodia 障碍段 Time Limit: 10 Sec Memory Limit: 128 MB Description 古数学及哲学家毕氏相信自然之本质为数学. ...
-
Android USB Headset: Device Specification
For USB headsets to work seamlessly across the Android ecosystem, Android devices must support them ...
-
Iframe框架+table布局 +div布局实例
<td colspan="2" style="width: 80%"> <iframe src="http://www.baidu. ...
-
Oracle分析函数-统计(sum、avg、max、min)
很多需求中都涉及到统计:均值.累计.范围均值.相邻记录比较等.这些操作会统计多次,或有明确的统计范围,或返回的记录统计的数据集不同... 根据场景不同可分为如下几类: 1. 全统计 2. 滚动统计 3 ...
-
振动器(Vibrator)
package com.wwj.serviceandboardcast; import android.app.Activity; import android.app.Service; impo ...
-
CTEX windedt 打开中文tex乱码问题
% !TEX encoding = System % !TEX program = pdflatex % !TEX encoding = System% !TEX program = pdflatex ...
-
CSAPP chapter2 记录(bit_level_coding)
p_154 //5x/8 define MSB_BIT (~(~)) int mul5div8(int val) { int sign = (val & MSB_BIT) == MSB_BIT ...