কোর অ্যানিমেশন দিয়ে কীভাবে কাস্টম ইজিং ফাংশন তৈরি করবেন?

Question

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

মিডিয়াটাইমিং ফাংশন (বেজিয়ার) দিয়ে এই জিনিসগুলি করা সম্ভব:

তবে আমি টাইমিং ফাংশনগুলি তৈরি করতে চাই যা আরও জটিল। সমস্যাটি হ'ল মিডিয়া টাইমিংয়ের জন্য একটি কিউবিক বেজিয়ার লাগবে যা এই প্রভাবগুলি তৈরি করতে যথেষ্ট শক্তিশালী নয়:

_{(উত্স: স্প্যারো-ফ্রেমওয়ার্ক.org )}

কোড অন্যান্য অবকাঠামো সহজ যথেষ্ট উপরে, যা এই খুব হতাশাজনক তোলে তৈরি করুন। নোট করুন যে বক্ররেখাগুলি ইনপুট সময়কে আউটপুট সময় (টিটি কার্ভ) এ ম্যাপ করে এবং সময়-অবস্থান বক্ররেখা না। উদাহরণস্বরূপ, ইজিজআউটবাউন (টি) = টি নতুন টি দেয় । তারপরে সেই টি চলাচলের চক্রান্ত করার জন্য ব্যবহৃত হয় (বা আমাদের সম্পত্তি যা যা করা উচিত) plot

সুতরাং, আমি একটি জটিল রীতিনীতি তৈরি করতে চাই CAMediaTimingFunctionতবে কীভাবে এটি করব তা সম্পর্কে আমার কোনও ধারণা নেই বা এটি এমনকি যদি সম্ভব হয় তবে? কোন বিকল্প আছে?

সম্পাদনা করুন:

পদক্ষেপে এখানে একটি দৃ concrete় উদাহরণ। খুব শিক্ষামূলক :)

1. আমি বিন্দু থেকে একটি লাইন বরাবর একটি বস্তু এনিমেট করতে চান একটি থেকে খ , কিন্তু আমি এটা "ফিরে আসা" করতে চান উপরে easeOutBounce বক্ররেখা ব্যবহার লাইন বরাবর তার আন্দোলন। এর অর্থ এটি একটি থেকে বি পর্যন্ত সঠিক রেখাটি অনুসরণ করবে তবে বর্তমান বেজিয়ার-ভিত্তিক ক্যামিডিয়াটাইমিং ফাংশনটি ব্যবহার করে যা সম্ভব তার চেয়ে আরও জটিল পদ্ধতিতে ত্বরান্বিত ও হ্রাস পাবে।

2. সেই লাইনটিকে সিজিপিথের সাথে নির্দিষ্ট কোনও স্বেচ্ছাচারী বক্ররেখা তৈরি করতে দিন movement এটি এখনও সেই বক্ররেখার সাথে সরানো উচিত তবে এটি লাইন উদাহরণের মতো একইভাবে ত্বরান্বিত ও হ্রাস করতে হবে।

তত্ত্বগতভাবে আমি মনে করি এটি এর মতো কাজ করা উচিত:

একটি কীফ্রেম অ্যানিমেশন হিসাবে আন্দোলন বক্ররেখা বর্ণনা দেয় পদক্ষেপ (টি) = P , যেখানে T সময় [0..1], হয় পি সময় গণনা করা অবস্থান টন । সুতরাং সরান (0) বক্ররেখার শুরুতে অবস্থানটি ফিরিয়ে দেয়, ( মাঝের দিকে (0.5) সঠিক মাঝখানে সরান এবং শেষে (1) সরান । একটি একটি সময়জ্ঞান ফাংশন ব্যবহার করে সময় (টি) = T প্রদান টি মান পদক্ষেপ আমাকে দিতে হবে আমি কি চাই। একটি উত্থান প্রভাব জন্য, সময় ফাংশন সময় (0.8) এবং সময় (0.8) জন্য একই টি মান ফিরে আসবে(একটি উদাহরণ)। একটি ভিন্ন প্রভাব পেতে কেবল সময় ফাংশনটি প্রতিস্থাপন করুন।

(হ্যাঁ, চারটি লাইন সেগমেন্ট তৈরি করে এবং এতে যোগ দিয়ে লাইন-বাউন্সিং করা সম্ভব যা পিছন পিছনে যায়, তবে এটির প্রয়োজন হবে না all সর্বোপরি, এটি কেবল একটি সরল রৈখিক কার্য যা সময়কে মানকে পজিশনে ম্যাপ করে ))

আমি আশা করি আমি এখানে অর্থবোধ করছি।

Comments

সচেতন থাকুন (যেমনটি প্রায়শই এসও তে হয়), খুব পুরানো এই প্রশ্নটির এখন অনেক পুরানো উত্তর রয়েছে current বর্তমান উত্তরগুলিতে স্ক্রোল করতে ভুলবেন না। : (অত্যন্ত উল্লেখযোগ্য cubic-bezier.com !)

— Fattie

Answer 1

আমি এটি খুঁজে পেয়েছি:

প্রেম সহ কোকো - কোর অ্যানিমেশনে প্যারামেট্রিক ত্বরণ বক্ররেখা

তবে আমি মনে করি এটি ব্লক ব্যবহার করে কিছুটা সহজ এবং আরও পঠনযোগ্য হতে পারে। সুতরাং আমরা CAKeyframeAnimation এ এমন একটি বিভাগ নির্ধারণ করতে পারি যা দেখতে এরকম কিছু দেখায়:

CAKeyframeAnimation + + Parametric.h:

// this should be a function that takes a time value between 
//  0.0 and 1.0 (where 0.0 is the beginning of the animation
//  and 1.0 is the end) and returns a scale factor where 0.0
//  would produce the starting value and 1.0 would produce the
//  ending value
typedef double (^KeyframeParametricBlock)(double);

@interface CAKeyframeAnimation (Parametric)

+ (id)animationWithKeyPath:(NSString *)path 
      function:(KeyframeParametricBlock)block
      fromValue:(double)fromValue
      toValue:(double)toValue;

CAKeyframeAnimation + + Parametric.m:

@implementation CAKeyframeAnimation (Parametric)

+ (id)animationWithKeyPath:(NSString *)path 
      function:(KeyframeParametricBlock)block
      fromValue:(double)fromValue
      toValue:(double)toValue {
  // get a keyframe animation to set up
  CAKeyframeAnimation *animation = 
    [CAKeyframeAnimation animationWithKeyPath:path];
  // break the time into steps
  //  (the more steps, the smoother the animation)
  NSUInteger steps = 100;
  NSMutableArray *values = [NSMutableArray arrayWithCapacity:steps];
  double time = 0.0;
  double timeStep = 1.0 / (double)(steps - 1);
  for(NSUInteger i = 0; i < steps; i++) {
    double value = fromValue + (block(time) * (toValue - fromValue));
    [values addObject:[NSNumber numberWithDouble:value]];
    time += timeStep;
  }
  // we want linear animation between keyframes, with equal time steps
  animation.calculationMode = kCAAnimationLinear;
  // set keyframes and we're done
  [animation setValues:values];
  return(animation);
}

@end

এখন ব্যবহারটি এরকম কিছু দেখবে:

// define a parametric function
KeyframeParametricBlock function = ^double(double time) {
  return(1.0 - pow((1.0 - time), 2.0));
};

if (layer) {
  [CATransaction begin];
    [CATransaction 
      setValue:[NSNumber numberWithFloat:2.5]
      forKey:kCATransactionAnimationDuration];

    // make an animation
    CAAnimation *drop = [CAKeyframeAnimation 
      animationWithKeyPath:@"position.y"
      function:function fromValue:30.0 toValue:450.0];
    // use it
    [layer addAnimation:drop forKey:@"position"];

  [CATransaction commit];
}

আমি জানি এটি আপনি যা চেয়েছিলেন ততটা সহজ নাও হতে পারে তবে এটি শুরু।

Comments

আমি জেসি ক্রোসেনের প্রতিক্রিয়া নিয়েছি এবং এতে কিছুটা প্রসারিত করেছি। আপনি এটি সিজিপয়েন্টগুলিকে অ্যানিমেট করতে এবং উদাহরণস্বরূপ সিজি সাইজ ব্যবহার করতে পারেন। আইওএস 7 হিসাবে, আপনি ইউআইভিউ অ্যানিমেশনগুলির সাথে স্বেচ্ছাসেবী সময় ফাংশনও ব্যবহার করতে পারেন। আপনি github.com/jjackson26/JMJParametricAnimation

— জে জ্যাকসন

@ জেজে জ্যাকসন অ্যানিমেশনগুলির দুর্দান্ত সংগ্রহ! তাদের সংগ্রহ করার জন্য ধন্যবাদ

— কোডি

Answer 2

আইওএস 10 থেকে দুটি নতুন টাইমিং অবজেক্ট ব্যবহার করে কাস্টম টাইমিং ফাংশন সহজতর করা সম্ভব হয়েছিল।

1) ইউআইকিউবিক টিমিংপ্যারামিটারগুলি ঘন ব্যাজিয়ার বক্ররেখাকে একটি সহজকরণ ফাংশন হিসাবে সংজ্ঞায়িত করতে দেয় ।

let cubicTimingParameters = UICubicTimingParameters(controlPoint1: CGPoint(x: 0.25, y: 0.1), controlPoint2: CGPoint(x: 0.25, y: 1))
let animator = UIViewPropertyAnimator(duration: 0.3, timingParameters: cubicTimingParameters)

অথবা অ্যানিম্যাটর ইনিশিয়ালাইজে কন্ট্রোল পয়েন্টগুলি ব্যবহার করে

let controlPoint1 = CGPoint(x: 0.25, y: 0.1)
let controlPoint2 = CGPoint(x: 0.25, y: 1)
let animator = UIViewPropertyAnimator(duration: 0.3, controlPoint1: controlPoint1, controlPoint2: controlPoint2) 

এই অসাধারণ পরিষেবাটি আপনার বক্ররেখার জন্য নিয়ন্ত্রণ পয়েন্টগুলি চয়ন করতে সহায়তা করবে।

2) UISpringTimingParameters ডেভেলপারদের হস্তক্ষেপ করার ক্ষমতা প্রদান অনুপাত স্যাঁতসেঁতে , ভর , শক্ত হয়ে যাওয়া , এবং প্রাথমিক বেগ আকাঙ্ক্ষিত বসন্ত আচরণ তৈরি করুন।

let velocity = CGVector(dx: 1, dy: 0)
let springParameters = UISpringTimingParameters(mass: 1.8, stiffness: 330, damping: 33, initialVelocity: velocity)
let springAnimator = UIViewPropertyAnimator(duration: 0.0, timingParameters: springParameters)

স্থায়িত্বের পরামিতি এখনও অ্যানিমেটরে উপস্থাপিত হয়েছে, তবে বসন্তের সময়কালে উপেক্ষা করা হবে।

এই দুটি বিকল্প যদি পর্যাপ্ত না হয় তবে আপনি ইউআইটিআইমিংকুরিভেপ্রভাইডার প্রোটোকলকে নিশ্চিত করে নিজের নিজস্ব টাইমিং বক্ররেখা প্রয়োগ করতে পারেন ।

আরও বিশদ, বিভিন্ন টাইমিং প্যারামিটারগুলির সাহায্যে অ্যানিমেশনগুলি কীভাবে তৈরি করা যায়, আপনি ডকুমেন্টেশনে খুঁজে পেতে পারেন ।

এছাড়াও, দয়া করে, ডাব্লুডাব্লুডিসি 2016 এর ইউআইকিট অ্যানিমেশন এবং ট্রানজিশন উপস্থাপনাটির অগ্রগতি দেখুন ।

Comments

আপনি iOS10-অ্যানিমেশন-ডেমো সংগ্রহস্থলে টাইমিং ফাংশন ব্যবহারের উদাহরণগুলি সন্ধান করতে পারেন ।

— ওলগা কোনোরেভা

আপনি কী দয়া করে বিশদটি বর্ণনা করতে পারেন "যদি এই দুটি বিকল্প পর্যাপ্ত না হয় তবে আপনি ইউআইটিআইমিং কর্কভেপ্রভাইডার প্রোটোকলকে নিশ্চিত করে নিজের নিজস্ব টাইমিং বক্ররেখা প্রয়োগ করতে পারেন।" ?

— খ্রিস্টান শ্নোনার

অসাধারণ! এবং ( ) এর CoreAnimationসংস্করণটি iOS 9 এ ফিরে সমর্থনযোগ্য! UISpringTimingParametersCASpringAnimation

— রিদমিক ফিস্টম্যান

@ ওলগা কনোনোরভা, কিউবিক- বেজিয়ার ডটকম পরিষেবাটি নিরবচ্ছিন্ন মূল্যের মূল্যবান এবং দুর্দান্ত । আশা করি আপনি একজন অতি ব্যবহারকারীকে শক্ত করে রেখেছেন - আপনাকে ধন্যবাদ বলার জন্য একটি চর্বি-গাধা পাঠিয়ে দিচ্ছেন :)

— ফ্যাটি

@ ক্রিশ্চিয়িয়ানসনর আমি মনে করি যে উত্তরটি কীভাবে দেবে তা হ'ল UITimingCurveProviderকেবল একটি ঘনক বা একটি বসন্ত অ্যানিমেশনকে উপস্থাপন করার নয় , তবে এমন একটি অ্যানিমেশনের প্রতিনিধিত্ব করাও যা ঘনক এবং বসন্ত উভয়কেই একত্রিত করে UITimingCurveType.composed।

— ডেভিড জেমস

Answer 3

কাস্টম টাইমিং ফাংশন তৈরির একটি উপায় হ'ল ক্যামথিডিয়াটাইমিং ফাংশন ফাংশন উইথকন্ট্রোলপয়েন্টস :::: ফ্যাক্টরি পদ্ধতিটি ব্যবহার করে (সেখানেও একটি সম্পর্কিত initWithControlPPoint :::: init পদ্ধতি রয়েছে)। এটি যা করে তা হ'ল আপনার সময় কার্যকারিতার জন্য বেজিয়ার বক্ররেখা তৈরি করা। এটি কোনও স্বেচ্ছাচারী বক্ররেখা নয়, তবে বেজিয়ার বক্ররেখাগুলি খুব শক্তিশালী এবং নমনীয়। নিয়ন্ত্রণ পয়েন্টগুলির হ্যাং পেতে এটি একটু অনুশীলন করে। একটি টিপ: বেশিরভাগ অঙ্কন প্রোগ্রামগুলি বেজিয়ার রেখাচিত্র তৈরি করতে পারে। এগুলির সাথে খেলে আপনি নিয়ন্ত্রণ পয়েন্টগুলির সাথে প্রতিনিধিত্ব করছেন এমন বক্ররেখা সম্পর্কে একটি ভিজ্যুয়াল প্রতিক্রিয়া দেবে।

এই লিঙ্কে অ্যাপলের ডকুমেন্টেশন পয়েন্ট। প্রাক-বিল্ড ফাংশনগুলি বক্ররেখা থেকে কীভাবে নির্মিত হয় সে সম্পর্কে একটি সংক্ষিপ্ত তবে দরকারী বিভাগ রয়েছে।

সম্পাদনা করুন: নিম্নলিখিত কোডটি একটি সাধারণ বাউন্স অ্যানিমেশন দেখায়। এটি করার জন্য, আমি একটি সমন্বিত টাইমিং ফাংশন তৈরি করেছি ( মান এবং সময় এনএসআরির বৈশিষ্ট্য) এবং অ্যানিমেশনের প্রতিটি বিভাগকে আলাদা সময় দৈর্ঘ্য ( কীটাইমস সম্পত্তি) দিয়েছি । এইভাবে আপনি অ্যানিমেশনগুলির জন্য আরও পরিশীলিত সময় রচনা করতে বাজিয়ার কার্ভগুলি রচনা করতে পারেন। এটি একটি দুর্দান্ত নমুনা কোড সহ এই ধরণের অ্যানিমেশনগুলিতে একটি ভাল নিবন্ধ।

- (void)viewDidLoad {
    UIView *v = [[UIView alloc] initWithFrame:CGRectMake(0.0, 0.0, 50.0, 50.0)];

    v.backgroundColor = [UIColor redColor];
    CGFloat y = self.view.bounds.size.height;
    v.center = CGPointMake(self.view.bounds.size.width/2.0, 50.0/2.0);
    [self.view addSubview:v];

    //[CATransaction begin];

    CAKeyframeAnimation * animation; 
    animation = [CAKeyframeAnimation animationWithKeyPath:@"position.y"]; 
    animation.duration = 3.0; 
    animation.removedOnCompletion = NO;
    animation.fillMode = kCAFillModeForwards;

    NSMutableArray *values = [NSMutableArray array];
    NSMutableArray *timings = [NSMutableArray array];
    NSMutableArray *keytimes = [NSMutableArray array];

    //Start
    [values addObject:[NSNumber numberWithFloat:25.0]];
    [timings addObject:GetTiming(kCAMediaTimingFunctionEaseIn)];
    [keytimes addObject:[NSNumber numberWithFloat:0.0]];


    //Drop down
    [values addObject:[NSNumber numberWithFloat:y]];
    [timings addObject:GetTiming(kCAMediaTimingFunctionEaseOut)];
    [keytimes addObject:[NSNumber numberWithFloat:0.6]];


    // bounce up
    [values addObject:[NSNumber numberWithFloat:0.7 * y]];
    [timings addObject:GetTiming(kCAMediaTimingFunctionEaseIn)];
    [keytimes addObject:[NSNumber numberWithFloat:0.8]];


    // fihish down
    [values addObject:[NSNumber numberWithFloat:y]];
    [keytimes addObject:[NSNumber numberWithFloat:1.0]];
    //[timings addObject:GetTiming(kCAMediaTimingFunctionEaseIn)];



    animation.values = values;
    animation.timingFunctions = timings;
    animation.keyTimes = keytimes;

    [v.layer addAnimation:animation forKey:nil];   

    //[CATransaction commit];

}

Comments

হ্যাঁ এটা সত্য। আপনি যা চান তা অর্জন করতে আপনি CAKeyframeAnimation এর মান এবং সময় সম্পর্কিত বৈশিষ্ট্যগুলি ব্যবহার করে একাধিক টাইমিং ফাংশন একত্রিত করতে পারেন। আমি একটি উদাহরণ তৈরি করব এবং কোডটি কিছুটা রেখে দেব।

— fsaint

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

— মার্টিন উইকম্যান

আপনি কোনও কীফ্রেম অ্যানিমেশনটিতে মানগুলির অ্যারের পরিবর্তে সিজিপিথআরফটি নির্দিষ্ট করতে পারেন, তবে শেষদিকে ফেল্জ সঠিক - CAKeyframeAnimation এবং সময় ফাংশন আপনাকে প্রয়োজনীয় সমস্ত কিছু দেবে। আমি নিশ্চিত না যে আপনি কেন এটি "সাধারণ সমাধান" না বলে "প্রতিটি ব্যবহারের জন্য অনুকূলিতকরণ" করতে হবে to আপনি একবার কারখানার পদ্ধতিতে বা কোনও কি-ফ্রেম অ্যানিমেশন তৈরি করেন এবং তারপরে আপনি যে পছন্দটি চান তার চেয়ে অনেক বার যে কোনও স্তরের সাথে এই অ্যানিমেশনটি যুক্ত করতে পারেন। কেন এটি প্রতিটি ব্যবহারের জন্য কাস্টমাইজ করা প্রয়োজন? সময় মতামতগুলি কীভাবে কাজ করা উচিত তা আপনার ধারণার থেকে আমার কাছে আলাদা বলে মনে হচ্ছে।

— ম্যাট লং

ওহে ছেলেরা, এগুলি এখন 4 বছর দেরি হয়ে গেছে, তবে যদি উইথকন্ট্রোলপয়েন্টগুলি :::: পুরোপুরি বাউন্সি / স্প্রিং অ্যানিমেশনগুলি করতে পারে। এটি কিউবিক

— ম্যাট ফোলি

Answer 4

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

Answer 5

একটি দ্রুতগতি সংস্করণ বাস্তবায়ন TFAnimation লোকের ডেমো একটি হল পাপ বক্ররেখা animation.Use TFBasicAnimationঠিক CABasicAnimationবরাদ্দ ছাড়া timeFunctionআর অন্য একটি ব্লক সঙ্গে timingFunction।

কী বিন্দু উপশ্রেণী হয় CAKeyframeAnimationএবং ক্যালকুলেট ফ্রেম অবস্থান timeFunctionমধ্যে 1 / 60fpsগুলি ব্যবধান ক্লিক করুন.মুছে দেওয়ার পরে সব থেকে সব হিসাব মান যোগ valuesএর CAKeyframeAnimationথেকে বিরতি দ্বারা এবং বার keyTimesখুব।

Answer 6

আমি একটি ব্লক ভিত্তিক পদ্ধতির তৈরি করেছি, যা একাধিক অ্যানিমেশন সহ অ্যানিমেশন গ্রুপ তৈরি করে।

প্রতিটি সম্পত্তিতে প্রতি অ্যানিমেশন 33 টির মধ্যে 1 টি বিভিন্ন প্যারামিট্রিক বক্ররেখা, প্রাথমিক বেগ সহ একটি ক্ষয় সময় ফাংশন, বা আপনার প্রয়োজনের জন্য কনফিগার করা একটি কাস্টম বসন্ত ব্যবহার করতে পারে।

গোষ্ঠীটি তৈরি হয়ে গেলে, এটি ভিউতে ক্যাশে হয়ে যায় এবং অ্যানিমেশন দিয়ে বা অ্যানিমেশনকির সাহায্যে ট্রিগার করা যায়। একবার ট্রিগার করা অ্যানিমেশনটি সেই অনুযায়ী উপস্থাপনা স্তরের মানগুলি সিঙ্ক্রোনাইজ করা হয় এবং সে অনুযায়ী প্রয়োগ করা হয়।

ফ্রেমওয়ার্কটি এখানে ফ্লাইটএনিমেটর পাওয়া যাবে

এখানে নীচে একটি উদাহরণ দেওয়া হয়েছে:

struct AnimationKeys {
    static let StageOneAnimationKey  = "StageOneAnimationKey"
    static let StageTwoAnimationKey  = "StageTwoAnimationKey"
}

...

view.registerAnimation(forKey: AnimationKeys.StageOneAnimationKey, maker:  { (maker) in

    maker.animateBounds(toValue: newBounds,
                     duration: 0.5,
                     easingFunction: .EaseOutCubic)

    maker.animatePosition(toValue: newPosition,
                     duration: 0.5,
                     easingFunction: .EaseOutCubic)

    maker.triggerTimedAnimation(forKey: AnimationKeys.StageTwoAnimationKey,
                           onView: self.secondaryView,
                           atProgress: 0.5, 
                           maker: { (makerStageTwo) in

        makerStageTwo.animateBounds(withDuration: 0.5,
                             easingFunction: .EaseOutCubic,
                             toValue: newSecondaryBounds)

        makerStageTwo.animatePosition(withDuration: 0.5,
                             easingFunction: .EaseOutCubic,
                             toValue: newSecondaryCenter)
     })                    
})

অ্যানিমেশন ট্রিগার করতে

view.applyAnimation(forKey: AnimationKeys.StageOneAnimationKey)