【第22期】观点:IT 行业加班,到底有没有价值?

Masonry - Autolayout 第三方自动布局类  归纳

原创 2015年11月20日 20:43:03
页面布局的三个时期
MagicNumber -> autoresizingMask -> autolayout
链式的自然语言

一.添加约束的方法:

首先在Masonry中能够添加autolayout约束有三个函数

1
2
3
4
5
6
7
8
9
- (NSArray *)mas_makeConstraints:(void(^)(MASConstraintMaker *make))block;
- (NSArray *)mas_updateConstraints:(void(^)(MASConstraintMaker *make))block;
- (NSArray *)mas_remakeConstraints:(void(^)(MASConstraintMaker *make))block;
/*
mas_makeConstraints 只负责新增约束 Autolayout不能同时存在两条针对于同一对象的约束 否则会报错 
mas_updateConstraints 针对上面的情况 会更新在block中出现的约束 不会导致出现两个相同约束的情况
mas_remakeConstraints 则会清除之前的所有约束 仅保留最新的约束
三种函数善加利用 就可以应对各种情况了
*/


二.支持的属性

1
2
3
4
5
6
7
8
9
10
11
@property (nonatomic, strong, readonly) MASConstraint *left;
@property (nonatomic, strong, readonly) MASConstraint *top;
@property (nonatomic, strong, readonly) MASConstraint *right;
@property (nonatomic, strong, readonly) MASConstraint *bottom;
@property (nonatomic, strong, readonly) MASConstraint *leading;
@property (nonatomic, strong, readonly) MASConstraint *trailing;
@property (nonatomic, strong, readonly) MASConstraint *width;
@property (nonatomic, strong, readonly) MASConstraint *height;
@property (nonatomic, strong, readonly) MASConstraint *centerX;
@property (nonatomic, strong, readonly) MASConstraint *centerY;
@property (nonatomic, strong, readonly) MASConstraint *baseline;


三.符合约束
这样的简便的方法可以很快捷的创建多个约束在同一时间 更加高效
edges(边缘)
// make top, left, bottom, right equal view2
make.edges.equalTo(view2);

// make top = superview.top + 5, left = superview.left + 10,
//      bottom = superview.bottom - 15, right = superview.right - 20
make.edges.equalTo(superview).insets(UIEdgeInsetsMake(5, 10, 15, 20))

size

// make width and height greater than or equal to titleLabel
make.size.greaterThanOrEqualTo(titleLabel)

// make width = superview.width + 100, height = superview.height - 50
make.size.equalTo(superview).sizeOffset(CGSizeMake(100, -50))

center


// make centerX and centerY = button1
make.center.equalTo(button1)

// make centerX = superview.centerX - 5, centerY = superview.centerY + 10
make.center.equalTo(superview).centerOffset(CGPointMake(-510))

四.比较语法比较语法(等于 小于 大于)

.equalTo equivalent to NSLayoutRelationEqual

.lessThanOrEqualTo equivalent to NSLayoutRelationLessThanOrEqual


.greaterThanOrEqualTo equivalent to NSLayoutRelationGreaterThanOrEqual

支持比较语法的参数类型:
1. MASViewAttribute
eg:make.centerX.lessThanOrEqualTo(view2.mas_left);
MASViewAttribute NSLayoutAttribute
view.mas_left NSLayoutAttributeLeft
view.mas_right NSLayoutAttributeRight
view.mas_top NSLayoutAttributeTop
view.mas_bottom NSLayoutAttributeBottom
view.mas_leading NSLayoutAttributeLeading
view.mas_trailing NSLayoutAttributeTrailing
view.mas_width NSLayoutAttributeWidth
view.mas_height NSLayoutAttributeHeight
view.mas_centerX NSLayoutAttributeCenterX
view.mas_centerY NSLayoutAttributeCenterY
view.mas_baseline NSLayoutAttributeBaseline

2. UIView/NSView
eg:if you want view.left to be greater than or equal to label.left :
//these two constraints are exactly the same
make.left.greaterThanOrEqualTo(label);
make.left.greaterThanOrEqualTo(label.mas_left);
3. NSNumber
注意:Auto Layout allows width and height to be set to constant values.(允许宽高使用NSNumber) if you want to set view to have a minimum and maximum width you could pass a number to the equality blocks:
//width >= 200 && width <= 400
make.width.greaterThanOrEqualTo(@200);
make.width.lessThanOrEqualTo(@400)
However Auto Layout does not allow alignment attributes such as left, right, centerY etc to be set to constant values.(不允许其他属性使用NSNumber) So if you pass a NSNumber for these attributes Masonry will turn these into constraints relative to the view’s superview i.e.:(使用NSNumber,这些属性体将把这些变成约束相对于视图的父视图)
//creates view.left = view.superview.left + 10
make.left.lessThanOrEqualTo(@10)

面对上面情况的解决办法:
Instead of using NSNumber, you can use primitives and structs to build your constraints,(使用原始语句或者自己构建约束) like so:
make.top.mas_equalTo(42);
make.height.mas_equalTo(20);
make.size.mas_equalTo(CGSizeMake(50, 100));
make.edges.mas_equalTo(UIEdgeInsetsMake(10, 0, 10, 0));
make.left.mas_equalTo(view).mas_offset(UIEdgeInsetsMake(10, 0, 10, 0));

By default, macros which support autoboxing are prefixed with mas_. Unprefixed versions are available by defining MAS_SHORTHAND_GLOBALS before importing Masonry.
默认情况下,宏支持autoboxing与mas_前缀。无前缀的版本可以通过定义MAS_SHORTHAND_GLOBALS之前输入约束

4. NSArray
An array of a mixture of any of the previous types(数组是之前类型的混合)
make.height.equalTo(@[view1.mas_height, view2.mas_height]);
make.height.equalTo(@[view1, view2]);
make.left.equalTo(@[view1, @100, view3.right]);


五.优先级prioritize(优先级)

 

.priority allows you to specify an exact priority

.priorityHigh equivalent to(等效) UILayoutPriorityDefaultHigh(优先级高)

.priorityMedium is half way between high and low(高低的一半)

.priorityLow equivalent to UILayoutPriorityDefaultLow(优先级低)

Priorities are can be tacked on to the end of a constraint chain like so:

make.left.greaterThanOrEqualTo(label.mas_left).with.priorityLow();

make.top.equalTo(label.mas_top).with.priority(600);


六.更新约束

1. References 引用

You can hold on to a reference of a constraint by assigning the result of a constraint make expression to a local variable or a class property. You could also reference multiple constraints by storing them away in an array.
你可以坚持一个引用特定约束条件的约束使表达式的结果来分配给一个局部变量或一个类属性。你也可以引用多个约束将它们存储在一个数组中。

// in public/private interface
@property (nonatomic, strong) MASConstraint *topConstraint;

...

// when making constraints
[view1 mas_makeConstraints:^(MASConstraintMaker *make) {
    self.topConstraint = make.top.equalTo(superview.mas_top).with.offset(padding.top);
    make.left.equalTo(superview.mas_left).with.offset(padding.left);
}];

...
// then later you can call
[self.topConstraint uninstall];


2. mas_updateConstraints  (更新)
Alternatively if you are only updating the constant value of the constraint you can use the convience method mas_updateConstraints instead of mas_makeConstraints
另外,如果只需要更新约束的值可以使用约束方法来mas_updateConstraints代替mas_makeConstraints
// this is Apple's recommended place for adding/updating constraints
// this method can get called multiple times in response to setNeedsUpdateConstraints
// which can be called by UIKit internally or in your code if you need to trigger an update to your constraints
- (void)updateConstraints {
    [self.growingButton mas_updateConstraints:^(MASConstraintMaker *make) {
        make.center.equalTo(self);
        make.width.equalTo(@(self.buttonSize.width)).priorityLow();
        make.height.equalTo(@(self.buttonSize.height)).priorityLow();
        make.width.lessThanOrEqualTo(self);
        make.height.lessThanOrEqualTo(self);
    }];

    //according to apple super should be called at end of method
    [super updateConstraints];//调用父类方法
}

3. mas_remakeConstraints

mas_updateConstraints is useful for updating a set of constraints, but doing anything beyond updating constant values can get exhausting. That's where mas_remakeConstraints comes in.


mas_remakeConstraints is similar to mas_updateConstraints(两者很相似), but instead of updating constant values, it will remove all of its contraints before installing them again. This lets you provide different constraints without having to keep around references to ones which you want to remove.(mas_remakeConstraints is similar to mas_updateConstraints 两者很相似,除了更新约束的值, mas_remakeConstraints还将在安装新的约束之前移除它的所有约束.这样让你可以提供不同的约束时也不用必须保存那些你要移除的引用)
- (void)changeButtonPosition {
    [self.button mas_remakeConstraints:^(MASConstraintMaker *make) {
        make.size.equalTo(self.buttonSize);

        if (topLeft) {
            make.top.and.left.offset(10);
        } else {
            make.bottom.and.right.offset(-10);
        }
    }];
}



七. 特征

//优化控制台调试可视度

(Masonry 重写了NSLayoutConstraint的description方法 这样可以很容易修改控制台打印的数据 不会出现上面的林乱情况- (NSString *)description)

eg:

Unable to simultaneously satisfy constraints......blah blah blah....
(
    "<NSAutoresizingMaskLayoutConstraint:0x8887740 MASExampleDebuggingView:superview.height == 416>",
    "<MASLayoutConstraint:ConstantConstraint UILabel:messageLabel.height >= 5000>",
    "<MASLayoutConstraint:BottomConstraint UILabel:messageLabel.bottom == MASExampleDebuggingView:superview.bottom - 10>",
    "<MASLayoutConstraint:ConflictingConstraint[0] UILabel:messageLabel.top == MASExampleDebuggingView:superview.top + 1>"
)

Will attempt to recover by breaking constraint
<MASLayoutConstraint:ConstantConstraint UILabel:messageLabel.height >= 5000>


安装:

Installation安装 - 使用cocopods安装

Use the orsome CocoaPods.

In your Podfile

pod 'Masonry'

If you want to use masonry without all those pesky 'mas_' prefixes. Add #define MAS_SHORTHAND to your prefix.pch before importing Masonry

#define MAS_SHORTHAND

Get busy Masoning

#import "Masonry.h"



代码片段

Code Snippets

Copy the included code snippets to ~/Library/Developer/Xcode/UserData/CodeSnippets to write your masonry blocks at lightning speed!

mas_make -> [<view> mas_makeConstraints:^(MASConstraintMaker *make){<code>}];

mas_update -> [<view> mas_updateConstraints:^(MASConstraintMaker *make){<code>}];

mas_remake -> [<view> mas_remakeConstraints:^(MASConstraintMaker *make){<code>}];


版权声明:VIC 举报

相关文章推荐

iOS界面布局之四——使用第三方库Masonry进行autolayout布局

摘要: Masonry是一个十分优秀的autolayout第三方布局框架。 iOS界面布局之四——使用第三方库Masonry进行autolayout布局 一、引言         在...

jQuery Masonry-强大的动态不规则布局插件,让你的网页更自然

Masonry是 一款非常强大的jQuery动态网格布局插件,可以帮助开发人员快速开发类似剪贴画的界面效果。和CSS中float的效果不太一样的地方在 于,float先水平排列,然后再垂直排列,使用Masonry则垂直排列元素,然后将下一个元素放置到网格中

第三方库Masonry自动布局AutoLayout使用

布局:    1. 放在哪  坐标  CGPoint(x, y)    2. 有多大  尺寸  CGSize(width, height) 布局方式:    1.绝对布局(FrameLayout)也...

关于AutoLayout框架Masonry的使用

因为之前做过Android开发,Android的有种布局方式叫做RelativeLayout,使用起来非常灵活。2011年开始接触iOS的时候,发现这种基于坐标的绝对布局方式非常不灵活,所以还是按照Android的RelativeLayout的思想进行,控件的坐标均采用相对布局的关系,比如要实现这个布局:</sp

Masonry 自动布局第三方库

Masonry介绍与使用实践(快速上手Autolayout) 前言 1 MagicNumber -> autoresizingMask -> autolayout...
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

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