Анимация с ключевыми кадрами кажется нечеткой при перемещении фреймов?

Question

Я использую JazzHands для создания анимации с ключевыми кадрами в UIScrollView. Адрес example. Посмотрите на вид сверху. Когда вы переходите со страницы на страницу. Пока анимация работает, вид вверху слегка перемещается слева направо. Анимация выглядит немного нечеткой.

Вот код, взятый из example here:

IFTTTFrameAnimation *titleView1FrameAnimation = [IFTTTFrameAnimation new]; 
    titleView1FrameAnimation.view = self.titleView1; 
    [self.animator addAnimation:titleView1FrameAnimation]; 

    [titleView1FrameAnimation addKeyFrame:[[IFTTTAnimationKeyFrame alloc] initWithTime:timeForPage(1) 
                        andFrame:self.titleView1.frame]]; 
    [titleView1FrameAnimation addKeyFrame:[[IFTTTAnimationKeyFrame alloc] initWithTime:timeForPage(2) 
                      andFrame:CGRectOffset(self.titleView1.frame, timeForPage(2), 0)]]; 
    [titleView1FrameAnimation addKeyFrame:[[IFTTTAnimationKeyFrame alloc] initWithTime:timeForPage(3) 
                      andFrame:CGRectOffset(self.titleView1.frame, timeForPage(3), 0)]]; 
    [titleView1FrameAnimation addKeyFrame:[[IFTTTAnimationKeyFrame alloc] initWithTime:timeForPage(4) 
                      andFrame:CGRectOffset(self.titleView1.frame, timeForPage(4), 0)]]; 

При запуске demo взглянуть на части, отмеченные красным цветом на следующем скриншоте:

Редактировать: Вот код, содержащий эту проблему: https://github.com/steffimueller/Intro-Guide-View-for-Talk.ai

Как сделать анимацию гладкой и менее нечеткой?

Answer 1

Это связано с частотой кадров в JazzHands IFTTTAnimatedScrollViewController быть установлен для не сетчатки дисплеев. Вам нужно удвоить число в timeForPage, а также использовать удвоенное число contentOffset в animate, но используйте исходные значения не удвоенного значения timeForPage в тех местах, где вы использовали это для размещения позиций точек зрения вместо того, чтобы использовать его для время анимации.

Вот суть изменений, которые вы должны внести в свой пример, чтобы заставить его работать. Fixed Demo Gist

Вам нужен этот метод установки анимации раз:

#define timeForPage(page) (NSInteger)(self.view.frame.size.width * (page - 1) * 2.0) 

И это одно для установки центров ваших взглядов на основе размеров страницы:

#define centerForPage(page) (NSInteger)(self.view.frame.size.width * (page - 1)) 

Затем вам нужно переопределить метод scrollViewDidScroll: в IFTTTAnimatedScrollViewController, чтобы использовать удвоенные числа, используемые в настоящее время.

- (void)scrollViewDidScroll:(UIScrollView *)scrollView { 
    [self.animator animate:(NSInteger)(scrollView.contentOffset.x * 2)]; 
} 

Мы будем работать над обновлением демо JazzHands!

Answer 2

Перед тем, как начать анимацию вызова:

view.layer.shouldRasterize = YES; (seems that you are using objective-c so I put YES here, for swift should be true) 

Как только анимация завершится вызов,

view.layer.shouldRasterize = NO; (seems that you are using objective-c so I put NO here, for swift should be false) 

Вы должны всегда использовать его, когда вы анимировать вид

Вы можете подробнее об этом в WWDC 2012 Polishing Your Interface Rotations видео (платная подписка разработчиков необходима)

Я надеюсь, что это поможет!

[EDIT]

Каждый раз при вызове метода одушевленные установить shouldRasterize в YES перед ним, как в примере ниже:

titleView1FrameAnimation.view.layer.shouldRasterize = YES; 
[self. titleView1FrameAnimation animate:scrollView.contentOffset.x]; 

Answer 3

Я перепутались вокруг немного с кодом и кажется, что сохранение этих верхних представлений на месте, в то время как прокрутка прокрутки заставила его перемещаться влево и вправо.

То, что я сделал, это вывести вид названия из вида прокрутки и добавить его в представление контроллера вида.

Вы можете увидеть его в действии here

Позже редактирования:

Чтобы увидеть, что я изменился, вы можете проверить файл различий в Git.В основном я переехал ваши titleView с (titleView1, titleView2 и т.д.) от Scrollview для зрения контроллера представления (так в основном я заменил все линии, которые были так:

[self.scrollView addSubView:self.titleView1] 

к чему-то вроде этого:

[self.view addSubView:self.titleView1] 

После этого я также вынул анимацию ключевого кадра, которая сохраняла ваши названия, поскольку они больше не двигались с прокруткой. Практически я удалил все строки, которые добавляли анимацию кадра к вашему titleviews от каждого configurePage X Анимация.

второй вопрос ответ:

Скажите ваш взгляд скриншот называется screenshotView. Вы можете пойти дальше и создать так:

UIImageView *screenshotView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"ScreenshotImage"]]; 
[self.view addSubview:screenshotView]; 
self.screenshotView = screenshotView; 
[self.screenshotView setCenter:CGPointMake(self.view.center.x + self.view.bounds.size.width, <#yourDesiredY#>)]; 

И анимировать его, как это:

//screenshotView frame animation 
IFTTTFrameAnimation *screenshotViewFrameAnimation = [IFTTTFrameAnimation new]; 
screenshotViewFrameAnimation.view = self.screenshotView; 
[self.animator screenshotViewFrameAnimation]; 

[screenshotViewFrameAnimation addKeyFrame:[[IFTTTAnimationKeyFrame alloc] initWithTime:timeForPage(1) andFrame:self.screenshotView.frame]]; 
[screenshotViewFrameAnimation addKeyFrame:[[IFTTTAnimationKeyFrame alloc] initWithTime:timeForPage(2) andFrame:CGRectOffset(self.screenshotView.frame, -self.scrollView.bounds.size.width, 0.0)]]; 
[screenshotViewFrameAnimation addKeyFrame:[[IFTTTAnimationKeyFrame alloc] initWithTime:timeForPage(3) andFrame:CGRectOffset(self.screenshotView.frame, -self.scrollView.bounds.size.width, 0.0)]]; 
[screenshotViewFrameAnimation addKeyFrame:[[IFTTTAnimationKeyFrame alloc] initWithTime:timeForPage(4) andFrame:CGRectOffset(self.screenshotView.frame, -self.scrollView.bounds.size.width * 2, 0.0)]];