আইফোন ইউআইভিউ অ্যানিমেশন সেরা অনুশীলন


142

আইফোনটিতে রূপান্তরগুলি অ্যানিমেট করার জন্য সেরা অনুশীলন হিসাবে বিবেচনা করা হয়?

উদাহরণস্বরূপ, ViewTransitionsঅ্যাপল থেকে প্রাপ্ত নমুনা প্রকল্পটি কোড ব্যবহার করে:

CATransition *applicationLoadViewIn = [CATransition animation];
[applicationLoadViewIn setDuration:1];
[applicationLoadViewIn setType:kCATransitionReveal];
[applicationLoadViewIn setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn]];
[[myview layer] addAnimation:applicationLoadViewIn forKey:kCATransitionReveal];

তবে জালের চারপাশে ভাসমান কোড স্নিপেটগুলিও রয়েছে যা দেখতে দেখতে এটি:

[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.75];
[UIView setAnimationDelegate:self];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:myview cache:YES];
[myview removeFromSuperview];
[UIView commitAnimations];

সেরা পন্থা কি? আপনি যদি একটি স্নিপেট পাশাপাশি সরবরাহ করতে পারেন তবে এটি অনেক প্রশংসা হবে।

দ্রষ্টব্য: আমি সঠিকভাবে কাজ করার জন্য দ্বিতীয় পন্থা পেতে অক্ষম হয়েছি।

উত্তর:


118

পদ্ধতিটি সম্পর্কে ইউআইভিউ রেফারেন্সের বিভাগ থেকে beginAnimations:context::

এই পদ্ধতির ব্যবহার আইফোন ওএস 4.0 এবং তারপরে নিরুৎসাহিত করা হয়েছে। পরিবর্তে আপনার ব্লক-ভিত্তিক অ্যানিমেশন পদ্ধতি ব্যবহার করা উচিত।

টমের মন্তব্যের ভিত্তিতে ব্লক-ভিত্তিক অ্যানিমেশন এর উদাহরণ

[UIView transitionWithView:mysuperview 
                  duration:0.75
                   options:UIViewAnimationTransitionFlipFromRight
                animations:^{ 
                    [myview removeFromSuperview]; 
                } 
                completion:nil];

4
সুতরাং .. স্পষ্ট করে বলার অর্থ, প্রথম ব্যবহার (CATransition) ব্যবহার করুন, দ্বিতীয়টি নয়?
স্টিভ এন

2
হ্যাঁ, এটিই প্রথম পদ্ধতির (ক্যাটারানসিশন)।
নেবুলাফক্স

16
@ স্টিভেন এন, না, এর অর্থ ব্লক-ভিত্তিক অ্যানিমেশনগুলি UIViewপরিবর্তে ব্যবহার করা। এগুলি মূলত beginAnimationsএবং বন্ধু হিসাবে একই , তবে ব্লক / ক্লোজার বৈশিষ্ট্যগুলি ব্যবহার করে।
ড্যান রোজনস্টার্ক

36
হ্যাঁ, ইয়ার ঠিক আছে। কোনও ব্লক অ্যানিমেশনটি দেখতে কেমন: [UIView transitionWithView:mysuperview duration:0.75 options:UIViewAnimationTransitionFlipFromRight animations:^{ [myview removeFromSuperview]; } completion:nil]বিশদ বিবরণের জন্য ইউআইভিউ ডকুমেন্টেশন চেক করুন।
টম ভ্যান জুম্মেরেন 15'11

3
আপনি যদি 3.1.3 ফোন সমর্থন করতে চান তবে বাদ দিন। তারপরে ব্লক ব্যবহার করবেন না।
জাবল্যাঙ্ক

69

আমি উত্তরোত্তরটি অনেকগুলি ভাল লাইটওয়েট অ্যানিমেশনের জন্য ব্যবহার করছি। আপনি এটি দুটি দর্শন ক্রসফেইড ব্যবহার করতে পারেন, বা অন্যটির সামনে একটি বিবর্ণ করতে পারেন বা এটি বিবর্ণ করতে পারেন। আপনি ব্যানারের মতো অন্যের উপরে কোনও দৃশ্য অঙ্কুর করতে পারেন, আপনি একটি দৃশ্য প্রসারিত করতে পারেন বা সঙ্কুচিত করতে পারেন ... আমি beginAnimation/ থেকে অনেক মাইলেজ পাচ্ছি commitAnimations

ভাববেন না যে আপনি যা করতে পারেন তা হ'ল:

[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:myview cache:YES];

এখানে একটি নমুনা দেওয়া হল:

[UIView beginAnimations:nil context:NULL]; {
    [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
    [UIView setAnimationDuration:1.0];
    [UIView setAnimationDelegate:self];
    if (movingViewIn) {
// after the animation is over, call afterAnimationProceedWithGame
//  to start the game
        [UIView setAnimationDidStopSelector:@selector(afterAnimationProceedWithGame)];

//      [UIView setAnimationRepeatCount:5.0]; // don't forget you can repeat an animation
//      [UIView setAnimationDelay:0.50];
//      [UIView setAnimationRepeatAutoreverses:YES];

        gameView.alpha = 1.0;
        topGameView.alpha = 1.0;
        viewrect1.origin.y = selfrect.size.height - (viewrect1.size.height);
        viewrect2.origin.y = -20;

        topGameView.alpha = 1.0;
    }
    else {
    // call putBackStatusBar after animation to restore the state after this animation
        [UIView setAnimationDidStopSelector:@selector(putBackStatusBar)];
        gameView.alpha = 0.0;
        topGameView.alpha = 0.0;
    }
    [gameView setFrame:viewrect1];
    [topGameView setFrame:viewrect2];

} [UIView commitAnimations];

আপনি দেখতে পাচ্ছেন, আপনি আলফা, ফ্রেম এবং এমনকি কোনও দর্শন আকারের সাথে খেলতে পারেন। চারপাশে খেলা. আপনি এর ক্ষমতা দিয়ে অবাক হতে পারেন।


52

পার্থক্যটি আপনার অ্যানিমেশনের উপর নিয়ন্ত্রণের পরিমাণ হিসাবে মনে হচ্ছে।

CATransitionপদ্ধতির আপনি আরও নিয়ন্ত্রণ এবং সেইজন্য আরো জিনিষ, সেট আপ করার জন্য যেমন দেয়। সময় ফাংশন। একটি বস্তু হওয়ায় আপনি এটি পরে সংরক্ষণ করতে পারবেন, ডুপ্লিকেট কোড হ্রাস করার জন্য আপনার সমস্ত অ্যানিমেশনগুলিকে এটিতে রেফ্যাক্টরটি নির্দেশ করতে পারেন etc.

UIViewবর্গ পদ্ধতি সাধারণ অ্যানিমেশন জন্য সুবিধা পদ্ধতি আছে, কিন্তু চেয়ে বেশি সীমাবদ্ধ CATransition। উদাহরণস্বরূপ, কেবলমাত্র সম্ভাব্য চারটি রূপান্তরিত প্রকার রয়েছে (বামদিকে ফ্লিপ করুন, ডানদিকে ফ্লিপ করুন, কার্ল আপ করুন, কার্ল ডাউন করুন)। যদি আপনি একটি বিবর্ণ করতে চান, তবে আপনাকে CATransition'sবিবর্ণ ট্রানজিশনের জন্য খনন করতে হবে , বা আপনার UIViewআলফার একটি সুস্পষ্ট অ্যানিমেশন সেট আপ করতে হবে ।

নোট করুন যে CATransitionম্যাক ওএস এক্স-এ আপনাকে CoreImageরূপান্তর হিসাবে ব্যবহার করার জন্য একটি স্বেচ্ছাসেবী ফিল্টার নির্দিষ্ট করতে দেবে, তবে এটি এখন দাঁড়িয়ে আপনি আইফোনে এটি করতে পারবেন না, যার অভাব রয়েছে CoreImage


7
মনে রাখবেন এটি আইওএস 2.0-যুগের পরামর্শ। আপনি যদি আইওএস ৪.০ বা তার বেশি থাকেন তবে ব্লক-ভিত্তিক পদ্ধতিগুলিতে রাফেল ভেগার উত্তর দেখুন।
রায়ান ম্যাককুইগ

এছাড়াও নোট করুন যে কোর আইমেজ এখন আইওএস 5 হিসাবে উপলভ্য, তবে এর কয়েকটি বৈশিষ্ট্য রয়েছে। আমি বিশ্বাস করি আপনি কোনও অ্যানিমেশনটিতে একটি কোরআইজেজ ট্রানজিশন ব্যবহার করতে পারেন তবে আপনি আইওএস (5) এ কাস্টম কোররিজেশন ফিল্টার তৈরি করতে পারবেন না।
অ্যারন অ্যাশ

26

আমরা এই সাধারণ কোডটি ব্যবহার করে আইওএস 5 এ চিত্রগুলি প্রাণবন্ত করতে পারি।

CGRect imageFrame = imageView.frame;
imageFrame.origin.y = self.view.bounds.size.height;

[UIView animateWithDuration:0.5
    delay:1.0
    options: UIViewAnimationCurveEaseOut
    animations:^{
        imageView.frame = imageFrame;
    } 
    completion:^(BOOL finished){
        NSLog(@"Done!");
    }];

5
এটি আইওএস 4 এও উপলব্ধ এবং এটি "ব্লক ভিত্তিক" অ্যানিমেশন হিসাবে উল্লেখ করা হয়। এটি আইওএস 5 এবং তার পরেও সীমাবদ্ধ নয়।
জনবেকারস

8

ইন UIViewডক্স, জন্য এই ফাংশন সম্পর্কে একটি পঠিত আছে ios4 + +

+ (void)transitionFromView:(UIView *)fromView toView:(UIView *)toView duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options completion:(void (^)(BOOL finished))completion

6

যাইহোক "ব্লক" পদ্ধতিটি এখন-দিনগুলিতে প্রিফার হয়। আমি নীচে সহজ ব্লক ব্যাখ্যা করব।

নীচে স্নিপড বিবেচনা করুন। বাগ 2 এবং বাগ 3 চিত্রের ভিউ। নীচের অ্যানিমেশনটি 1 সেকেন্ডের বিলম্বের পরে 1 সেকেন্ড সময়কাল সহ একটি অ্যানিমেশন বর্ণনা করে। বাগ 3 এটি কেন্দ্র থেকে বাগ 2 এর কেন্দ্রে সরানো হয়। অ্যানিমেশনটি শেষ হয়ে গেলে এটি "সেন্টার অ্যানিমেশন সম্পন্ন!" এ লগ হবে।

-(void)centerAnimation:(id)sender
{
NSLog(@"Center animation triggered!");
CGPoint bug2Center = bug2.center;

[UIView animateWithDuration:1
                      delay:1.0
                    options: UIViewAnimationCurveEaseOut
                 animations:^{
                     bug3.center = bug2Center;
                 } 
                 completion:^(BOOL finished){
                     NSLog(@"Center Animation Done!");
                 }];
}

আশা করি এটা পরিষ্কার !!!


2
আপনি সিজিপিয়েন্ট বুগ 3.সেন্টারকে বাগ 3 সেন্টারে বরাদ্দ করেছেন এবং তার ঠিক পরে আপনি একই ভেরিয়েবল বাগ 3 সেন্টারে সিজিপিয়েন্ট বুগ 2. সেন্টার বরাদ্দ করেছেন? কেন আপনি যে করছেন ?
pnizzle

oopss !! একটি টাইপো বন্ধু আছে। এখন আপডেট হয়েছে।
দীপুকজায়ান

2

স্মুথ অ্যানিমেশনের জন্য কোড এখানে, অনেক বিকাশকারীদের পক্ষে সহায়ক হতে পারে।
আমি এই টিউটোরিয়াল থেকে কোড এই স্নিপেট খুঁজে পেয়েছি।

CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[animation setAutoreverses:YES];
[animation setFromValue:[NSNumber numberWithFloat:1.3f]];
[animation setToValue:[NSNumber numberWithFloat:1.f]];
[animation setDuration:2.f];
[animation setRemovedOnCompletion:NO];

[animation setFillMode:kCAFillModeForwards];
[[self.myView layer] addAnimation:animation forKey:@"scale"];/// add here any Controller that you want t put Smooth animation.

2

আসুন চেষ্টা করে দেখুন এবং সুইফট 3 এর জন্য চেকআউট করি ...

UIView.transition(with: mysuperview, duration: 0.75, options:UIViewAnimationOptions.transitionFlipFromRight , animations: {
    myview.removeFromSuperview()
}, completion: nil)
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.