您的位置:首页 > 编程语言

AutoLayout-VFL代码布局<一>

2015-05-12 00:00 375 查看
摘要: AutoLayout 代码布局

参照 AutoLayout入门和VFL经验分享实现demo





UIView *purpleView = UIView.new;
purpleView.backgroundColor = UIColor.purpleColor;
purpleView.translatesAutoresizingMaskIntoConstraints = NO;
[self addSubview:purpleView];

UIView *greenView = UIView.new;
greenView.backgroundColor = UIColor.greenColor;
greenView.translatesAutoresizingMaskIntoConstraints = NO;
[purpleView addSubview:greenView];

UIView *redView = UIView.new;
redView.backgroundColor = UIColor.redColor;
redView.translatesAutoresizingMaskIntoConstraints = NO;
[purpleView addSubview:redView];

UIView *blueView = UIView.new;
blueView.backgroundColor = UIColor.blueColor;
blueView.translatesAutoresizingMaskIntoConstraints = NO;
[self addSubview:blueView];

NSDictionary *views = NSDictionaryOfVariableBindings(greenView,redView,blueView,purpleView);

NSDictionary *metrics = @{@"hPadding":@15,@"vPadding":@15};

//  greenView redView
{
//横向排列 superview-间距-greenView-间距-间距-redView-间距-superview
NSString *format = @"H:|-hPadding-[greenView]-hPadding-[redView(greenView)]-hPadding-|";

//限制 宽度和x坐标位置,
NSArray *constrains1 = [NSLayoutConstraint
constraintsWithVisualFormat:format // 宽度和x坐标位置,
options:NSLayoutFormatAlignAllTop|NSLayoutFormatAlignAllBottom // origin.y size.height
metrics:metrics
views:views];
[self addConstraints:constrains1];

//纵向  superview-间距-greenView-间距-superview
NSString* format2 = @"V:|-vPadding-[greenView]-vPadding-|";

NSArray *constrains2 = [NSLayoutConstraint
constraintsWithVisualFormat:format2 // 限制y 坐标
options:0
metrics:metrics
views:views];

/*constrains1 限制 宽度和x坐标位置
constrains2 限制y 坐标
constrains1 constrains2 共同限制 高度
*/
[self addConstraints:constrains2];
}
// blueView purpleView 约束条件
{
[self addConstraints:
[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-hPadding-[blueView]-hPadding-|" options:0 metrics:metrics views:views]];

[self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-vPadding-[purpleView]-vPadding-[blueView(purpleView)]-vPadding-|" options:NSLayoutFormatAlignAllLeft |NSLayoutFormatAlignAllRight metrics:metrics views:views]];
}


附源代码 https://github.com/p-p-b/AutoLayoutDemo
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  AutoLayout 代码布局