iPhone UIView एनिमेशन बेस्ट प्रैक्टिस


142

IPhone पर दृश्य संक्रमण को एनिमेट करने के लिए सबसे अच्छा अभ्यास क्या माना जाता है?

उदाहरण के लिए, 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

विधि के बारे में UIView संदर्भ अनुभाग से beginAnimations:context::

इस विधि का उपयोग iPhone OS 4.0 और बाद में हतोत्साहित किया जाता है। आपको इसके बजाय ब्लॉक-आधारित एनीमेशन विधियों का उपयोग करना चाहिए।

जैसे टॉम की टिप्पणी के आधार पर ब्लॉक-आधारित एनीमेशन

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

4
तो .. स्पष्ट होने के लिए, इसका मतलब है कि पहले दृष्टिकोण (कैटरशिप) का उपयोग करें, दूसरे का नहीं?
स्टीव एन

2
हां, यह पहला तरीका है (CATransition)।
नेबुलाफोक्स

16
@Steven N, नहीं, इसका अर्थ है कि UIViewइसके बजाय ब्लॉक-आधारित एनिमेशन का उपयोग करना। वे अनिवार्य रूप से beginAnimationsऔर दोस्तों के समान हैं , लेकिन ब्लॉक / क्लोजर सुविधाओं का उपयोग करते हैं।
डैन रोसेनस्टार्क

36
हां, यार सही है। यह एक ब्लॉक एनीमेशन कैसे दिखता है: [UIView transitionWithView:mysuperview duration:0.75 options:UIViewAnimationTransitionFlipFromRight animations:^{ [myview removeFromSuperview]; } completion:nil]विवरण के लिए UIView प्रलेखन की जांच करें।
टॉम वैन ज़ुमेरेन

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दृष्टिकोण आपको अधिक नियंत्रण है और इसलिए अधिक बातें, स्थापित करने के लिए जैसे देता है। समय समारोह। एक वस्तु होने के नाते, आप इसे बाद के लिए स्टोर कर सकते हैं, दोहराए गए कोड को कम करने के लिए उस पर अपने सभी एनिमेशन इंगित करने के लिए रिफ्लेक्टर।

UIViewवर्ग तरीकों आम एनिमेशन के लिए सुविधा तरीके हैं, लेकिन अधिक से अधिक सीमित हैं CATransition। उदाहरण के लिए, केवल चार संभावित संक्रमण प्रकार हैं (फ्लिप लेफ्ट, फ्लिप राइट, कर्ल अप, कर्ल डाउन)। यदि आप एक फीका करना चाहते हैं, तो आपको या तो CATransition'sफ़ेड ट्रांज़िशन के लिए खुदाई करनी होगी , या अपना एक स्पष्ट एनीमेशन सेट करना होगाUIView अल्फा के ।

ध्यान दें कि CATransitionMac OS X आपको CoreImageसंक्रमण के रूप में उपयोग करने के लिए एक मनमाना फिल्टर निर्दिष्ट करने देगा, लेकिन जैसा कि यह अब खड़ा है आप iPhone पर ऐसा नहीं कर सकते, जिसमें कमी है CoreImage


7
ध्यान दें कि यह iOS 2.0-युग की सलाह है। अगर आप iOS 4.0 या उससे ऊपर के हैं, तो ब्लॉक-आधारित तरीकों पर राफेल वेगा का जवाब देखें।
रयान मैककॉइग

यह भी ध्यान दें कि CoreImage अब iOS 5 के रूप में उपलब्ध है, लेकिन इसकी कुछ विशेषताएं हैं। मेरा मानना ​​है कि आप एक एनीमेशन में एक CoreImage संक्रमण का उपयोग कर सकते हैं, लेकिन आप iOS (5) पर कस्टम CoreImage फ़िल्टर नहीं बना सकते।
एरोन ऐश

26

हम इस सरल कोड का उपयोग करके ios 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
यह iOS 4 में भी उपलब्ध है और इसे "ब्लॉक आधारित" एनीमेशन के रूप में जाना जाता है। यह iOS 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
आपने CG3 Bug3.center को bug3Center को सौंपा और उसके बाद आप उसी चर Bug3Center में CGPoint Bug2.center असाइन करें? तुम वो क्यों कर रहे हो ?
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)
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.