tableview 使用visual format language自适应cell宽高,和横竖屏

再也不用担心,如何做适配了。

使用苹果官方提供的适配方案当然是最正宗的,比第三房框架可控。

可以适配各种屏幕尺寸,以及横竖屏,欢迎有独特简介的极客们,提出宝贵意见

开发过程中,时常会遇到cell自适应高度与横屏下的宽度,传统的做法要么是手动计算frame,要么就是使用xib。

第一种方式,工作量是巨大的(相信很多人深有体会)。

第二种方式,对于协同开发和有些不用xib公司来说,有些可望不可及。

第三种方式,手写constraints。手写过的猿猿们一定体会到会有多少行代码。

其实还有一种看起来不是很友好的方式,那就是使用苹果官方提供的vsl。官方文档地址https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/AutolayoutPG/VisualFormatLanguage/VisualFormatLanguage.html#//apple_ref/doc/uid/TP40010853-CH3-SW1

网上对于这种方式的demo少之又少,官方提供的解释更是简洁不明了。于是花了半天时间研究一番,并写一个demo,便于共同学习。有不同看法的猿猿们,欢迎提出。

下面进入正题:

管理tableview的controller里,只用这样写

_tableView = [[UITableView alloc]initWithFrame:CGRectZero style:UITableViewStylePlain];

_tableView.translatesAutoresizingMaskIntoConstraints = NO;

_tableView.estimatedRowHeight = 44;

_tableView.delegate = self;

_tableView.dataSource = self;

[self.view addSubview:_tableView];

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-0-[_tableView]-0-|" options:0 metrics:0 views:@{@"_tableView":_tableView}]];

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-[_tableView]-|" options:0 metrics:0 views:@{@"_tableView":_tableView}]];

tableview的datasource 和delegate只需要实现两个方法,

#pragma mark - tableview delegate datasource

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section

{

return _rows.count;

}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

{

static NSString *identifier = @"cell";

CustomTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:identifier];

if (!cell) {

cell = [[CustomTableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:identifier];

}

cell.model = self.rows[indexPath.row];

return cell;

}

是不是少了很多代码。

那么核心的cell里应该怎么写呢?

只需这样//add constraints

[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-20-[_leftImageView(==width)]" options:0 metrics:@{@"width":@imageView_size} views:@{@"_leftImageView":_leftImageView}]];

[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-20-[_leftImageView(==height)]" options:0 metrics:@{@"height":@imageView_size} views:@{@"_leftImageView":_leftImageView}]];

爽不爽,不用写很多frame了吧,这就是全部的布局,对,就是这么简单!

demo完整地址:https://github.com/mianhuaijiaju/TestVisual_format_language/tree/master

时间: 2024-10-24 13:48:57

tableview 使用visual format language自适应cell宽高,和横竖屏的相关文章

Autolayout + VFL(Visual Format Language)

最近在学习iOS的布局,在storyboard里,确定布局的思路: 1.确定能确定的: 2.无法确定的,看看是否可以想办法和其他控件关联起来,再根据关系来确定能确定的位置. 例子:实现如下图的布局 过程: 1.确定能确定的: 左上角的View,左边和上边距离父view的距离都是0(当然,这里假设了view的宽度和高度都是100) 设置完成后,点击Add 4 Constraints即可,现在界面如下所示; 左边View Controller Scene后面有个黄色图标,该图标的意思是警告的意思,是

使用Auto Layout中的VFL(Visual format language)--代码实现自动布局

使用Auto Layout中的VFL(Visual format language)--代码实现自动布局 2014-12-09 10:56 编辑: zhiwupei 分类:iOS开发 来源:机智的新手投稿 6 23450 Auto Layout自动布局VFL 招聘信息: 高级iOS开发工程师 高级PHP开发工程师 iOS高级研发工程师 iOS开发工程师 高级iOS手机应用软件开发工程师(培训讲师) 高级Cocos2d-x游戏开发工程师(培训讲师) iOS手机软件开发工程师 iOS工程师 Web后

Autolayout 中的 Visual format language

一.什么时候用autolayout比较适合 1.不负责任的骑墙派说法:apple的设备越来越多了,你的应用应该都使用al.(并且用sb) 2.要看应用内容决定.如果你的内容是信息众多,同时需要展示的类别也很多,尺寸动态不定,甚至这些是在列表中的.(如社交应用).Al能给于很大的帮助. 3.Mac os的应用.现在都做iOS了.mac app的窗口,会有大小变化.al比较合适. 4.支持多向转屏的iPad应用.(有需要支持多方向iphone场景么?那么长,脑残了?) 5.其他业务不复杂,页面较少的

Autolayout 中的Visual format language

一.什么时候用autolayout比较适合 1.不负责任的骑墙派说法:apple的设备越来越多了,你的应用应该都使用al.(并且用sb) 2.要看应用内容决定.如果你的内容是信息众多,同时需要展示的类别也很多,尺寸动态不定,甚至这些是在列表中的.(如社交应用).Al能给于很大的帮助. 3.Mac os的应用.现在都做iOS了.mac app的窗口,会有大小变化.al比较合适. 4.支持多向转屏的iPad应用.(有需要支持多方向iphone场景么?那么长,脑残了?) 5.其他业务不复杂,页面较少的

Visual Format Language

https://developer.apple.com/library/content/documentation/UserExperience/Conceptual/AutolayoutPG/VisualFormatLanguage.html#//apple_ref/doc/uid/TP40010853-CH27-SW1 Visual Format Language This appendix shows how to use the Auto Layout Visual Format Lan

iOS - Visual Format Language

关于autolayout. 1. 尽量用storyboard,添加约束方便直观. 2. 不能用storyboard添加到,考虑 Visual Format Language构建约束 - 直观,易读,代码少 3. 使用NSLayoutAttribute构建约束 - 易读,代码太TM多了 这里以几个例子说明介绍Visual Format Language Visual Format Language是通过设置垂直(V)和水平(H)方向上,view与其它view的间距来实现view的定位.用以下代码添

自动布局和Visual Format Language 简要介绍

假设有一个按钮,你想把它放置在屏幕的中央.视图中心和按钮中心的相对位置可以简单地定义成如下: 按钮的center.x相当于视图中心的center.x 按钮的center.y相当于视图中心的center.y 苹果发现很多的UI组件的位置可以使用一个简单的方程等式得到解决: Object1.property1=(object2.property2*multiplier)+constant value 例如:使用这个方程式,我们可以很容易地将一个按钮放置到他的父视图中,如下所示: Button.cen

Visual Format Language(VFL)视图约束

约束(Constraint)在IOS编程中非常重要,这关乎到用户的直接体验问题. IOS中视图约束有几种方式,常见的是在IB中通过Pin的方式手动添加约束,菜单Editor->Pin->...但是我们往往需要更为灵活的操作,那么就要手动编写代码来实现这些操作. 1:长函数方法 Apple的工程师给我们提供了两种方式,第一种用长函数方法的形式 NSLayoutConstraint(item: <#AnyObject#>, attribute: <#NSLayoutAttribu

使用 Visual Format Language 定义水平和垂直约束

1.问题: 想要定义限制条件来改变一个 UI 组件在其父视图的水平和垂直方向布局的方法. 2.讨论: 使用 visual Format Language 在水平方向的限制条件使用的三个例子 : H:|-100-[_button]-100-| H:|-(<=100)-[_button(>=50)]-(<=100)-| H:|-[_button(>=100,<=200)] V:[_button]-(>=100)-| (注意:为了让程序看起来整齐一致并使设计者更容易做出决定,