iOS中autolayout一个小技巧

作者: 赛赛_lzx | 来源:发表于2016-05-27 14:41 被阅读554次

       简书上讲autolayout的文章很多,但大多数是从理论上来讲的,我这里说一个平时开发中常见到的一种需求,先看一下俩张图吧。

字多的时候
字少的时候

       简单的说明一下就是当文字多的时候图片会往后走,但是图片不能到屏幕以外,最多和屏幕边距保持10个像素的距离。当字再多的时候,会自动换行。iOS的小伙伴们,想一下这样的需求用autolayout改如何实现呢?

解决方案

  1. 拖一个label再拖一个imageView到你的storyBoard或者Xib文件上,先来约束label:据左--给个10吧,居上--你随意吧(或者设置成垂直居中),然后宽度:这块你得添加个约束,否则文字特别多的时候,就会超出屏幕的,所以你先写个320吧(这数字随便),默认的会是等于,你这里需要把它改成小于等于。高度:你随意设置,也可以不管,如果你想显示很多行,那么久设置的大点,或者不设置。
  2. label设置完了,下面设置imageView的约束条件:据左--相对于label定死10吧.据上--你随便吧,自身的宽高约束一下--都是50吧。然后就可以不管了。
  3. 因为需要屏幕适配,你不知道屏幕的宽具体是多少,所以需要你把步骤1中的设置label宽的那个约束找到,然后拖一个IBOutlet出来,就类似与你平时拖一个label的IBOutlet一样。@property (weak, nonatomic) IBOutlet NSLayoutConstraint *screenW;名字我随便起的。拖出来的约束在viewDidload里面修改一下``` self.screenW.constant = [UIScreen mainScreen].bounds.size.width-70;//imageView--50 两边个间距10,所以label宽度不能大于屏幕宽度减去70

>试想一下,如果你用纯代码完成这样的需求需要多少行代码呢?按照这个思路你可以完成很多类似的复杂一些的需求哦😊

#Demo演示
       github上传了Demo地址:[https://github.com/iOSKesai/autolayoutDemo.git](https://github.com/iOSKesai/autolayoutDemo.git),有兴趣的小伙伴可以下载看一下很简单。
#备注

![设置说明](http:https://img.haomeiwen.com/i1538778/36a47f86dc536352.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)





相关文章

  • iOS中autolayout一个小技巧

    简书上讲autolayout的文章很多,但大多数是从理论上来讲的,我这里说一个平时开发中常见到的一种需求,先...

  • Masonry使用的一个小技巧

    今天在Masonry:使用纯代码进行iOS应用的autolayout自适应布局看到了这样一个小技巧,发现之前写的一...

  • 课外学习

    1、iOS Autolayout Interface Builder 技巧 3、iOS-正则表达式与谓词 4、i...

  • iOS小技巧总结

    iOS小技巧总结### 参考iOS_小松哥的iOS小技巧总结 总结日常代码生活中的小技巧,随时可用 阿拉伯数字转中...

  • Autolayout与UIScrollView

    在iOS开发中的Autolayout比较盛行时,需要掌握一些自动布局的技巧。其中属ScrollView的自动布局比...

  • # iOS - AutoLayout -1

    iOS - AutoLayout -1 1、AutoLayout 自动布局(AutoLayout)是iOS6引入的...

  • Autolayout小技巧

    iOS开发UI一直是一个问题,当年用代码画UI一度成为流行趋势,相信代码能万能解决问题,而且十分简单。 然而,现在...

  • iOS开发之 自动布局

    iOS开发之自动布局AutoLayout 目录: 1 iOS自动布局简介2 iOS自动布局AutoLayout(代...

  • iOS - AutoLayout -2 AutoLayout

    # iOS - AutoLayout -2 AutoLayout 上篇文章我们了解了AutoLayout 的布局方...

  • iOS开发基础(OC版)

    一.界面搭建 1.AutoLayout 从此爱上iOS Autolayout iOS8界面...

网友评论

  • a194872ed988:label最好不要设置宽高约束.除非是定死了就是那样儿
    赛赛_lzx:我没有定死,我约束的是下雨等于,只是举个例子,实现这样一个效果,主要目的在于知道约束条件设置小于等于,大于等于的用法。
  • 相遇相识相恋相濡以末:label 的宽度给个固定的,若label字数不够一行还能自适应吗?
    相遇相识相恋相濡以末:@赛赛_lzx 那刚好我有一个疑问请教你一下:smile:问题是:xib布局一个UIimageview,要求是imageview宽高相等但是宽度始终是屏幕的0.5倍,要保持imageview始终是圆形,圆角怎么切 ? 前提是xib布局的imageview:heart_eyes:
    相遇相识相恋相濡以末:@赛赛_lzx额我没仔细约束条件是小于等于:yum:
    赛赛_lzx:@相遇相识相恋相濡以末 你想要什么效果?我这里如果字数少了,后面的图片还是会跟着往前,设置宽度也是小于等于,不是等于。

本文标题:iOS中autolayout一个小技巧

本文链接:https://www.haomeiwen.com/subject/kjxfdttx.html