164

2つ作成するのではなく、1つのビューUIImageViewsのを単に変更するのが論理的であるように思われimageます。そうすると、インスタントスイッチではなく、2つの画像間でフェード/クロスディゾルブを行う方法はありますか?

4

9 に答える 9

591

UIKit animation新しいブロックベースのメソッドを使用すると、はるかに簡単になります。

次のコードがViewControllerにあり、クロスディゾルブするUIImageViewが、プロパティを介してアドレス指定可能なself.viewのサブビューであるとself.imageViewします。必要なのは次のとおりです。

UIImage * toImage = [UIImage imageNamed:@"myname.png"];
[UIView transitionWithView:self.imageView
        duration:5.0f
        options:UIViewAnimationOptionTransitionCrossDissolve
        animations:^{
  self.imageView.image = toImage;
} completion:nil]

終わり。

そして、Swiftでそれを行うには、次のようになります。

let toImage = UIImage(named:"myname.png")
UIView.transitionWithView(self.imageView,
                          duration:5,
                          options: UIViewAnimationOptions.TransitionCrossDissolve, animations: { self.imageView.image = toImage }, completion: nil)

スウィフト3、4、5

let toImage = UIImage(named:"myname.png")
UIView.transition(with: self.imageView,
                  duration: 0.3,
                  options: .transitionCrossDissolve,
                  animations: { self.imageView.image = toImage },
                  completion: nil)
于 2012-03-19T16:10:13.320 に答える
46

編集:以下の@algalからより良い解決策があります。

これを行う別の方法は、事前定義されたCAAnimationトランジションを使用することです。

CATransition *transition = [CATransition animation];
transition.duration = 0.25;
transition.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
transition.type = kCATransitionFade;
transition.delegate = self;
[self.view.layer addAnimation:transition forKey:nil];
view1.hidden = YES;
view2.hidden = NO;

AppleのViewTransitionsサンプルプロジェクトを参照してください:https ://developer.apple.com/library/content/samplecode/ViewTransitions/Introduction/Intro.html#//apple_ref/doc/uid/DTS40007411

于 2011-10-03T18:51:32.667 に答える
9

Swift 3.0.1の場合:

UIView.transition(with: self.imageView,
              duration:0.5,
              options: .transitionCrossDissolve,
              animations: { self.imageView.image = newImage },
              completion: nil)

参照:https ://gist.github.com/licvido/bc22343cacfa3a8ccf88

于 2017-03-10T04:03:39.367 に答える
6

はい、あなたの言うことは絶対に正しいです、そしてそれはそれをする方法です。私はこのメソッドを作成し、常にこれを使用して画像をフェードインします。私はこれに対処しCALayerます。このためにCoreAnimationをインポートする必要があります。

+ (void)fadeInLayer:(CALayer *)l
{
    CABasicAnimation *fadeInAnimate   = [CABasicAnimation animationWithKeyPath:@"opacity"];
    fadeInAnimate.duration            = 0.5;
    fadeInAnimate.repeatCount         = 1;
    fadeInAnimate.autoreverses        = NO;
    fadeInAnimate.fromValue           = [NSNumber numberWithFloat:0.0];
    fadeInAnimate.toValue             = [NSNumber numberWithFloat:1.0];
    fadeInAnimate.removedOnCompletion = YES;
    [l addAnimation:fadeInAnimate forKey:@"animateOpacity"];
    return;
}

画像をフェードアウトする場合は、逆の操作を行うことができます。フェードアウトした後。スーパービューから削除するだけです(これはUIImageView)。[imageView removeFromSuperview]

于 2011-10-03T18:12:02.220 に答える
4

次の例のように、フェードイン機能をサブクラスにパッケージ化して、共通のUIImageViewとして使用することもできます。

IMMFadeImageView *fiv=[[IMMFadeImageView alloc] initWithFrame:CGRectMake(10, 10, 50, 50)];
[self.view addSubview:fiv];
fiv.image=[UIImage imageNamed:@"initialImage.png"];
fiv.image=[UIImage imageNamed:@"fadeinImage.png"];  // fades in

可能な実装は次のとおりです。

注:関数でフェードインを実際に実装する方法setImage:は変更される可能性があり、この質問に対する他の回答で説明されている他の優れた例の1つであるUIImageView可能性があります。特定の状況では許容できないオーバーヘッドになります

IMMFadeImageView.h

#import <UIKit/UIKit.h>

@interface IMMFadeImageView : UIImageView
@property (nonatomic,assign) float fadeDuration;
@end

IMMFadeImageView.m

#import "IMMFadeImageView.h"

@implementation IMMFadeImageView
@synthesize fadeDuration;

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        self.fadeDuration=1;
    }
    return self;
}
-(void)setImage:(UIImage *)newImage{

    if(!self.image||self.fadeDuration<=0){
        super.image=newImage;
    } else {
        UIImageView *iv=[[UIImageView alloc] initWithFrame:self.bounds];
        iv.contentMode=self.contentMode;
        iv.image=super.image;
        iv.alpha=1;
        [self addSubview:iv];
        super.image=newImage;
        [UIView animateWithDuration:self.fadeDuration delay:0 options:UIViewAnimationCurveEaseInOut animations:^{
            iv.alpha=0;
        } completion:^(BOOL finished) {
            [iv removeFromSuperview];
        }];
    }
}

上記のコードは、いくつかの仮定(XCodeプロジェクトでARCが有効になっていることを含む)に依存しており、概念実証としてのみ意図されており、明確さと焦点を合わせるために、重要な無関係のコードを省略して関連性を維持しています。ただコピーして、盲目的に貼り付けないでください。

于 2012-07-14T20:44:35.267 に答える
3

移行を無期限に繰り返す必要がありました。これには試行錯誤が必要でしたが、ようやく探していた最終結果が得られました。これらは、UITableViewCellのUIImageViewに画像アニメーションを追加するためのコードスニペットです。

関連するコードは次のとおりです。

@interface SomeViewController ()
@property(nonatomic, strong) NSMutableArray *imagesArray;
@property(nonatomic, assign) NSInteger varietyImageAnimationIndex;
@property(nonatomic, assign) BOOL varietyImagesAnimated;
@end

@implementation SomeViewController
@synthesize imagesArray;
@synthesize varietyImageAnimationIndex;
@synthesize varietyImagesAnimated;
...

// NOTE: Initialize the array of images in perhaps viewDidLoad method.

-(void)animateImages
{
    varietyImageAnimationIndex++;

    [UIView transitionWithView:varietyImageView
                      duration:2.0f
                       options:UIViewAnimationOptionTransitionCrossDissolve
                    animations:^{
                        varietyImageView.image = [imagesArray objectAtIndex:varietyImageAnimationIndex % [imagesArray count]];
                    } completion:^(BOOL finished) {
                        [self animateImages];
                    }];
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
   ...
        [cell.imageView setImage:[imagesArray objectAtIndex:0]];


        [self setVarietyImageView:cell.imageView];

        if (! varietyImagesAnimated)
        {
            varietyImagesAnimated = YES;
            [self animateImages];
        }

    ...
    return cell;
}
于 2013-03-10T20:44:46.313 に答える
2

オプションで遊んでUIView.transition()問題が発生した後.transitionCrossDissolve(1つのUIImageView内で変化する画像をアニメーション化しようとしましたが、アニメーションなしで遷移が即座に発生しました)ビュー内で変化するプロパティをアニメーション化できるオプションをもう1つ追加する必要があることがわかりました(Swift 4.2):

UIView.transition(with: self.imageView,
                   duration: 1,
                   options: [.allowAnimatedContent, .transitionCrossDissolve],
                   animations: { self.imageView.image = newImage },
                   completion: nil)

さらに、imageViewにサブビューがある場合、それも再描画され、アニメーションが妨げられる可能性があります。たとえば、imageViewにぼかしのあるサブビューがあり、その場合、アニメーションは機能しません。そのため、ビュー階層を変更し、ぼかしを独自のビューに移動して、imageViewの上に配置しました。

于 2019-01-24T22:22:54.673 に答える
0

これが最短の方法だと思います。UIViewアニメーションを作成し、それをimageViewにコミットします。

[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.5];
[myImageView setAlpha:0.0];
[UIView commitAnimations];
于 2014-09-14T20:04:50.280 に答える
0

プロパティを使用することで、highlightedImageこれをもう少し簡単にすることができます。Swift 3の例を次に示します。最初に、通常の画像と強調表示された画像の両方を設定します。

let imageView = UIImageView(image: UIImage(named: "image"), highlightedImage: UIImage(named: "highlightedImage"))

そして、それらのアニメーションを変更したい場合:

UIView.transition(with: imageView, duration: 0.3, options: .transitionCrossDissolve, animations: { self.imageView.isHighlighted = !self.imageView.isHighlighted}, completion: .none)
于 2016-10-28T10:03:16.660 に答える