使用 CATransition 同时动画两个子视图的过渡

Posted 2023-03-15

【中文标题】使用 CATransition 同时动画两个子视图的过渡

【英文标题】：Animating transitions of two subviews simultaneously with CATransition

【发布时间】：2012-02-19 21:58:25

【问题描述】：

我有我的主视图，当用户点击“显示”按钮时，我希望发生两件事：

淡入黑色UIView，alpha 0.5 覆盖整个父级 看法。我将其称为darkenBackground 滑动第二个视图控制器的视图 (self.secondViewController.view) 在darkenBackground 之上

当用户完成后，他们点击“完成”，然后会发生以下情况：

darkenBackground 淡出并从超级视图中移除。 self.secondViewController.view 在屏幕中滑出 底部方向并从超级视图中移除。

所有动画同时工作。

到目前为止，我已经完成了第一部分（有点），即过渡。这工作正常。但是当用户点击“完成”时，过渡不会按要求工作。我面临的问题是：

darkenBackground 和 self.secondViewController.view 淡出并被移除，但 self.secondViewController.view 不应该淡出！我尝试只为第二个视图设置动画，但它没有动画就消失了。 当用户点击“显示”秒次时 (transition-in)，来自上一个转换的视图 出现在动画发生之前。看起来不像 之前已从 superview 中删除。

这是我的代码：

当用户点击“显示”时：

- (IBAction)showSecondView 

    darkenBackground = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 320, 460)];
    [darkenBackground setBackgroundColor:[UIColor blackColor]];
    [darkenBackground setAlpha:0.5];

    self.secondViewController.view.frame = CGRectMake(0, 0, 320, 460);
    self.secondViewController.view.backgroundColor = [UIColor clearColor];

    [CATransaction begin];

    CATransition *animation = [CATransition animation];
    [animation setDuration:0.5];
    [animation setType:kCATransitionFade];

    CATransition *animation2 = [CATransition animation];
    [animation2 setDuration:0.5];
    [animation2 setType:kCATransitionMoveIn];
    [animation2 setSubtype:kCATransitionFromTop];
    [animation2 setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];

    [self.view addSubview:darkenBackground];
    [self.view addSubview:self.secondViewController.view];

    [[self.view layer] addAnimation:animation forKey:@"darkenBkgFadeIn"];
    [[self.secondViewController.view layer] addAnimation:animation2 forKey:@"ShowSecondView"];

    [CATransaction commit];

当用户点击“完成”时（secondViewController.m 类中定义的函数，它通过委托引用主视图控制器变量）：

- (IBAction)hideSecondView 

    [CATransaction begin];

    CATransition *animation = [CATransition animation];
    [animation setDuration:0.5];
    [animation setType:kCATransitionFade];

    CATransition *animation2 = [CATransition animation];
    [animation2 setDuration:0.5];
    [animation2 setType:kCATransitionPush];
    [animation2 setSubtype:kCATransitionFromBottom];
    [animation2 setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];

    [self.myParentController.darkenBackground removeFromSuperview];
    [self.myParentController.secondViewController.view removeFromSuperview];

    [[self.myParentController.view layer] addAnimation:animation forKey:@"darkenBkgFadeOut"];
    [[self.myParentController.secondViewController.view layer] addAnimation:animation2 forKey:@"RemoveSecondView"];

    [CATransaction commit];

最终我想以与TWTweetComposeViewController 模态视图相同的方式显示视图，其中背景变暗并且控制器出现。我可以只使用模态视图控制器，但我遇到的问题是，当呈现视图控制器时，它只会“出现”并且不会从底部滑动（因为我需要半透明背景，所以我不能使用默认值）模态视图的上下文）。

无法弄清楚这一点，希望得到一些指导。

【参考方案1】：

我假设-hideSecondView 中使用的self.myParentController.view 与-showSecondView 中的self.view 具有相同的视图。如果是这种情况，那么您将在此处对整个视图应用过渡：

[[self.myParentController.view layer] addAnimation:animation forKey:@"darkenBkgFadeOut"];

您将self.secondViewController.view 添加为-showSecondView 中self.view 的子视图，因此当您稍后在self.myParentController.view 上执行转换时，它将将该转换应用于其所有子视图（即self.secondViewController.view）好吧。

不要将转换应用到-hideSecondView 中的self.myParentController.view，而是直接应用到darkenBackground：

[[self.myParentController.darkenBackground layer] addAnimation:animation forKey:@"darkenBkgFadeOut"];

如果我没记错的话，您可以在向视图添加/删除图层时应用CATransitions。如果没有，那么您必须将 darkenBackground 包装在一个单独的容器视图中并在其上执行转换，以便在您进行淡出时它不包括 self.secondViewController.view。