iOS9.0新特新之UIStackView 的学习

升级iOS9.0后,增加了一些新特性.让们来一点点的了解一下吧.今天我们先学习一下UIstackView,因为它是新特性里给我们在布局方面带来很大便利的控件.以前我们要想布局三个视图(图1)我们会给他们三个视图设置相互的约束关系,如果其中的一个约束发生变化其他也会发生变化 ,这样我们又要重新改一下约束.

iOS9.0新特新之UIStackView 的学习_第1张图片
图1

但是在UIStackView我们实现这个效果就很简单了.使用UIStackView方式不外乎代码和xib.我们先以xib为例写一下,这样比较直观.

一.xib 实现

1.xib拖拽UIStackView

iOS9.0新特新之UIStackView 的学习_第2张图片
图2

然后再设置关于UIStackView的几个重要的属性:

iOS9.0新特新之UIStackView 的学习_第3张图片
UIStackView属性

axis: 设置UIStackView布局的方向:水平方向或垂直方向。

alignment:主要设置非轴方向子视图的对齐方式。

distribution:设置轴方向上子视图的分布比例.如果axis是水平方向,也即设置子视图的宽度,如果axis是垂直方向,则是设置子视图的高度。

spacing:控制子视图之间的间隔大小.

详细的属性介绍请看:iOS中UIStackView相关属性理解 .

二. 代码的方式实现

1.UIStackView 的实例

UIStackView *stackView = [[UIStackView alloc] initWithFrame:CGRectMake(0, 80, 300, 300)];

//设置水平方向

stackView.axis = UILayoutConstraintAxisVertical;

stackView.spacing = 10.0;

stackView.alignment = UIStackViewAlignmentFill;

stackView.distribution = UIStackViewDistributionFillEqually;

[self.view addSubview:stackView];

UILabel *topView = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 100, 50)];

topView.backgroundColor = [UIColor cyanColor];

UILabel *middleView = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 80, 70)];

middleView.backgroundColor = [UIColor orangeColor];

UILabel *bottomView = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 60, 60)];

bottomView.backgroundColor = [UIColor yellowColor];

[stackView addArrangedSubview:topView];

[stackView addArrangedSubview:middleView];

[stackView addArrangedSubview:bottomView];

出来的效果是这样的:

iOS9.0新特新之UIStackView 的学习_第4张图片
运行效果

具体的其他属性的组合和样式大家参考iOS中UIStackView相关属性理解自己设置一下,顺便练习一下.

三.总结

1.从上面的的代码中大家可能注意到了为什么所有的view起始点都是(0,0)但是却没有覆盖在一起呢?

是因为我们在往UIStackView中添加的视图的时候调用的是:

[stackView addArrangedSubview:topView];

而不是

[self.view addSubview:stackView];

此处千万不要惯性思维用addSubview:这个方法.否则的效果就是这样的:

iOS9.0新特新之UIStackView 的学习_第5张图片
用addSubview:后的效果

这个时候我们就范老毛病了(哎,我加的没错啊,代码是一样一样的啊,咋回事啊!)你好好看看是一样一样的吗.(坏笑)

2.UIStackView的使用很灵活,千万不要有一个UIStackView就可以解决所有布局的思想误区.其实UIStackView的子View也同样可以是UIStackView.只有多个UIStackView组合才能实现比较复杂的界面效果.就看你是怎么构思的了.在写界面前一定要构思好再动手去做.磨刀不误砍柴工嘛.

3.有些人觉得让我空想构思也不太熟练啊,好吧,我有高招甩你个链接多练习练习就好了.我也是在学习中.UIStackView Tutorial: Introducing Stack Views

好了大概就写到这里了.有哪里做的不好的地方请大家都提出来,我会认真改正的.多谢!

你可能感兴趣的:(iOS9.0新特新之UIStackView 的学习)