Как создать анимацию UIView bounce?
У меня есть следующее CAT-переход для UIView, называемый finalScoreView
, который заставляет его вводить экран сверху:
CATransition *animation = [CATransition animation];
animation.duration = 0.2;
animation.type = kCATransitionPush;
animation.subtype = kCATransitionFromBottom;
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];
[gameOver.layer addAnimation:animation forKey:@"changeTextTransition"];
[finalScoreView.layer addAnimation:animation forKey:@"changeTextTransition"];
Как мне сделать так, чтобы он отскакивал один раз после того, как он опускался, а затем все еще остается? Он должен по-прежнему вводить экран сверху, а затем отскакивать, когда он падает.
Любая помощь будет очень признательна, спасибо!
Ответы
Ответ 1
С iOS7 и UIKit Dynamics больше не нужно использовать анимации CAKeyframeAnimations
или UIView
!
Посмотрите приложение Apple UIKit Dynamics Catalog. Альтернативно, Teehanlax имеет четкое, краткое руководство с полным проектом в github. Если вам нужен более подробный учебник об интуиции динамики, учебник Ray Winderlich отлично. Как всегда, документы Apple являются отличной первой остановкой, поэтому ознакомьтесь с ссылкой на класс UIDynamicAnimator в документах.
Вот немного кода из учебника Teenhanlax:
self.animator = [[UIDynamicAnimator alloc] initWithReferenceView:self.view];
UIGravityBehavior* gravityBehavior =
[[UIGravityBehavior alloc] initWithItems:@[self.redSquare]];
[self.animator addBehavior:gravityBehavior];
UICollisionBehavior* collisionBehavior =
[[UICollisionBehavior alloc] initWithItems:@[self.redSquare]];
collisionBehavior.translatesReferenceBoundsIntoBoundary = YES;
[self.animator addBehavior:collisionBehavior];
UIDynamicItemBehavior *elasticityBehavior =
[[UIDynamicItemBehavior alloc] initWithItems:@[self.redSquare]];
elasticityBehavior.elasticity = 0.7f;
[self.animator addBehavior:elasticityBehavior];
И вот результаты
![Square bounce]()
UIKit Dynamics - действительно мощное и удобное дополнение к iOS7, и вы можете получить от него отличный внешний интерфейс.
Другие примеры:
![Button bounce]()
![Slide bounce]()
![Springy collection]()
![WWDC sprint collection]()
Шаги по реализации динамики UIKit всегда одинаковы:
- Создайте
UIDynamicAnimator
и сохраните его в сильном свойстве
- Создайте один или несколько
UIDynamicBehaviors
. Каждое поведение должно иметь один или несколько элементов, как правило, для анимации.
- Убедитесь, что начальное состояние элементов, используемых в
UIDynamicBehaviors
, является допустимым состоянием в симуляции UIDynamicAnimator
.
Ответ 2
Более простая альтернатива UIDynamicAnimator
в iOS 7 - это Spring Анимация (новая и мощная анимация блока UIView), которая может дать вам хороший эффект подпрыгивания с затуханием и скоростью:
Цель C
[UIView animateWithDuration:duration
delay:delay
usingSpringWithDamping:damping
initialSpringVelocity:velocity
options:options animations:^{
//Animations
}
completion:^(BOOL finished) {
//Completion Block
}];
Swift
UIView.animateWithDuration(duration,
delay: delay,
usingSpringWithDamping: damping,
initialSpringVelocity: velocity,
options: options,
animations: {
//Do all animations here
}, completion: {
//Code to run after animating
(value: Bool) in
})
usingSpringWithDamping
0.0 == очень бодрый. 1.0 обеспечивает плавное замедление без превышения.
initialSpringVelocity
, грубо говоря, "желаемое расстояние, деленное на желаемые секунды". 1.0 соответствует общему расстоянию анимации, пройденному за одну секунду. Например, общее расстояние анимации составляет 200 точек, и вы хотите, чтобы начало анимации соответствовало скорости просмотра 100 пт/с, используйте значение 0,5.
Более подробное руководство и пример приложения можно найти в этом tutorial. Надеюсь, что это кому-то полезно.
Ответ 3
Вот демонстрационный проект, который я создал, чтобы помочь вам получить анимацию в самый раз. Наслаждайтесь!
SpringDampingDemo
![введите описание изображения здесь]()
Ответ 4
- (IBAction)searchViewAction:(UIButton*)sender
{
if(sender.tag == 0)
{
sender.tag = 1;
CGRect optionsFrame2 = self.defaultTopView.frame;
optionsFrame2.origin.x = -320;
CGRect optionsFrame = self.searhTopView.frame;
optionsFrame.origin.x = 320;
self.searhTopView.frame = optionsFrame;
[UIView animateWithDuration:1.0 delay:0.0 usingSpringWithDamping:0.5 initialSpringVelocity:1.0 options:0 animations:^{
CGRect optionsFrame = self.searhTopView.frame;
optionsFrame.origin.x = 0;
self.searhTopView.frame = optionsFrame;
self.defaultTopView.frame = optionsFrame2;
} completion:^(BOOL finished) {
}];
}
else
{
sender.tag = 0;
CGRect optionsFrame2 = self.defaultTopView.frame;
optionsFrame2.origin.x = 0;
CGRect optionsFrame = self.searhTopView.frame;
optionsFrame.origin.x = 320;
[UIView animateWithDuration:1.0 delay:0.0 usingSpringWithDamping:0.5 initialSpringVelocity:1.0 options:0 animations:^{
CGRect optionsFrame = self.searhTopView.frame;
optionsFrame.origin.x = 320;
self.searhTopView.frame = optionsFrame;
self.defaultTopView.frame = optionsFrame2;
} completion:^(BOOL finished) {
}];
}
}