相对于兄弟UIViews的iOS Autolayout以编程方式

时间:2016-04-28 10:52:10

标签: ios layout uiview autolayout nslayoutconstraint

我正在尝试在容器视图(C1)中添加3个自定义视图(redView,greenView,yellowView),以便所有自定义视图(redView,greenView,yellowView)以编程方式使用自动布局约束相互低于。我希望容器视图(C1)的大小与子视图的大小相同,因此输出应该是这样的。 enter image description here

红色,绿色和黄色视图仅用于显示预期结果。实际上我的自定义视图是这样的。

enter image description here

我正在使用自动布局来执行此操作。这是我的代码。 RatingsSingleView是我的自定义视图,如上图所示。

    @interface ViewController ()

    @property (weak, nonatomic) IBOutlet UIView *ratingsContainerView;

    @end

    @implementation ViewController



        - (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.

    UIView *previousTopView = self.ratingsContainerView;
    for(int i = 0; i < 3; ++i) {
        RatingsSingleView *view = [[RatingsSingleView alloc] init];
        view.translatesAutoresizingMaskIntoConstraints = NO;
        [self.ratingsContainerView addSubview:view];
        NSLayoutConstraint *topConstraint = nil;
        if(i == 0) {
            // Making the first subview top aligned to the container View top 
            topConstraint = [NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:previousTopView attribute:NSLayoutAttributeTop multiplier:1.0 constant:10.0];
        } else{
                    // Making the second and third subview top aligned to the view above it
            topConstraint = [NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:previousTopView attribute:NSLayoutAttributeBottom multiplier:1.0 constant:10.0];
        }

        NSLayoutConstraint *leftConstraint = [NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeLeft relatedBy:NSLayoutRelationEqual toItem:self.ratingsContainerView attribute:NSLayoutAttributeLeft multiplier:1.0 constant:10.0];

        NSLayoutConstraint *rightConstraint = [NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeRight relatedBy:NSLayoutRelationEqual toItem:self.ratingsContainerView attribute:NSLayoutAttributeRight multiplier:1.0 constant:10.0];


        [self.ratingsContainerView addConstraint:topConstraint];
        [self.ratingsContainerView addConstraint:leftConstraint];
        [self.ratingsContainerView addConstraint:rightConstraint];


        if(i == 2) {
            // Adding last subview bottom to the container View bottom
            NSLayoutConstraint *bottomConstraint = [NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:self.ratingsContainerView attribute:NSLayoutAttributeBottom multiplier:1.0 constant:-10.0];
             [self.ratingsContainerView addConstraint:bottomConstraint];

        }
        previousTopView = view;

    }
}
@end

所以问题是我没有得到预期的结果。我将容器视图固定到左右边缘,并在故事板中将其高度设置为0。一旦我运行上面的代码,我得到以下结果。

enter image description here

有些身体可以指导我在这里做错了什么。感谢

1 个答案:

答案 0 :(得分:1)

你已经给出了一些错误的约束,我已经纠正了它试试这个......

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.

    UIView *previousTopView = self.ratingsContainerView;
    for(int i = 0; i < 3; ++i) {
        RatingsSingleView *view = [[RatingsSingleView alloc] init];
        view.translatesAutoresizingMaskIntoConstraints = NO;
        [self.ratingsContainerView addSubview:view];
        NSLayoutConstraint *topConstraint = nil;
        if(i == 0) {
            // Making the first subview top aligned to the container View top 
            topConstraint = [NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:previousTopView attribute:NSLayoutAttributeTop multiplier:1.0 constant:10.0];
        } else{
                // Making the second and third subview top aligned to the view above it
            topConstraint = [NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:previousTopView attribute:NSLayoutAttributeBottom multiplier:1.0 constant:10.0];
        }

        NSLayoutConstraint *leftConstraint = [NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:self.ratingsContainerView attribute:NSLayoutAttributeLeading multiplier:1.0 constant:10.0];

        NSLayoutConstraint *rightConstraint = [NSLayoutConstraint constraintWithItem:self.ratingsContainerView attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:view attribute:NSLayoutAttributeTrailing multiplier:1.0 constant:10.0];


        [self.ratingsContainerView addConstraint:topConstraint];
        [self.ratingsContainerView addConstraint:leftConstraint];
        [self.ratingsContainerView addConstraint:rightConstraint];

        if(i == 2) {
            // Adding last subview bottom to the container View bottom
            NSLayoutConstraint *bottomConstraint = [NSLayoutConstraint constraintWithItem:self.ratingsContainerView attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:view attribute:NSLayoutAttributeBottom multiplier:1.0 constant:10.0];
            [self.ratingsContainerView addConstraint:bottomConstraint];

        }
        previousTopView = view;

}