添加子视图动画

Question

我有一个主UIView，用于显示不同的数据。然后我放置了一个按钮，点击按钮会显示子视图，如下所示：

- (IBAction) buttonClicked:(id)sender
{
    UIView *newView = [[UIView alloc] initWithFrame:CGRectMake(25,25,50,20)];
    UILabel *newLabel = [[UILabel alloc] initWithFrame:CGRectMake(25,25,50,25)];
    newLabel.text = @"some text";
    [newView addSubview:newLabel];

    [self.view addSubview:newView];
    [newLabel release];
    [newView release];
}

newView 看起来不错，但它没有任何动画效果，它只是立即出现。当 newView 出现时，我该如何添加某种动画呢？比如缩放或向下滑动之类的效果。是否有一些简单的代码可以实现呢？

- Mike

Answer 1

[UIView transitionWithView:containerView duration:0.5
        options:UIViewAnimationOptionTransitionCurlUp //change to whatever animation you like
        animations:^ { [containerView addSubview:subview]; }
        completion:nil];

- adedoy

---

嘿@adedoy，如何在没有翻转的情况下使用正确的动画？？ 就像pushviewcontroller............ - Bhavesh Nayi

Answer 2

你可以使用UIView Animations：

[newView setFrame:CGRectMake( 0.0f, 480.0f, 320.0f, 480.0f)]; //notice this is OFF screen!
[UIView beginAnimations:@"animateTableView" context:nil];
[UIView setAnimationDuration:0.4];
[newView setFrame:CGRectMake( 0.0f, 0.0f, 320.0f, 480.0f)]; //notice this is ON screen!
[UIView commitAnimations];

SDK现在将为您解决此问题并将视图动画化到给定的位置。这适用于大多数UIView属性：alpha，scale，bounds，frames等等。

还有内置的翻转和卷曲动画：

[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.0];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight
                           forView:newView
                            cache:YES];

[self.navigationController.view addSubview:settingsView.view];
[UIView commitAnimations];

希望这能帮助您开头:)

- RickiG

---

虽然第一个示例在技术上是有效的，但考虑到您今天需要支持的大量屏幕尺寸，这种形式并不好。因此，我建议使用第二种形式或@adedoy的答案。 - Allison

Answer 3

让我们用Swift来完成这个。

var redView = UIView(frame:CGRectMake(20,20,100,100))
redView.backgroundColor = UIColor.redColor
redView.alpha = 0.0
view.addSubview(redView)

UIView.animateWithDuration(0.25) { () -> Void in
    redView.alpha = 1.0
}

通过将子视图放入 animateWithDuration 块中不能简单地添加动画。并且无法使用隐藏进行动画化。

- Rob Norback

---

但是如果我们这样做，当我们想将其与约束更新动画相结合并在动画块内调用layoutIfNeeded时，我们会注意到一个调整大小的动画。 - Amber K

Answer 4

链接到QuarzCore框架

#import <QuartzCore/QuartzCore.h>

CATransition *transition = [CATransition animation];
transition.duration = 1.0;
transition.type = kCATransitionPush; //choose your animation
[newView.layer addAnimation:transition forKey:nil];
[self.view addSubview:newView]; 

- Chakalaka

---

+1 您还可以使用转换子类型来进一步自定义转换。https://developer.apple.com/library/ios/documentation/GraphicsImaging/Reference/CATransition_class/#//apple_ref/doc/constant_group/Common_Transition_Subtypes - anoop4real

Answer 5

我发现即使使用动画块和选项，尝试单独为addSubview添加动画也不会有任何效果。我找到了一个解决方法，那就是将子视图的alpha设置为0.0，添加子视图，然后将alpha从0.0动画设置为1.0。这为我提供了我想要的淡入效果。

希望这能帮助其他人。

UIView *redView = [[UIView alloc] initWithFrame:CGRectMake(20, 20, 100, 100)];
redView.backgroundColor = [UIColor redColor];
redView.alpha = 0.0;

[self.view addSubview:redView];

[UIView animateWithDuration:0.5 animations:^{
  redView.alpha = 1.0;
}];

- Kyle Clegg

---

完美运行。然而，使用Xcode 10时，无法直接设置alpha分量。你需要使用设置了alpha的新UIColor对象，例如[[UIColor redColor] colorWithAlphaComponent:0.0]。 - Andreas Kraft

谢谢@AndreasKraft。我设置了一个带有alpha的颜色，不知道为什么myView.alpha = 1没有生效，你的评论帮助我解决了问题。 - Mahdi Moqadasi

Answer 6

Swift 5

UIView.transition(with: renderView, duration: 0.25, options: .transitionCrossDissolve, animations: {
        self.renderView.addSubview(emojiView)
        self.renderView.bringSubviewToFront(emojiView)
    }, completion: nil)

在代码示例中，renderView 是您将添加子视图的视图。

- Vitalik Kizlov