ios - realiza - que es un fotograma en animacion

La animación de fotograma clave aparece borrosa al mover fotogramas?

Question

Uso JazzHands para crear una animación basada en cuadros clave en UIScrollView. Aquí hay un ejemplo . Mira la vista en la parte superior. Cuando te mueves de una página a otra. Mientras se ejecuta la animación, la vista en la parte superior se mueve ligeramente de izquierda a derecha. La animación parece un poco borrosa.

Aquí está el código tomado del ejemplo aquí :

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)]];

Al ejecutar la demostración, eche un vistazo a la parte marcada con rojo en la siguiente captura de pantalla:

Editar: Aquí está el código que contiene este problema: https://github.com/steffimueller/Intro-Guide-View-for-Talk.ai

¿Cómo puedo hacer que la animación funcione sin problemas y menos difusa?

Answer 1

Antes de comenzar su llamada de animación:

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

Tan pronto como finalice la animación, llame

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

Siempre debe usarlo cuando anima una vista

Puede ver más detalles al respecto en WWDC 2012 Video de Rotación de la interfaz de pulido (se necesita suscripción de desarrollador paga)

¡Espero que eso te ayude!

[EDITAR]

Cada vez que llamas al método animado, setRasterize debe ser SÍ anterior, como en el siguiente ejemplo:

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

Answer 2

Esto se debe a que la velocidad de fotogramas en el JazzHands IFTTTAnimatedScrollViewController está configurada para pantallas que no son retina. Necesita duplicar el número en timeForPage , y también usar el doble del número de contentOffset en animate , pero use los valores originales no duplicados de timeForPage en los lugares donde lo estaba usando para diseñar las posiciones de las vistas en lugar de usarlo para el tiempo de la animación.

Aquí hay un resumen de los cambios que tendrías que hacer a su ejemplo para que funcione. Fixed Demo Gist

Necesita este método para configurar los tiempos de animación:

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

Y esta para configurar los centros de sus visitas en función de las dimensiones de la página:

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

Luego debe sobrescribir el método scrollViewDidScroll: en IFTTTAnimatedScrollViewController para usar el doble de los números que usa actualmente.

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

¡Trabajaremos para actualizar la demo de JazzHands!

Answer 3

Me he equivocado un poco con el código y parece que manteniendo esas vistas superiores en su lugar mientras la vista de desplazamiento se desplaza hacía que se moviera hacia la izquierda y hacia la derecha.

Lo que hice fue eliminar la vista de título de la vista de desplazamiento y agregarla a la vista del controlador de vista.

Puedes verlo en acción aquí

Edición posterior:

Para ver realmente lo que he cambiado, puedes verificar las diferencias de archivos en Git. Básicamente moví tus titleView ( titleView1 , titleView2 , etc.) de scrollView a la vista del controlador de vista (así que, básicamente, he reemplazado todas las líneas que fueron así:

[self.scrollView addSubView:self.titleView1]

a algo como esto:

[self.view addSubView:self.titleView1]

Después de eso, también eliminé las animaciones de fotogramas clave que mantenían las vistas de título en su lugar, ya que ya no se movían con la vista de desplazamiento. Prácticamente, he borrado todas las líneas que estaban agregando una animación de cuadro a sus descripciones de título desde cada animación de configurePage X.

2da respuesta a la pregunta:

Supongamos que su vista de captura de pantalla se llama screenshotView . Puedes seguir y crearlo así:

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#>)];

Y anímalo así:

//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)]];