淡入淡出动画答案

【问题标题】：Fade In Fade Out Animation淡入淡出动画
【发布时间】：2014-01-20 09:53:59
【问题描述】：

这是一些我纠结了一段时间的代码。

如果您启动淡入动画，标签文本会淡入。如果我开始淡出动画，标签文本就会淡出。

当我启动startFade 方法时，只显示淡出。在启动fadeOut 方法之前，如何等待fadeIn 方法视觉完成。

-(IBAction)startFade:(id)sender{
    [self fadeIn];
    [self fadeOut];
}

-(IBAction)fadeIn:(id)sender{
    [self fadeIn];
}

-(IBAction)fadeOut:(id)sender{
[self fadeOut];
}

-(void) fadeIn{
    [_label setAlpha:0];
    [UILabel beginAnimations:NULL context:nil];
    [UILabel setAnimationDuration:2.0];
    [_label setAlpha:1];
    [UILabel commitAnimations];
}

-(void) fadeOut{
    [UILabel beginAnimations:NULL context:nil];
    [UILabel setAnimationDuration:2.0];
    [_label setAlpha:0];
    [UILabel commitAnimations];
}

【问题讨论】：

你尝试过基于块的动画吗？

标签： ios cocoa-touch core-animation

【解决方案1】：

当您像现在这样背靠背调用fadeIn 和fadeOut 方法时，代码会立即运行，因此您只会看到最后一个调用方法的动画。基于 UIView 块的动画提供了一个完成处理程序，这似乎正是您正在寻找的。所以你的代码可能看起来像这样：

-(IBAction)startFade:(id)sender {

    [_label setAlpha:0.0f];        

    //fade in
    [UIView animateWithDuration:2.0f animations:^{

        [_label setAlpha:1.0f];

    } completion:^(BOOL finished) {

        //fade out
        [UIView animateWithDuration:2.0f animations:^{

            [_label setAlpha:0.0f];

        } completion:nil];

    }];
}

斯威夫特：

@IBAction func startFade(_ sender: AnyObject) {

    label.alpha = 0.0

    // fade in
    UIView.animate(withDuration: 2.0, animations: { 
        label.alpha = 1.0
    }) { (finished) in
        // fade out
        UIView.animate(withDuration: 2.0, animations: {
            label.alpha = 0.0
        })
    }
}

【讨论】：

...淡入淡出效果的后半部分在哪里？
我总是忘记这样做。感谢收看。

【解决方案2】：

为您完成这项工作（_label 是您的标签）；

- (IBAction)startFade:(id)sender {
    [_label setAlpha:0.f];

    [UIView animateWithDuration:2.f delay:0.f options:UIViewAnimationOptionCurveEaseIn animations:^{
        [_label setAlpha:1.f];
    } completion:^(BOOL finished) {
        [UIView animateWithDuration:2.f delay:0.f options:UIViewAnimationOptionCurveEaseInOut animations:^{
            [_label setAlpha:0.f];
        } completion:nil];
    }];
}

【讨论】：

可以通过在第一个动画的选项中加入 UIViewAnimationOptionAutoReverse 来简化，即 UIViewAnimationOptionCurveEaseIn | UIViewAnimationOptionAutoReverse，只有完成：nil 而不是另一个动画。
@BjørnEgil，如果没有这样的目标，即在中途更改UILabel 的任何属性，那也可以。
是的，但这不是问题的一部分。只是如何淡入淡出。
@BjørnEgil，对于可能尝试重复使用该想法的其他用户或开发人员，答案会尽可能地通用。

【解决方案3】：

试试这个..

// 淡出

 -(void)fadeOut:(UIView*)viewToDissolve withDuration:(NSTimeInterval)duration   andWait:(NSTimeInterval)wait
{
[UIView beginAnimations: @"Fade Out" context:nil];

// wait for time before begin
[UIView setAnimationDelay:wait];

// druation of animation
[UIView setAnimationDuration:duration];
viewToDissolve.alpha = 0.0;
[UIView commitAnimations];
}

// 淡入

-(void) fadeIn:(UIView*)viewToFadeIn withDuration:(NSTimeInterval)duration andWait:(NSTimeInterval)wait

{
[UIView beginAnimations: @"Fade In" context:nil];

// wait for time before begin
[UIView setAnimationDelay:wait];

    // druation of animation
[UIView setAnimationDuration:duration];
viewToFadeIn.alpha = 1;
[UIView commitAnimations];

}

// 淡入淡出

-(void) fadeInFromFadeOut: (UIView*)viewToFadeIn withDuration:(NSTimeInterval)duration
{
    viewToFadeIn.hidden=NO;
    [self fadeOut:viewToFadeIn withDuration:1 andWait:0];
    [self fadeIn:viewToFadeIn withDuration:duration andWait:0];

}

//按钮操作

-(void) buttonClicked :(id)sender
{
   NSLog(@"Button clicked");

// Each button is given a tag
int tag = ((UIButton*)sender).tag;
if (tag ==1)
{
    sprite.alpha  =1;
    [self fadeOut : sprite withDuration: 10 andWait : 1 ];
}
else if (tag ==2)
{
    sprite.alpha  =0;
    [self fadeIn : sprite withDuration: 3 andWait : 1 ];
}
else
{
    [self fadeInFromFadeOut:sprite withDuration:10];
}
}

查看此link 以下载示例..

请参阅此link。

很高兴与您分享..:-)

【讨论】：

很酷的东西；每个人！检查了很多你的想法和方法。帮了我很多！

【解决方案4】：

通用答案：您可以使用此方法将动画应用于任何 UIView 对象。首先创建 UIView 类的扩展。创建一个单独的swift文件并像这样编写代码

import Foundation
import UIKit

extension UIView {

    func fadeIn() {
        //Swift 2
        UIView.animateWithDuration(1.0, delay: 0.0, options: UIViewAnimationOptions.CurveEaseIn, animations: {
            self.alpha = 1.0
        }, completion: nil)

        //Swift 3, 4, 5
        UIView.animate(withDuration: 1.0, delay: 0.0, options: UIView.AnimationOptions.curveEaseIn, animations: {
            self.alpha = 1.0
        }, completion: nil)
    }


    func fadeOut() {
        //Swift 2
        UIView.animateWithDuration(1.0, delay: 0.0, options: UIViewAnimationOptions.CurveEaseOut, animations: {
            self.alpha = 0.0
        }, completion: nil)

        //Swift 3, 4, 5
        UIView.animate(withDuration: 1.0, delay: 0.0, options: UIView.AnimationOptions.curveEaseOut, animations: {
            self.alpha = 0.0
        }, completion: nil)
    }


}

这里的 self 指的是你所指的任何 UIView 。您可以使用按钮、标签等来调用这两种方法。

然后在任何其他 swift 类中，您可以像这样调用fadeIn() 和fadeOut()：

self.yourUIObject.fadeIn()
self.yourUIObject.fadeOut()

这为任何 UIObject 提供所需的动画效果。

【讨论】：

【解决方案5】：

您可以这样做（在此处检查可能的参数值和类似方法： https://developer.apple.com/library/ios/documentation/uikit/reference/uiview_class/uiview/uiview.html

[UIView animateWithDuration:duration
                      delay:delay
                    options:option 
                 animations:^{
                     //fade in here (changing alpha of UILabel component)
                 } 
                 completion:^(BOOL finished){
                    if(finished){
                      //start a fade out here when previous animation is finished (changing alpha of UILabel component)
                 }];
}

【讨论】：

【解决方案6】：

基于@holex 的回答，但稍微简化了一点（如评论）：

- (IBAction)startFade:(id)sender {
   [_label setAlpha:0.f];

   [UIView animateWithDuration:2.f 
                         delay:0.f 
                       options:UIViewAnimationOptionCurveEaseIn
                             | UIViewAnimationOptionAutoreverse 
                    animations:^{
                                  [_label setAlpha:1.f];
                                } 
                    completion:nil];
}

【讨论】：

【解决方案7】：

斯威夫特 4 如果单击按钮时只需要一个脉冲，请使用：

@IBAction func didPressButton(_ sender: UIButton) {
        self.someView.alpha = 0
        UIView.animate(withDuration: 0.4,
                       delay: 0,
                       options: [.curveEaseInOut, .autoreverse],
                       animations: {
                        self.someView.alpha = 1
        },
                       completion: { _ in
                        self.someView.alpha = 0
        })
    }

【讨论】：

【解决方案8】：

最简单的方法是使用：

[UIView animateWithDuration:(NSTimeInterval)duration animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion]

并将fadeOut 调用添加到completion 块。 The documentation 可能有助于回答您的任何问题。

如果由于某种原因您不能使用块版本，那么您必须设置一个委托 ([UIView setAnimationDelegate:(id)delegate]) 和一个选择器 ([UIView setAnimationDidStopSelector:])，该委托将响应该委托。

再次，请参阅the documentation 了解更多详情。

【讨论】：

【解决方案9】：

我的任务是让标签淡出。然后淡入更改的文本。解决方案是：

    -(void)performAnimationOnHistoryButtonLabelUpdatingTextTo:(NSString *)text
{
    [UIView animateWithDuration:0.4f animations:^{
        [self.historyButtonLabel setAlpha:0.0f];

    } completion:^(BOOL finished) {
        self.historyButtonLabel.text = text;

        [UIView animateWithDuration:0.4f animations:^{
            [self.historyButtonLabel setAlpha:1.0f];
        } completion:nil];

    }];
}

【讨论】：

【解决方案10】：

labelAnimate = (UILabel*) [self.view viewWithTag:101];
btnTapMe = (UIButton*) [self.view viewWithTag:100];
[btnTapMe addTarget:self action:@selector(startAnimating:) forControlEvents:UIControlEventTouchUpInside];

//////////////

-(void) startAnimating:(UIButton*)button {
    [labelAnimate setAlpha:0.0];
    [NSTimer scheduledTimerWithTimeInterval:1.8 target:self selector:@selector(continuousEaseInOut) userInfo:button repeats:YES];
}

-(void) continuousFadeInOut {
    [UIView animateWithDuration:2.0 delay:0.0 options:UIViewAnimationOptionCurveEaseIn animations:^{
        [labelAnimate setAlpha:1.0];
    } completion:^(BOOL finished) {
        [UIView animateWithDuration:2.0 delay:0.0 options:UIViewAnimationOptionCurveEaseInOut animations:^{
            [labelAnimate setAlpha:0.0];
        } completion:nil];
    }];
}

【讨论】：

【解决方案11】：

我强烈建议您使用通用实现，这样您就可以在再次需要淡入淡出效果时重用代码。

您应该创建一个UIView 扩展：

UIView+Animations.h

#import <Foundation/Foundation.h>

@interface UIView (Animations)

- (void)fadeInWithCompletion:(void (^ __nullable)(BOOL finished))completion;
- (void)fadeOutWithCompletion:(void (^ __nullable)(BOOL finished))completion;;

@end

UIView+Animations.m

#import "UIView+Animations.h"

@implementation UIView (Animations)

- (void)fadeInWithCompletion:(void (^ __nullable)(BOOL finished))completion {
    [UIView animateWithDuration:2 animations:^{
        [self setAlpha:1];
    } completion:completion];
}

- (void)fadeOutWithCompletion:(void (^ __nullable)(BOOL finished))completion {
    [UIView animateWithDuration:2 animations:^{
        [self setAlpha:0];
    } completion:completion];
}

@end

因此，您只需将新文件导入您的班级或Prefix.pch 中并像这样使用它：

[_label fadeOutWithCompletion:^(BOOL finished) {
   [_label fadeInWithCompletion:nil];
}];

请注意，当您在完成后无事可做时，也可以使用nil 作为完成参数。

我还建议您不要参数化持续时间以在整个应用程序中保持模式。

这个实现以后可以用于UIButton、UILabel、UITextField...嗯，任何派生自UIView的类。

【讨论】：

【解决方案12】：

可以使用UIView.animate(withDuration: animations:)组合淡入淡出动画

UIView.animate(withDuration: animationDuration, animations: {
            myView.alpha = 0.75
            myView.alpha = 1.0
        })

【讨论】：

【解决方案13】：

Swift 5 版本的 iPhone 开发者的回答：

extension UIView {
    
    func fadeIn() {
        UIView.animate(withDuration: 1.0, delay: 0.0, options: UIView.AnimationOptions.curveEaseIn, animations: {
            self.alpha = 1.0
        }, completion: nil)
    }
    
    func fadeOut() {
        UIView.animate(withDuration: 1.0, delay: 0.0, options: UIView.AnimationOptions.curveEaseOut, animations: {
            self.alpha = 0.0
        }, completion: nil)
    }
}

【讨论】：