对 uiview 的出口集合应用许多约束并设置动画

Question

我有一个出口标签集。标签位于由堆栈视图作为父级的堆栈视图中。当视图加载时，我想让每个标签淡入并一个接一个地稍微向右移动。我可以在循环中应用约束来抵消它。但是只有一个会动画回到最终位置。

-(void)viewDidLoad {
[super viewDidLoad];
for (UILabel *lbl in _constructionlabels) {
    lbl.alpha = 0.0;
    leadingCnst=[NSLayoutConstraint
    constraintWithItem:lbl
    attribute:NSLayoutAttributeLeading
    relatedBy:NSLayoutRelationEqual
    toItem:[lbl superview]
    attribute:NSLayoutAttributeLeading
    multiplier:1.0
    constant:-25];
    [self.view addConstraint:leadingCnst];
}

}

-(void)viewDidAppear:(BOOL)animated {
[super viewDidAppear:animated];

leadingCnst.constant = 0;
[UIView animateWithDuration:0.33 delay:2 options:UIViewAnimationOptionCurveEaseOut animations:^{
    for (UILabel *lbl in self->_constructionlabels) {
        lbl.alpha = 1.0;
    }
    [self.view layoutIfNeeded];
} completion:^(BOOL finished) {
}];

}

我怎样才能对每个需要的标签应用约束，然后一个接一个地为它们制作动画？

Answer 1

您将需要放置一个递归函数来逐一为每个标签制作动画，而无需 for 循环。在动画中添加完成块。

    func animate(_ label: UILabel, completion: @escaping () -> Void) {
        UIView.animate(withDuration: 1, animations: {
            // add animation here
        }, completion: { _ in
            completion()
        })
    }

    let labelCollection = [UILabel]()
    var index = 0

    func startAnimation() {
        animate(labelCollection[index], completion: {
            if self.index < self.labelCollection.count - 1 {
                self.index = self.index + 1
                self.startAnimation()
            }
        })
    }

Answer 2

保留对每个标签约束的引用并同时启动所有动画，每个动画都有延迟。

// Declare array to hold references to constraints
NSMutableArray* _labelConstraints = [NSMutableArray array];

-(void) viewDidLoad {
    [super viewDidLoad];
    for (UILabel * lbl in _constructionlabels) {
        lbl.alpha = 0.0;

        NSLayoutConstraint* leadingCnst = [NSLayoutConstraint
            constraintWithItem: lbl
            attribute: NSLayoutAttributeLeading
            relatedBy: NSLayoutRelationEqual
            toItem: [lbl superview]
            attribute: NSLayoutAttributeLeading
            multiplier: 1.0
            constant: -25
        ];
        [self.view addConstraint: leadingCnst];

        // Add constraint reference
        [_labelConstraints addObject: @(leadingCnst)];
    }
}

-(void) viewDidAppear: (BOOL) animated {
    [super viewDidAppear: animated];

    for (i = 0; i < [_constructionlabels count]; i++) {

        // Get label
        Label* lbl = [_constructionlabels objectAtIndex:i];        

        // Get constraint
        NSLayoutConstraint* labelConstraint = [_labelConstraints objectAtIndex:i];      

        // Animate
        [UIView animateWithDuration: 0.33 delay: i options: UIViewAnimationOptionCurveEaseOut animations: ^ {
                lbl.alpha = 1.0;
                labelConstraint.constant = 0;
                [self.view layoutIfNeeded];
            }
            completion: ^ (BOOL finished) {}
        ];  
    }
}

注意：这只是概念验证 - 您可能需要重构代码。

（好久没写ObjC了，如果有什么错误，我会改正的。）

对 uiview 的出口集合应用许多约束并设置动画

Apply and animate many constraints to outlet collection of uiviews

xcode

animation

objective-c

iboutletcollection

nslayoutconstraint