zoukankan      html  css  js  c++  java
  • (八十七)AutoLayout的简单介绍与实例

    AutoLayout是继AutoResizing之后的一种自己主动布局方法。攻克了AutoResizing无法处理控件间相互关系的问题。

    AutoLayout在storyboard中通过底部工具条设置,底部工具条仅仅有勾选了AutoLayout同意才干显示。

    从左到右三个button各自是 对齐、固定和尺寸修复。

    【Align】

    第一栏和第二栏都无法选择,由于它们都是相对属性,须要一个以上的控件。

    第一栏各自是左、右、上、下对齐。后面的值是偏移量。

    第二栏是相对还有一个控件水平、居中对齐或者基于某条线对齐。

    第三栏能够直接选择,是相对于屏幕水平和垂直对齐。

    【Pin】

    上面的四个属性和AutoResizing一致。表示四个方向的固定距离。右面的小箭头代表的是相对于哪个View。须要注意的是,假设B想相对于A布局,让B的顶部距离A的底部20点,则在B中要选择相对于A。则A必须在B的上面才可选择,如图所看到的:在下拉框中选择正确的View。为了方便。应当给每一个View都起个名字。

    以下的Equal Widths和Equal Heights都是须要两个或两个以上View,实现他们的宽、高一致所用。

    注意在第一栏的最后有Constrain to margins是默认勾选的。iOS8有新特性。左右有一定边距,假设要相对于屏幕的边缘计算,应该取消勾选,一定要注意。

    【Resolve Auto Layout Issues】

    在AutoLayout约束后的结果与当前显示不一致时。点击Update Frames就可以更新视图。


    【注意点】

    1.使用了AutoLayout以后尽量不要设置frame,否则可能会出现奇怪的问题。

    2.AutoLayout出现红色为错误,说明缺少约束条件;黄色为警告,应当Update Frames更新视图。


    【更改约束实现比例关系】

    有时候会有一种需求,A相对屏幕居中。B和A右对齐,而且B的宽度是A的一半。重点是最后这个比例关系。

    主要有两种实现方式。介绍之前,先介绍更改约束的方法,点击随意一条约束线,看右側的界面:

    这里反映的是计算关系,公式为First = (Second + Constant) * Multiplier。如果这个是宽度关系。而且blueView的宽度已经固定。则依据上面的公式。系统会自己主动解出redView的宽度。反之亦然。

    ★实现方法一:利用宽度关系

    为A、B加入Equal Widths约束,选中约束线。更改Multiplier,使得ViewB.width = (ViewA.width + 0) * 0.5,或者满足ViewA.width = (ViewB.width + 0) * 2。

    ★实现方法二:利用居中对齐

    由于A相对屏幕居中,因此仅仅要让B的左側和屏幕中线对齐就可以。

    实现方法为SuperView.Center X = (ViewB.Leading + 0) * 1。由于父视图的中心X不变,因此仅仅能让ViewB的左側变化,从而实现了与中线对齐。


    【控制器View伸缩变化时的处理】

    假设控制器View伸缩,而子控件相对屏幕的位置又不能变,能够选择依照屏幕的中线进行布局。

  • 相关阅读:
    wpf之文件浏览上传
    通过UM用例来图示化系统
    C# System.IO.FileStream 文件正由另一进程使用,因此该进程无法访问该文件
    WPF控件内容模型
    Panel Decorator TextBlock内容模型
    winForm 读取pdf文件并,转换成图片
    wpf之TreeView绑定
    角色权限设计解决方案
    .NET客户端js调用服务器端控件的方法
    快速排序算法
  • 原文地址:https://www.cnblogs.com/cynchanpin/p/6703318.html
Copyright © 2011-2022 走看看