UIPageController 中共享视图的 UIView 动画

UIView animation for a shared view in a UIPageController

与其他应用程序非常相似,我的应用程序有一个 "welcome" 页面控制器,可以快速概览功能。在此概述中,我绘制了一个 UITabBar 并在下面显示了相关功能的圆圈:

我使用每次绘制页面时执行的以下代码绘制圆:

double circleSize = 75;
[circleView removeFromSuperview];
circleView = [[UIView alloc] initWithFrame:CGRectMake(circleX,
                                                      circleY,
                                                      circleSize,
                                                      circleSize)];
circleView.layer.cornerRadius = (circleSize / 2);
circleView.layer.borderColor = [UIColor VancityTransitBlue].CGColor;
circleView.layer.borderWidth = 2;

我希望 "breath" 能看到这个圆圈(慢慢变大然后缩小到原来的大小)。我使用 my answer to this question:

中的确切代码
[UIView animateWithDuration:1
                      delay:0
                    options:UIViewKeyframeAnimationOptionAutoreverse | UIViewKeyframeAnimationOptionRepeat
                 animations:^{
                     circleView.transform = CGAffineTransformMakeScale(1.5, 1.5);
                 }
                 completion:nil];

这个圆在页面控制器的三个页面之间共享,并且绘制得很好。动画在第一页上运行良好,在第二页上周期性运行,在第三页上从不运行。

如何让动画在每个圈子视图的每个页面上播放?

为什么每次画一个页面都要分配一个圆圈?

您可以删除这些行(第一次初始化只需要这些行):

if (circleView == nil) {
    circleView = [[UIView alloc] initWithFrame:CGRectMake(circleX,
                                                          circleY,
                                                          circleSize,
                                                          circleSize)];
    circleView.layer.cornerRadius = (circleSize / 2);
    circleView.layer.borderColor = [UIColor VancityTransitBlue].CGColor;
    circleView.layer.borderWidth = 2;
}

添加到另一个页面:从当前页面删除

    [circleView removeFromSuperview];
    [circleView.layer removeAllAnimations];

然后将其添加到另一个页面:

[self.view addSubView:circleView];
[UIView animateWithDuration:1
                      delay:0
                    options:UIViewKeyframeAnimationOptionAutoreverse | UIViewKeyframeAnimationOptionRepeat
                 animations:^{
                     circleView.transform = CGAffineTransformMakeScale(1.5, 1.5);
                 }
                 completion:nil];

这是一个适用于所有选项卡的解决方案。动画可以在播放过程中四处移动。您可能希望使用更好的机制来管理动画,以便可以有效地取消它。下面的代码在 Tab Controller 中实现。确保 -showOverTabBarItem:-hideCircleView 在主线程上执行。它已经构建链接运行测试.

显示

-(void)showOverTabBarItem:(CGFloat)x {
    [self hideCircleView];

    self.circleView.frame =({
        CGRect frame = self.circleView.frame;
        frame.origin.x = x;
        frame;
    });
    [self.view addSubview:self.circleView];

    [UIView animateWithDuration:1
                          delay:0
                        options:UIViewKeyframeAnimationOptionAutoreverse | UIViewKeyframeAnimationOptionRepeat
                     animations:^{
                         self.circleView.transform = CGAffineTransformMakeScale(1.5, 1.5);
                     }
                     completion:nil];
}

隐藏

-(void)hideCircleView { [self.circleView removeFromSuperview]; }

初始化

viewDidLoad.

double circleSize = 75;
CGFloat circleY = self.view.bounds.size.height-(circleSize/2);

self.circleView = [[UIView alloc] initWithFrame:CGRectMake(0,
                                                           circleY,
                                                           circleSize,
                                                           circleSize)];
self.circleView.layer.cornerRadius = (circleSize / 2);
self.circleView.layer.borderColor = [UIColor blueColor].CGColor;
self.circleView.layer.borderWidth = 2;

调用

将水平位置传递给您的动画:[self showOverTabBarItem: self.view.bounds.size.width/2];

保持视野

这是关键步骤:当您 -removeFromSuperView 时,您要确保该对象不会被回收。

@interface TabController ()
@property (nonatomic, retain) UIView * circleView;
@end