最近每周末都會(huì)看葉孤城的直播瞻鹏，對(duì)于我們iOS開(kāi)發(fā)者來(lái)說(shuō)，確實(shí)是一個(gè)福利，很感謝他們的分享精神脐往，收獲到的一些東西特此記錄下。
12月12號(hào) UIStackView
昨天聽(tīng)了里脊串的視頻之后扳埂，除了對(duì)Masonry 有進(jìn)一步了解外业簿，還對(duì)UIStackView,有了初步認(rèn)識(shí)。
串哥圖片—UIStackView
也是一個(gè)很特殊的View,但很好用阳懂，非常方便我們用于布局一個(gè)方向上梅尤；
先來(lái)了解下以下幾個(gè)它的參數(shù)的含義
@property(nonatomic) UILayoutConstraintAxis axis; //橫向或豎向
@property(nonatomic) UIStackViewDistribution distribution; // 以怎樣的方式存在
@property(nonatomic) UIStackViewAlignment alignment;// 費(fèi)主方向上以怎樣的方式對(duì)齊
@property(nonatomic) CGFloat spacing; // 間距
串哥圖片-UIStackView詳解
UIStackViewAlignment
typedef NS_ENUM(NSInteger, UIStackViewAlignment) {
UIStackViewAlignmentFill, // 子視圖填充StackView
UIStackViewAlignmentLeading, //靠左對(duì)齊
UIStackViewAlignmentTop, //靠頂部對(duì)齊
UIStackViewAlignmentFirstBaseline, //按照第一個(gè)子視圖中文字的第一行對(duì)齊。
UIStackViewAlignmentCenter, // 中間對(duì)齊
UIStackViewAlignmentTrailing, //靠右對(duì)齊
UIStackViewAlignmentBottom , // 靠底部對(duì)齊
UIStackViewAlignmentLastBaseline, //按照最后一個(gè)子視圖中文字的最后一行對(duì)齊岩调。
} NS_ENUM_AVAILABLE_IOS(9_0);
串哥圖片—UIStackViewAlignment 1
串哥圖片—UIStackViewAlignment 2
UIStackViewDistribution
typedef NS_ENUM(NSInteger, UIStackViewDistribution) {
UIStackViewDistributionFill = 0, // 默認(rèn)分布方式巷燥，布滿
UIStackViewDistributionFillEqually, // 子視圖的高度或?qū)挾缺３忠恢? UIStackViewDistributionFillProportionally, // StackView自己計(jì)算出它認(rèn)為合適的分布方式
UIStackViewDistributionEqualSpacing, //子視圖保持同等間隔的分布方式
UIStackViewDistributionEqualCentering, //每個(gè)子視圖中心線之間保持一致的分布方式
} NS_ENUM_AVAILABLE_IOS(9_0);
串哥圖片—UIStackViewDistribution1
串哥圖片—UIStackViewDistribution2
代碼嘗試
- (void)learnUIStackView
{
[self.view addSubview:self.stackView];
[self.stackView mas_makeConstraints:^(MASConstraintMaker *make){
make.centerY.equalTo(self.view);
make.right.and.left.equalTo(self.view);
make.height.equalTo(@200);
}];
for(int i = 0; i < 4; i++)
{
UIView * subView = [[UIView alloc] init];
[subView mas_makeConstraints:^(MASConstraintMaker *make){
make.size.mas_equalTo(CGSizeMake(100, 100)).priorityLow();
// 注意降低優(yōu)先級(jí)
}];
subView.backgroundColor = [UIColor greenColor];
[self.stackView addArrangedSubview:subView];
}
}
- (UIStackView *)stackView
{
if(!_stackView)
{
_stackView = [[UIStackView alloc] init];
_stackView.axis = UILayoutConstraintAxisHorizontal; //橫向
_stackView.distribution = UIStackViewDistributionFill; // 布滿
_stackView.alignment = UIStackViewAlignmentCenter; //中間
_stackView.spacing = 5.0f; // 間距
}
return _stackView;
}
效果：
上述代碼的效果
StoryBoard的嘗試
Storyboard中的UIStackView
對(duì)于，storyBoard号枕，后期用的會(huì)很多缰揪，持續(xù)學(xué)習(xí)中····
另外百度大神開(kāi)源的FDStackView,也是可以很好的學(xué)習(xí)。
