Question

我使用JazzHands在UIScrollView中创建基于关键帧的动画。这是一个example。看看顶部的视图。当您从一个页面移动到另一个页面。动画运行时，顶部的视图从左向右略微移动。动画看起来有点模糊。

的代码

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时，请查看以下屏幕截图中标有红色的部分：

enter image description here

编辑：以下是包含此问题的代码：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视频中看到有关它的更多详细信息（需要付费开发者订阅）

我希望能帮到你！

<强> [编辑]

每当你调用方法animate set shouldRasterize to YES之前，就像下面的例子中一样：

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

Answer 3

我对代码进行了一些讨论，似乎在滚动视图滚动时将这些顶视图保持在原位使得它左右摇晃。

我所做的是从滚动视图中取出标题视图，并将其添加到视图控制器视图中。

您可以在行动here

中看到它

稍后编辑：

要实际查看我已更改的内容，您可以检查Git中的文件差异。基本上我将您的titleView s（titleView1，titleView2等）从scrollView移动到视图控制器的视图（所以基本上我已经替换了所有这样的行：

[self.scrollView addSubView:self.titleView1]

这样的事情：

[self.view addSubView:self.titleView1]

之后我还拿出了关键帧动画，这些动画让你的标题视图保持不变，因为他们不再使用scrollview了。实际上我已经从每个 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)]];

移动帧时，关键帧动画会显得模糊吗？

3 个答案: