UIStackView
makes it really easy to create a nice animation using the hidden property of a UIView. I have two UIStackViews
each with UILabels
in the arrangedSubviews
and when I add a new UILabel
to a UIStackView
, it should present it with an animation of the label appearing at the correct index, pushing the labels above and below it.
This effect is very easy to do using UIStackViews
:
descriptionLabel.hidden = true
let count = descriptionStack.arrangedSubviews.count
descriptionStack.insertArrangedSubview(expenseLabel.descriptionLabel, atIndex: count - 1)
UIView.animateWithDuration(0.5) {
descriptionLabel.hidden = false
}
I want to do this effect simultaneously for two different UIStackViews
, but this causes some weird behaviour, where one is animated correctly while the other drops in from the top of the view.
Assuming that the above code can be repeated for some other view and create the same animation:
descriptionLabel.hidden = true
costLabel.hidden = true
let count = descriptionStack.arrangedSubviews.count
descriptionStack.insertArrangedSubview(expenseLabel.descriptionLabel, atIndex: count - 1)
costStack.insertArrangedSubview(expenseLabel.costLabel, atIndex: count - 1)
UIView.animateWithDuration(0.5) {
descriptionLabel.hidden = false
UIView.animateWithDuration(0.5) {
costLabel.hidden = false
}
}
In this example, the costLabel
is animated correctly, while descriptionLabel
drops in from the top of the UIStackView
. Reversing the order causes the costLabel
to drop in and descriptionLabel
to animate correctly.
I've tried variations of this animation code e.g. not nesting the animations and using UIView.animateKeyframesWithDuration
.
Doing it as below, causes the costLabel
to drop in and the descriptionLabel
to animate correctly:
UIView.animateWithDuration(0.5) {
descriptionLabel.hidden = false
}
UIView.animateWithDuration(0.5) {
costLabel.hidden = false
}
I cannot figure out why the animations are always different from each other. How do I animate both labels simultaneously and having the effect where they appear at the correct index, pushing the labels above and below?
I have exactly the same problem. I found out that setting the Content Mode
property of the UILabel
seems to change the way the UIView
animation is performed. In my case I wanted to achieve an animation from top to bottom. The default animation was a slide in from left combined with a resize. Setting Content Mode to Top
worked for me.
Maybe that helps.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With