zoukankan      html  css  js  c++  java
  • PureLayout

    PureLayout 是 iOS & OS X Auto Layout 的终极 API——非常简单,又非常强大。PureLayout 通过一个全面的Auto Layout API 扩展了 UIView/NSView, NSArray 和 NSLayoutConstraint,仿照苹果自身的框架, 构建了一个全面的自动布局 API, 这样你再也不用为适配而苦恼啦!!!

    添加PureLayout到你的工程里面

    • 用CocoaPods安装(podilfe中加pod 'PureLayout')/GitHub下载PureLayout, 手动添加到你的项目中
    • 导入头文件#import <PureLayout/PureLayout.h> /  #import "PureLayout.h"

    我们就这个布局来简单说一下

    首先新建几个 View

    1
    2
    3
    4
    5
    @property (nonatomic, strong) UIView *blueView;
    @property (nonatomic, strong) UIView *redView;
    @property (nonatomic, strong) UIView *yellowView;
    @property (nonatomic, strong) UIView *greenView;
    @property (nonatomic, assign) BOOL didSetupConstraints; // 判断是否存在约束条件

    然后在加载试图

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    - (void)loadView
    {
    self.view = [UIView new];
    self.view.backgroundColor = [UIColor colorWithWhite:0.1 alpha:1.0];

    [self.view addSubview:self.blueView];
    [self.view addSubview:self.redView];
    [self.view addSubview:self.yellowView];
    [self.view addSubview:self.greenView];
    [self.view setNeedsUpdateConstraints]; // 设置新的约束天剑
    }

    如果没有试图,那么就重新创建一个

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36

    - (UIView *)blueView
    {
    if (!_blueView) {
    _blueView = [UIView newAutoLayoutView];
    _blueView.backgroundColor = [UIColor blueColor];
    }
    return _blueView;
    }

    - (UIView *)redView
    {
    if (!_redView) {
    _redView = [UIView newAutoLayoutView];
    _redView.backgroundColor = [UIColor redColor];
    }
    return _redView;
    }

    - (UIView *)yellowView
    {
    if (!_yellowView) {
    _yellowView = [UIView newAutoLayoutView];
    _yellowView.backgroundColor = [UIColor yellowColor];
    }
    return _yellowView;
    }

    - (UIView *)greenView
    {
    if (!_greenView) {
    _greenView = [UIView newAutoLayoutView];
    _greenView.backgroundColor = [UIColor greenColor];
    }
    return _greenView;
    }

    然后再添加试图的约束条件

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    - (void)updateViewConstraints   //更新约束条件
    {
    // 如果没有自动约束条件
    if (!self.didSetupConstraints) {
    // Blue view is centered on screen,(Centers the view in its superview.) with size {50 pt, 50 pt}

    //设置蓝色的 view 在父试图的中心,
    [self.blueView autoCenterInSuperview];
    //设置蓝色的 view 的宽和高(50.0 50.0)
    [self.blueView autoSetDimensionsToSize:CGSizeMake(50.0, 50.0)];

    // Red view is positioned at the bottom right corner of the blue view, with the same width, and a height of 40 pt
    // 设置红色 view 的顶部是蓝色 view 的底部
    [self.redView autoPinEdge:ALEdgeTop toEdge:ALEdgeBottom ofView:self.blueView];
    //设置红色 view 的左边是蓝色 view 的右边
    [self.redView autoPinEdge:ALEdgeLeft toEdge:ALEdgeRight ofView:self.blueView];
    //设置红色 view 的宽度就是蓝色 view 的宽度
    [self.redView autoMatchDimension:ALDimensionWidth toDimension:ALDimensionWidth ofView:self.blueView];
    //设置红色 view 的高度为40.0
    [self.redView autoSetDimension:ALDimensionHeight toSize:40.0];

    // Yellow view is positioned 10 pt below the red view, extending across the screen with 20 pt insets from the edges,
    // and with a fixed height of 25 pt
    //设置黄色 veiw 的顶部距离红色 view 距离为10.0
    [self.yellowView autoPinEdge:ALEdgeTop toEdge:ALEdgeBottom ofView:self.redView withOffset:10.0];
    //设置黄色 view 的高度为25.0
    [self.yellowView autoSetDimension:ALDimensionHeight toSize:25.0];
    //设置黄色 view 距离父试图左边的距离为20.0
    [self.yellowView autoPinEdgeToSuperviewEdge:ALEdgeLeft withInset:20.0];
    //设置黄色 view 距离父试图右边的距离为20.0
    [self.yellowView autoPinEdgeToSuperviewEdge:ALEdgeRight withInset:20.0];

    // Green view is positioned 10 pt below the yellow view, aligned to the vertical axis of its superview,
    // with its height twice the height of the yellow view and its width fixed to 150 pt
    //设置绿色 view 的顶部距离黄色 view 的底部距离为10.0
    [self.greenView autoPinEdge:ALEdgeTop toEdge:ALEdgeBottom ofView:self.yellowView withOffset:10.0];
    //设置绿色 view 相对父试图竖向居中
    [self.greenView autoAlignAxisToSuperviewAxis:ALAxisVertical];
    //设置绿色的 view 的高度是黄色 view 高度的2.0倍
    [self.greenView autoMatchDimension:ALDimensionHeight toDimension:ALDimensionHeight ofView:self.yellowView withMultiplier:2.0];
    //设置绿色 view 的宽度为150.0
    [self.greenView autoSetDimension:ALDimensionWidth toSize:150.0];

    //设置已经添加过约束了
    self.didSetupConstraints = YES;
    }

    [super updateViewConstraints];
    }

    github 地址:https://github.com/smileyborg/PureLayout#

  • 相关阅读:
    【Gitbook】实用配置及插件介绍
    【Git】学习记录
    【Ubuntu】使用记录
    intellij idea
    【应用】信息短时存储
    leetcode pow(x,n)实现
    SSM框架-----------SpringMVC+Spring+Mybatis框架整合详细教程
    《平凡的世界》之我看
    垃圾收集器与内存分配策略(三)
    垃圾收集器与内存分配策略(二)
  • 原文地址:https://www.cnblogs.com/SensenCoder/p/5134628.html
Copyright © 2011-2022 走看看