瀑布流/流水布局的解决方案

1.最近做的一个项目用到了流水布局,简单粗暴,找了个demo放进去.刚开始静态页面感觉还不错.

demo: http://www.cocoachina.com/ios/20160407/15872.html


demo图

最关键的是图片下面还有4个label和一个imageView, 修改demo里的原始布局,让图片和文字高度自适应

图片和文字都没设置高度.

问题一:加载网络图片的时候,下拉刷新,图片高度和文字高度发生变化.

解决方案:计算文字的高度,文字高度固定后,刷新时布局不会发生改变.

计算文字高度方法:

/*

@param width限制字符串显示区域的宽度

@result float返回的高度

*/

CGSizetitleSize = [textboundingRectWithSize:CGSizeMake(width,MAXFLOAT)options:NSStringDrawingUsesLineFragmentOriginattributes:@{NSFontAttributeName:[UIFontsystemFontOfSize:12]}context:nil].size;

问题二:图片宽高到底是客户端计算呢?还是服务端获取呢.我更倾向于服务器获取,这对强大的服务器来说应该是小菜. 但是不知道怎么回事,可能是服务器配置太渣,后台一加入获取宽高的函数就接口就请求超时,这搞得我非常郁闷,最后还是客户端自己下载图片获取宽高吧.

下载图片的方法:

[SDWebImageManager.sharedManagerloadImageWithURL:[NSURLURLWithString:model.view]options:SDWebImageRetryFailedprogress:nilcompleted:^(UIImage*_Nullableimage,NSData*_Nullabledata,NSError*_Nullableerror,SDImageCacheTypecacheType,BOOLfinished,NSURL*_NullableimageURL) {

}];

不过还存在瑕疵:宽高需要赋初始值.不然会卡住,一进入界面,由于图片没有下载下来导致显示的图片高度不是真实高度.

最终的实现的效果是:


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 174,259评论 25 709
  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 12,276评论 4 61
  • 最近发现自己记性差了好多,拼命想要记住些什么,那就从简书开始吧。 13年6月大学毕业,7月来到深圳。快三年了,我对...
    你当温柔却有力量726阅读 585评论 2 1
  • 看到题目——郭芙为什么讨人嫌?大家可能就会想,很简单啊,她傲娇嘛,自大嘛,闯了那么多祸,还砍断了杨过的胳膊,还不讨...
    八田草阅读 755评论 2 2
  • 这是一本很奇特的小书。翻看的那一刻,如进入了一个人的内心世界,这个人在窥探世界,我们看到了他窥探时记录下的文字。当...
    柳二白阅读 1,197评论 0 6