Найкраща практика анімації iPhone UIView


142

Що вважається найкращою практикою анімації переходів перегляду на iPhone?

Наприклад, ViewTransitionsзразок проекту з яблука використовує код типу:

CATransition *applicationLoadViewIn = [CATransition animation];
[applicationLoadViewIn setDuration:1];
[applicationLoadViewIn setType:kCATransitionReveal];
[applicationLoadViewIn setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn]];
[[myview layer] addAnimation:applicationLoadViewIn forKey:kCATransitionReveal];

але також є фрагменти коду, що плавають по мережі, які виглядають приблизно так:

[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.75];
[UIView setAnimationDelegate:self];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:myview cache:YES];
[myview removeFromSuperview];
[UIView commitAnimations];

Який найкращий підхід? Якщо ви також можете надати фрагмент, він буде дуже вдячний.

ПРИМІТКА. Я не зміг отримати другий підхід до коректної роботи.

Відповіді:


118

З розділу посилання UIView про beginAnimations:context:метод:

Використання цього методу не рекомендується використовувати в iPhone OS 4.0 та новіших версіях. Натомість слід використовувати методи анімації на основі блоків.

Наприклад, анімація на основі блоку, заснована на коментарі Тома

[UIView transitionWithView:mysuperview 
                  duration:0.75
                   options:UIViewAnimationTransitionFlipFromRight
                animations:^{ 
                    [myview removeFromSuperview]; 
                } 
                completion:nil];

4
Отже .. щоб бути зрозумілим, це означає використовувати перший підхід (CATransition), а не другий?
Стів N

2
Так, це перший підхід (CATransition).
NebulaFox

16
@Steven N, ні, це означає UIViewзамість цього використовувати блокові анімації . Вони по суті такі ж, як beginAnimationsі друзі, але використовують функції блокування / закриття.
Дан Розенстарк

36
Так, Яр має рацію. Ось так виглядає блокова анімація: [UIView transitionWithView:mysuperview duration:0.75 options:UIViewAnimationTransitionFlipFromRight animations:^{ [myview removeFromSuperview]; } completion:nil]Перевірте документацію UIView для отримання детальної інформації.
Том ван Зуммерен

3
За винятком випадків, коли ви хочете підтримувати 3.1.3 телефони. Тоді не використовуйте блоки.
ZaBlanc

69

Я використовую останній для безлічі приємних легких анімацій. Ви можете використовувати його перекреслено два погляди, або розтушувати один навпроти іншого, або розтушувати. Ви можете знімати погляд на інший, як банер, ви можете зробити вигляд розтягнутим або зменшити ... Я отримую багато пробігу з beginAnimation/ commitAnimations.

Не думайте, що все, що ви можете зробити, це:

[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:myview cache:YES];

Ось зразок:

[UIView beginAnimations:nil context:NULL]; {
    [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
    [UIView setAnimationDuration:1.0];
    [UIView setAnimationDelegate:self];
    if (movingViewIn) {
// after the animation is over, call afterAnimationProceedWithGame
//  to start the game
        [UIView setAnimationDidStopSelector:@selector(afterAnimationProceedWithGame)];

//      [UIView setAnimationRepeatCount:5.0]; // don't forget you can repeat an animation
//      [UIView setAnimationDelay:0.50];
//      [UIView setAnimationRepeatAutoreverses:YES];

        gameView.alpha = 1.0;
        topGameView.alpha = 1.0;
        viewrect1.origin.y = selfrect.size.height - (viewrect1.size.height);
        viewrect2.origin.y = -20;

        topGameView.alpha = 1.0;
    }
    else {
    // call putBackStatusBar after animation to restore the state after this animation
        [UIView setAnimationDidStopSelector:@selector(putBackStatusBar)];
        gameView.alpha = 0.0;
        topGameView.alpha = 0.0;
    }
    [gameView setFrame:viewrect1];
    [topGameView setFrame:viewrect2];

} [UIView commitAnimations];

Як бачите, ви можете грати з альфа-кадрами, рамками та навіть розмірами зображення. Пограйте. Ви можете бути здивовані його можливостями.


52

Різниця, здається, полягає в кількості контролю, який вам потрібен над анімацією.

Цей CATransitionпідхід дає вам більше контролю і, отже, більше можливостей для встановлення, наприклад. функція синхронізації. Будучи об'єктом, ви можете зберігати його на потім, рефактор, щоб вказати на нього всі свої анімації, щоб зменшити дублюваний код тощо

Методи UIViewкласу є зручними методами для звичайної анімації, але більш обмежені, ніж CATransition. Наприклад, є лише чотири можливі типи переходу (перевернути ліворуч, перевернути праворуч, згорнувшись, згорнувшись). Якщо ви хочете зробити зникнення, вам доведеться або викопати, щоб зменшити CATransition'sперехід, або створити явну анімацію UIViewальфа вашого альфа.

Зауважте, що CATransitionна Mac OS X дозволять вам вказати довільний CoreImageфільтр, який потрібно використовувати як перехід, але, як це зараз, ви не можете цього зробити на iPhone, якого не вистачає CoreImage.


7
Зауважте, що це порада iOS 2.0. Дивіться відповідь Рафаеля Веги щодо методів на основі блоків, якщо ви перебуваєте на iOS 4.0 або вище.
Ryan McCuaig

Також зауважте, що CoreImage тепер доступний як в iOS 5, але лише деякі його функції. Я вважаю, що ви можете використовувати перехід CoreImage в анімації, але ви не можете створювати власні фільтри CoreImage на iOS (5).
Аарон Еш

26

Ми можемо анімувати зображення на ios 5 за допомогою цього простого коду.

CGRect imageFrame = imageView.frame;
imageFrame.origin.y = self.view.bounds.size.height;

[UIView animateWithDuration:0.5
    delay:1.0
    options: UIViewAnimationCurveEaseOut
    animations:^{
        imageView.frame = imageFrame;
    } 
    completion:^(BOOL finished){
        NSLog(@"Done!");
    }];

5
це також доступно в iOS 4 і називається анімацією "на основі блоку". Він не обмежується iOS 5 та новішими версіями.
johnbakers

8

У UIViewдокументах прочитайте інформацію про цю функцію для ios4 +

+ (void)transitionFromView:(UIView *)fromView toView:(UIView *)toView duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options completion:(void (^)(BOOL finished))completion

6

У будь-якому випадку спосіб "Блокувати" надається перевагу зараз. Я поясню простий блок нижче.

Розглянемо фрагменти нижче. bug2 та bug 3 - це imageViews. Наведена нижче анімація описує анімацію тривалістю 1 секунду після затримки на 1 секунду. Помилка3 переміщується від її центру до центру bug2. Після того, як анімація буде завершена, вона буде зареєстрована "Центр анімації зроблено!".

-(void)centerAnimation:(id)sender
{
NSLog(@"Center animation triggered!");
CGPoint bug2Center = bug2.center;

[UIView animateWithDuration:1
                      delay:1.0
                    options: UIViewAnimationCurveEaseOut
                 animations:^{
                     bug3.center = bug2Center;
                 } 
                 completion:^(BOOL finished){
                     NSLog(@"Center Animation Done!");
                 }];
}

Сподіваюся, що це чисто !!!


2
ви призначили bug3.center CGPoint bug3Center і відразу після цього ви присвоюєте CGPoint bug2.center тій же змінній bug3Center? Чому ти це робиш?
pnizzle

oopss !! ось друзі друку. Оновлено зараз.
Deepukjayan

2

Ось код для гладкої анімації, може бути корисним для багатьох розробників.
Я знайшов цей фрагмент коду з цього підручника.

CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[animation setAutoreverses:YES];
[animation setFromValue:[NSNumber numberWithFloat:1.3f]];
[animation setToValue:[NSNumber numberWithFloat:1.f]];
[animation setDuration:2.f];
[animation setRemovedOnCompletion:NO];

[animation setFillMode:kCAFillModeForwards];
[[self.myView layer] addAnimation:animation forKey:@"scale"];/// add here any Controller that you want t put Smooth animation.

2

давайте спробуємо перевірити для Swift 3 ...

UIView.transition(with: mysuperview, duration: 0.75, options:UIViewAnimationOptions.transitionFlipFromRight , animations: {
    myview.removeFromSuperview()
}, completion: nil)
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.