ইউআইআইমেজভিউয়ের চিত্র পরিবর্তন করার সময় বিবর্ণ / দ্রবীভূত হবে


160

দুটি তৈরি করার পরিবর্তে UIImageViews, কেবলমাত্র imageএকটি দৃশ্যের পরিবর্তনটি যুক্তিসঙ্গত বলে মনে হয় । যদি আমি এটি করি তবে তাত্ক্ষণিক স্যুইচের পরিবর্তে দুটি চিত্রের মধ্যে কোনও বিবর্ণ / ক্রস দ্রবীভূত হওয়ার কোনও উপায় আছে কি?


1
@ কুমার-কেএল আপনার সম্পাদনা একটি গুরুত্বপূর্ণ ট্যাগ সরিয়েছে। দয়া করে এটি করবেন না।
এরিক আয়া

1
@KumarKL কিন্তু এখানে "Objective-C" হয় না একটি কম অগ্রাধিকার ট্যাগ! এটা শুধু "সত্বর" যোগ করার জন্য সরাবেন না, এই কোন জ্ঞান করে তোলে, এটি একটি প্রকৃত সীমান্তরেখা ভাংচুর হচ্ছে ...
এরিক Aya

1
@ এরিকডি, ঠিক আছে আমি এর পুনরাবৃত্তি করব না। আপনার উদ্বেগ - এর জন্য ধন্যবাদ.
কুমার কেএল

উত্তর:


45

সম্পাদনা করুন: নীচে @ অ্যালগাল থেকে আরও ভাল সমাধান রয়েছে ।

এটি করার আরেকটি উপায় হ'ল পূর্বনির্ধারিত সিএএনিমেশন ট্রানজিশনগুলি ব্যবহার করে:

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;

অ্যাপল থেকে রূপান্তর উদাহরণ দেখুন প্রকল্পটি দেখুন: https://developer.apple.com/library/content/samplecode/ViewTransitions/Intrication/Intro.html#//apple_ref/doc/uid/DTS40007411


1
পারফেক্ট! আমি এই কোডটির কিছু অংশ এসডিওবিআইজিজের ইউআইআইমেজভিউ (ওয়েবক্যাচ) বিভাগে যুক্ত করি।
অটোবটস

@ ওটম্যান আপনি নীচে ব্যবহারকারীর দ্বারা নীচে নতুন পদ্ধতিটি ব্যবহার করা ভাল 5 be78৮৮।
মিরকুলেস

আমি এসডিওয়েবআইজেজেস কলব্যাকের পরেও সেভাবে আমার চিত্রটি সেট করছি, তবে আমার সংগ্রহেভিউসেলটিতে কোনও কারণে প্রথম ঘরের চিত্রটি, আমার সমস্ত ঘর আপডেট হলে প্রাথমিকভাবে দৃশ্যমান সেল থেকে এক এটি প্রথম। আমি অনুমান করি যে এটি কোনও প্রকারের উপস্থাপনাটি ক্যাচ করছে লাইয়ার বা কিছু?!? কোন ধারনা এটি কি হতে পারে?
গেয়র্গ

সম্পাদনার পক্ষে যান "নীচে @ অ্যালগাল থেকে আরও ভাল সমাধান আছে।"
রব

581

নতুন ব্লক-ভিত্তিক, UIKit animationপদ্ধতিগুলি ব্যবহার করে এটি অনেক সহজ হতে পারে ।

ধরুন নীচের কোডটি ভিউ কন্ট্রোলারে রয়েছে এবং আপনি যে ইউআইআইমেজভিউটি ক্রস-দ্রবীভূত করতে চান সেটি হল সম্পত্তিটির মাধ্যমে সম্বোধনযোগ্য সেলফ ভিউর একটি সংক্ষিপ্তসার তবে self.imageViewআপনার যা যা প্রয়োজন তা হ'ল:

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

সম্পন্ন.

এবং সুইফটে এটি করার জন্য এটি এর মতো:

    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)

3
অন্যান্য উত্তরগুলি সঠিক তবে পুরানো (এবং / অথবা অতিরিক্ত ভার্জোজ) are
স্টিভেন ক্র্যামার

3
সুপার ভিউতে রূপান্তরটি করার দরকার নেই to আমি ইউআইআইমেজভিউকে লক্ষ্য হিসাবে নির্দিষ্ট করে এই কাজটি পরিচালনা করতে সক্ষম হয়েছি।
ডেসমন্ড

7
@ user577888 কেবলমাত্র একটি ছোট জিনিস। আপনার খালি সমাপ্তি ব্লকে শূন্য করা উচিত। ব্লকগুলি ফাংশন পয়েন্টার নয় (^ দ্বারা চিহ্নিত হিসাবে) এবং অবজেক্টিভি-সি অবজেক্টের মতো কাজ করে। আপনি যদি NULL পাস করেন তবে সংকলক 0 বা (শূন্য *) 0 হিসাবে এটি ব্যাখ্যা করবে। যদি কোনও কারণে ট্রানজিশনের সাথে অন্তর্নিহিত কোডটি ভিথ ভিউ: ... দুর্ঘটনাক্রমে সম্পূর্ণতা ব্লকে একটি বার্তা প্রেরণ করে (যেমন [সম্পূর্ণ করার অনুলিপি]) এর বৈধতা যাচাই না করে, এটি একটি ত্রুটির দিকে পরিচালিত করবে। তাই কোনও ব্লক খালি রাখতে সেট করার সময় আপনার সর্বদা অবজেক্টিভ সি ব্যবহার করা উচিত।
মিঃ টি

3
@ মিঃ টি নুল এবং শূন্যের মূল্য একরকম। উভয়ই 0 তে সংজ্ঞায়িত এবং উভয়ই পরিবর্তিত হওয়ার সম্ভাবনা নেই। সুতরাং, আপনি যে কোনও জায়গায় শূন্য করতে বা ব্যবহার করতে পারবেন সেখানে NULL ব্যবহার করা নিরাপদ।
ashevin

1
@ মিঃ টি আমার বক্তব্যটি হ'ল একে অপরকে ব্যবহার করা কখনই ক্রাশের কারণ হতে পারে না কারণ সংকলিত কোড স্তরে তারা অভিন্ন এবং ব্যবহারিক কারণে সর্বদা থাকবে। সাধারণভাবে সংকলক সতর্কবার্তা দমন করা একটি ভাল ধারণা, তবে লোকেদের শূন্যতার পরিবর্তে NUL ব্যবহার করা একটি ত্রুটি এটি বলা ভুল is
ashevin


6

হ্যাঁ আপনি যা বলছেন তা একেবারে সঠিক এবং এটি করার উপায়টি। আমি এই পদ্ধতিটি লিখেছি এবং সর্বদা এটি আমার ইমেজে বিবর্ণ করতে ব্যবহার করি। আমি CALayerএই জন্য মোকাবেলা । এর জন্য আপনাকে কোর অ্যানিমেশনটি আমদানি করতে হবে।

+ (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]


ইউআইআইমেজভিউতে কোনও চিত্র সেট করার পরে আমি এই কোডটি যুক্ত করি, অ্যানিমেশন শুরু করার সময় মনে হয় একটি ঝলক রয়েছে।
অটোবটস

4

আপনি একটি সাবক্লাসে ফেড-ইন বৈশিষ্ট্যটি প্যাকেজও করতে পারেন, যাতে আপনি নীচের উদাহরণের মতো এটি সাধারণ ইউআইআইমেজভিউ হিসাবে ব্যবহার করতে পারেন:

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:পরিবর্তন করতে পারে এবং এই প্রশ্নের অন্যান্য উত্তরে বর্ণিত অন্য চমত্কার উদাহরণগুলির মধ্যে একটি UIImageViewহতে পারে - আমি এখানে যা করছিলাম তত বাড়তি ফ্লাই তৈরি করা হতে পারে আপনার নির্দিষ্ট পরিস্থিতিতে একটি অগ্রহণযোগ্য ওভারহেড হতে হবে

আইএমএমফ্যাডআইমেজভিউ। H :

#import <UIKit/UIKit.h>

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

আইএমএমফেইডআইমেজভিউ.এম :

#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];
        }];
    }
}

উপরের কোডটি কয়েকটি অনুমানের উপর নির্ভর করে (আপনার এক্সকোড প্রকল্পে এটিআরসি সক্ষম করা সহ) কেবলমাত্র ধারণার প্রমাণ হিসাবেই উদ্দিষ্ট, এবং স্পষ্টতা এবং ফোকাসের স্বার্থে, এটি গুরুত্বপূর্ণ সম্পর্কযুক্ত কোড বাদ দিয়ে প্রাসঙ্গিক থাকে। দয়া করে এটি অন্ধভাবে কপি-পেস্ট করবেন না।


3

অনির্দিষ্টকালের জন্য পুনরাবৃত্তি করার জন্য আমার উত্তরণ দরকার needed এটির জন্য এটি অনেক পরীক্ষা এবং ত্রুটি নিয়েছে তবে শেষ পর্যন্ত আমি যে ফলাফলটি সন্ধান করছি তা পেয়েছি। এটি কোনও ইউআইটিএবলভিউসেলটিতে কোনও ইউআইআইমেজভিউতে চিত্র অ্যানিমেশন যুক্ত করার জন্য কোড স্নিপেট।

এখানে প্রাসঙ্গিক কোড:

@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;
}

হাই আমি ভাবছিলাম যে আপনি যদি নিজের [স্ব-সেট-ভারিটিআইমেজভিউ: সেল.আইমেজভিউ] তে আরও কিছু তথ্য যুক্ত করতে পারেন; পদ্ধতি হিসাবে আমি প্রাণবন্ত বা সমস্ত দ্রুত প্রাণবন্ত করার জন্য শেষ সেলটি পেতে পারি তবে সত্যিই দ্রুত, ধন্যবাদ
gav

হাই গ্যাভ, "ভ্যারাইটিআইমেজভিউ" ভিউ কন্ট্রোলারের একটি দুর্বল রেফারেন্স যাতে আমি সেল.আইমেজভিউতে নির্ধারণ করতে পারি এবং পরে পদ্ধতি 'অ্যানিমেটআইমেজেস'-এ এটি রেফারেন্স করতে পারি। @ প্রপার্টি (ননোটমিক, দুর্বল) ইউআইআইমেজভিউ * বিভিন্ন আইমেজভিউ; আপনি "ট্রানজিশনভিথউইউভিউ" -তে সংক্ষিপ্ত "সময়কাল" নির্ধারণ করে চিত্রগুলি দ্রুত ঘোরান। আশা করি এটিই আপনি জিজ্ঞাসা করছেন।
ক্রিস্টোফার

হাই ক্রিস্টোফার জবাবের জন্য আপনাকে ধন্যবাদ জানায়, আমি "সেট ভার্চারি আইমেজভিউ:" সম্পর্কে ভাবছিলাম, "আমি এটির একধরণের শূন্যপদ্ধতি ধরে নিয়েছি যা আমি কেবলমাত্র সর্বশেষ সেলটি অ্যানিমেট করতে সক্ষম হয়েছি বলে পুনরায় ব্যবহারের অনুমতি দেয়। পুনরায় জবাব দেওয়ার জন্য আপনাকে ধন্যবাদ, সমস্ত সেরা গাভ
গাভ

এই পদ্ধতিটি স্ট্যান্ডার্ড "সম্পত্তি" ঘোষণা ব্যবহার করে উত্পন্ন হয়। উদাহরণস্বরূপ, @ প্রপার্টি (ননোটমিক, দুর্বল) ইউআইআইমেজভিউ * বিভিন্ন আইমেজভিউ। এটি একটি "দুর্বল" রেফারেন্স হিসাবে এটি অন্য একটি স্থানীয় ভেরিয়েবল (টেবিল সেলের ইমেজভিউ) বোঝায়। আমি পরিবর্তে টেবিল কক্ষে একটি রেফারেন্স তৈরি করতে পারি এবং পদ্ধতি অ্যানিমেটাইমেজে সেল.আইমেজভিউতে অ্যাক্সেস করতে পারি। আশা করি এটা কাজে লাগবে.
ক্রিস্টোফার

2

বিকল্পটি UIView.transition()নিয়ে সমস্যা হওয়ার পরে .transitionCrossDissolve(আমি একটি ইউআইআইভিউভিউয়ের অভ্যন্তরে চিত্রগুলি পরিবর্তন করার চেষ্টা করছিলাম এবং অ্যানিমেশন ছাড়াই তাত্ক্ষণিকভাবে ঘটেছে) আমি জানতে পেরেছিলাম যে আপনাকে আরও একটি বিকল্প যুক্ত করতে হবে যা আপনাকে ভিউয়ের অভ্যন্তরে বৈশিষ্ট্যগুলি পরিবর্তন করতে দেয় ( সুইফট ৪.২ ):

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

তদতিরিক্ত: আপনার চিত্রভিউতে যদি আপনার কোনও মতামত থাকে তবে এটি আবারও চিত্রায়িত হবে এবং এটি অ্যানিমেশনটিকে আটকাতে পারে। উদাহরণস্বরূপ, আমার ইমেজভিউতে অস্পষ্টতার সাথে আমার সাবভিউ ছিল এবং সে ক্ষেত্রে অ্যানিমেশনটি কাজ করে না। সুতরাং আমি স্রেফ আমার দর্শন শ্রেণিবিন্যাস পরিবর্তন করেছি এবং অস্পষ্টতাকে তার নিজের দৃষ্টিতে সরিয়ে নিয়ে ইমেজভিউয়ের উপরে রেখেছি।


0

এটি আমি মনে করি এটি করার সংক্ষিপ্ততম উপায়। একটি ইউআইভিউ অ্যানিমেশন তৈরি করুন এবং এটি আপনার চিত্রভিউতে প্রতিশ্রুতিবদ্ধ।

[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.5];
[myImageView setAlpha:0.0];
[UIView commitAnimations];

0

highlightedImageসম্পত্তি ব্যবহার করে এটিকে আরও কিছুটা সহজ করা যায়। এখানে সুইফট ৩-এর একটি উদাহরণ রয়েছে প্রথমে সাধারণ এবং হাইলাইট উভয় চিত্রই সেট করুন:

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)
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.