AutoLayout阅读笔记3------>约束优先级的动画,你值得拥有

原创 2016年05月31日 14:30:42

之前有提到过压缩阻力和吸附阻力,也是通过约束和控件自身的优先级来做的效果

----->>>>>http://blog.csdn.net/deft_mkjing/article/details/51532057


现在来试试用约束的优先级给视图做个动画


1.新建一个工程,把我们需要的布局好,效果如下


这种布局问题应该不大,首先把Switch放在中心位子,然后下面放两个UIView,咱们先不管这两根虚线,记住是两根虚线,把黄色View和红色View的普通视图约束做好,

左侧黄色是top bottom leftright距离右侧红色约束再加上和右侧红色等宽(在黄色界面按住CTRL拖一条线到红色界面,选择Equal Widths)的约束,一共五个

右侧红色top bottom rightleft距离左侧黄色的约束,再加上和左侧黄色等宽的(在红色界面按住CTRL拖一条线到黄色界面,选择Equal Widths)约束也是五个



那么我们要做的就是,开关打开,红色View充满整个屏幕,红色消失,开关关闭,又回到原始状态



先看下优先级

typedef float UILayoutPriority;

static constUILayoutPriority UILayoutPriorityRequiredNS_AVAILABLE_IOS(6_0) =1000;  ==>默认是1000

static constUILayoutPriority UILayoutPriorityDefaultHighNS_AVAILABLE_IOS(6_0) =750

static constUILayoutPriority UILayoutPriorityDefaultLowNS_AVAILABLE_IOS(6_0) =250

static constUILayoutPriority UILayoutPriorityFittingSizeLevelNS_AVAILABLE_IOS(6_0) =50


2.好吧,现在开动了,做手脚了

在黄色的View上面按住CTRL,拖出一根线到它的父视图(也就是控制器的View),如果不进行任何操作,你会看到红色的冲突,这里就是黄色距离父视图右侧的约束和红色距离父视图右侧的约束冲突了,这两者的优先级都是1000。那么我们需要做的是动态改变其优先级,1000(UILayoutPriorityRequired)是最高的,我们点击这两个跟约束,把他们分别更改为750(UILayoutPriorityDefaultHigh实线变成虚线了,说明约束不是UILayoutPriorityRequired(1000),而是小于1000,可以被超越,可以被强行覆盖,被其他高于设定值的约束替换


NOTE:约束冲突了是系统不知道采用哪个,因为他们的优先级是一样的,所以我们动态改变他们就会形成需要的动画

记得把约束拽出来,和拖控件一样的方法

黄色距离父视图右侧的虚线约束:@property (weaknonatomicIBOutlet NSLayoutConstraint *yellowRightContraint;

红色距离父视图右侧的虚线约束:@property (weaknonatomicIBOutlet NSLayoutConstraint *redRightContraint;



约束布局完之后是这样的,左边的是总体布局  中间的是黄色的 右边的红色的

           


3.贴代码

- (IBAction)click:(id)sender
{
    [UIView animateWithDuration:1.0 animations:^{
        if (!self.swtich.isOn) // 关闭
        {
            // 红色距离右边的约束优先级 +1 这样就比黄色距离右边的约束高,黄色的约束失效,红色的有效,所有显示红色黄色两个View
            self.redRightContraint.priority = UILayoutPriorityDefaultHigh + 1;
            // 重新布局调用
            [self.view layoutIfNeeded];
        }
        else // 打开
        {
            // 红色距离右边的约束优先级 -1 这样就比黄色距离右边的约束低了,黄色约束有效,红色失效
            self.redRightContraint.priority = UILayoutPriorityDefaultHigh - 1;
            // 然后把黄色距离右边的约束值设置为负数,把红色顶出界面,那么就只看到黄色的视图充满整个屏幕了
            self.yellowRightContraint.constant = -8;
            // 重新布局调用
            [self.view layoutIfNeeded];
        }
    }];
}


效果如下:




安静安静安静 Over~~~~~~







版权声明:本文为博主原创文章,未经博主允许不得转载。转载请Email我.......

iOS 中 Autolayout 优先级的使用

一、约束的优先级 1,简单介绍 在Autolayout中每个约束都有一个优先级,优先级的范围是1 ~ 1000,默认创建的约束优先级是最高的1000。 在我理解约束优先级核心就是是为了 ...
  • Loving_iOS
  • Loving_iOS
  • 2016年11月03日 10:23
  • 1363

[iOS AutoLayout动画 坑] AutoLayout动画平移坑总结 => Swift/OC

参考帖子:自动布局 Autolayout 报错:Unable to simultaneously satisfy constraints.参考帖子: Auto Layout 进阶参考帖子:谈Story...
  • iOSTianNan
  • iOSTianNan
  • 2016年12月02日 17:34
  • 1177

AutoLayout 浅析动画

1.AutoLayout相关的几个易混淆的方法 setNeedsLayout layoutIfNeeded layoutSubViews setNeedsUpdateConstrain...
  • sun2728
  • sun2728
  • 2016年08月19日 20:47
  • 691

iOS开发-autolayout动画效果实现的几种方法

对于一个基于约束的布局视图,如何改变其值并且带有动画的特效,下面提供两种方法: 如下图,图中有一个很长的view和两个button,现在要求,改变view的高度,并且 两个Button随之上移,并且带...
  • yangbingbinga
  • yangbingbinga
  • 2015年02月09日 23:08
  • 4481

ios Autolayout改变约束, 动画效果处理

用自动布局, 有时候拉出来一条约束, 需要改变, 单纯的改变会比较生硬, 这时想到加个简单的animation动画, [UIView animateWithDuration:0.2f animati...
  • zixiweimi
  • zixiweimi
  • 2015年10月21日 16:31
  • 2649

iOS: 在代码中使用Autolayout (1) - 按比例缩放和优先级

首先说按比例缩放,这是在Interface Builder中无法设置的内容。而在代码中,使用NSLayoutConstraint类型的初始化函数中的multiplier参数就可以非常简单的设置按比例缩...
  • nogodoss
  • nogodoss
  • 2014年02月11日 11:06
  • 17925

Swift 修改约束 添加UIView动画

最近在使用Swift编写程序时 使用UIView动画 对约束执行动画遇到了一个小坑 1.在控制器中添加一个 容器view, 容器view的约束是宽高都是300/ 水平居中/ 竖直居中 2....
  • wang_gwei
  • wang_gwei
  • 2017年03月02日 17:26
  • 811

CALayer的autolayout

autolayout不适用于layer 这里是这么解决的:重写view的layerClass,view使用auto layout,调用view的layoutSubviews重新绘制layer的边界 ...
  • lqzitongyezu
  • lqzitongyezu
  • 2016年08月31日 15:25
  • 801

autolayout 约束优先级

代码计算frame -> autoreszing(父控件和子控件的关系) -> autolayout(任何控件都可以产生关系) -> sizeclass 1,简单介绍 在Autolayout中...
  • binglan520
  • binglan520
  • 2017年07月03日 13:32
  • 148

AutoLayout进阶篇

来自Leo的原创博客,转载请著名出处我的StackOverflow前言AutoLayout用来布局已经不是什么新鲜事了,我之前也写过三篇入门的文章 IB 自动生成 IB拖拽 代码实现 当然,实际开发中...
  • Hello_Hwc
  • Hello_Hwc
  • 2016年06月04日 15:30
  • 10438
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:AutoLayout阅读笔记3------>约束优先级的动画,你值得拥有
举报原因:
原因补充:

(最多只允许输入30个字)