All Projects → manofit → Babypiganimation

manofit / Babypiganimation

基本动画、位移动画、缩放动画、旋转动画、组动画、关键帧动画、贝塞尔曲线、进度条动画、复杂动画、OC动画、aniamtion、basicanimation等。

Programming Languages

swift
15916 projects
swift4
162 projects

Projects that are alternatives of or similar to Babypiganimation

Animatable Component
Animate once, use Everywhere! 💫
Stars: ✭ 188 (-2.08%)
Mutual labels:  animations, animation-library
Aaviewanimator
AAViewAnimator is a set of animations designed for UIView, UIButton, UIImageView with options in iOS, written in Swift.
Stars: ✭ 33 (-82.81%)
Mutual labels:  animations, animation-library
Xamanimation
Xamarin Forms Animation Library
Stars: ✭ 389 (+102.6%)
Mutual labels:  animations, animation-library
flutteranimations
Flutter login and signup screen with animations.
Stars: ✭ 34 (-82.29%)
Mutual labels:  ios-app, animations
Typewriterview
Android library for typewriter like effects
Stars: ✭ 124 (-35.42%)
Mutual labels:  animations, animation-library
Sequent
A simple continuous animation library for Android UI.
Stars: ✭ 263 (+36.98%)
Mutual labels:  animations, animation-library
Flightanimator
Advanced Natural Motion Animations, Simple Blocks Based Syntax
Stars: ✭ 588 (+206.25%)
Mutual labels:  animations, animation-library
Sequents
A simple continuous animation library for iOS UI.
Stars: ✭ 31 (-83.85%)
Mutual labels:  animations, animation-library
Elixir cli spinners
Spinnig Animations for Command Line Applications
Stars: ✭ 117 (-39.06%)
Mutual labels:  animations, animation-library
Sunset.css
This library offers a collection of different CSS-powered transitions.
Stars: ✭ 99 (-48.44%)
Mutual labels:  animations, animation-library
scrollxp
Alpine.js-esque library for scrolling animations on websites
Stars: ✭ 50 (-73.96%)
Mutual labels:  animations, animation-library
Geckolib
GeckoLib is an animation library for Minecraft Mods, with support for complex 3D keyframe and scriptable math-based animations. Available for Forge and Fabric (1.12, 1.15, 1.16). Supports entity, block, item, armor animations and more.
Stars: ✭ 131 (-31.77%)
Mutual labels:  animations, animation-library
react-native-swipe-cards-interaction
React native swipe cards interaction
Stars: ✭ 142 (-26.04%)
Mutual labels:  ios-app, animations
React Native Dating App
Dating app - Exponent and React Native
Stars: ✭ 352 (+83.33%)
Mutual labels:  ios-app, animations
android-helpers
Android helpers collection
Stars: ✭ 20 (-89.58%)
Mutual labels:  animations, animation-library
Flutter Examples
Personal collection of Flutter apps.
Stars: ✭ 394 (+105.21%)
Mutual labels:  demo, animations
Dynamic.css
🚀 Awesome Library of CSS3 animations 🎉
Stars: ✭ 38 (-80.21%)
Mutual labels:  animations, animation-library
kinieta
A Fast Animation Engine with an Intuitive API
Stars: ✭ 44 (-77.08%)
Mutual labels:  animations, animation-library
Rnal
Animations library for react-native
Stars: ✭ 54 (-71.87%)
Mutual labels:  animations, animation-library
Todayx
🌈Flutter App:🎊「今日份的X」(每天推荐一个:图片、诗歌、名言、音乐、乐评、高等数学、两种配色、化学方程式、Github Repo、知乎问题、文章)
Stars: ✭ 128 (-33.33%)
Mutual labels:  ios-app, demo

BabyPigAnimation

从简单的基础动画到复杂的组动画,原理一目了然。最后再加上几个常见动画,举一反三。

效果图

gif_1gif_2gif_3loveprogress

使用

  • 基础动画
//位移
-(void)makePositionAnimation{
    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"position"];
    animation.fromValue = [NSValue valueWithCGPoint:CGPointMake(50, SCREEN_HEIGHT/2-75)];
    animation.toValue = [NSValue valueWithCGPoint:CGPointMake(SCREEN_WIDTH-50, SCREEN_HEIGHT/2-75)];
    animation.duration = 1.0f;
    //animation.fillMode = kCAFillModeForwards;
    //animation.removedOnCompletion = NO;
    [self.babyView.layer addAnimation:animation forKey:@"positionAnimation"];
}
  • 关键帧动画
CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
NSValue *value_0 = [NSValue valueWithCGPoint:CGPointMake(50, SCREEN_HEIGHT/2-50)];
NSValue *value_1 = [NSValue valueWithCGPoint:CGPointMake(SCREEN_WIDTH/3, SCREEN_HEIGHT/2-50)];
NSValue *value_2 = [NSValue valueWithCGPoint:CGPointMake(SCREEN_WIDTH/3, SCREEN_HEIGHT/2+50)];
NSValue *value_3 = [NSValue valueWithCGPoint:CGPointMake(SCREEN_WIDTH*2/3, SCREEN_HEIGHT/2+50)];
NSValue *value_4 = [NSValue valueWithCGPoint:CGPointMake(SCREEN_WIDTH*2/3, SCREEN_HEIGHT/2-50)];
NSValue *value_5 = [NSValue valueWithCGPoint:CGPointMake(SCREEN_WIDTH-50, SCREEN_HEIGHT/2-50)];
animation.values = [NSArray arrayWithObjects:value_0,value_1,value_2,value_3,value_4,value_5, nil];
animation.duration = 2.0f;
[self.babyView.layer addAnimation:animation forKey:@"keyFrameAnimation"];
  • 组动画
CAKeyframeAnimation *positionAni = [CAKeyframeAnimation animationWithKeyPath:@"position"];
NSValue *value_0 = [NSValue valueWithCGPoint:CGPointMake(50, SCREEN_HEIGHT/2-50)];
NSValue *value_1 = [NSValue valueWithCGPoint:CGPointMake(SCREEN_WIDTH/3, SCREEN_HEIGHT/2-50)];
NSValue *value_2 = [NSValue valueWithCGPoint:CGPointMake(SCREEN_WIDTH/3, SCREEN_HEIGHT/2+50)];
NSValue *value_3 = [NSValue valueWithCGPoint:CGPointMake(SCREEN_WIDTH*2/3, SCREEN_HEIGHT/2+50)];
NSValue *value_4 = [NSValue valueWithCGPoint:CGPointMake(SCREEN_WIDTH*2/3, SCREEN_HEIGHT/2-50)];
NSValue *value_5 = [NSValue valueWithCGPoint:CGPointMake(SCREEN_WIDTH-50, SCREEN_HEIGHT/2-50)];
positionAni.values = [NSArray arrayWithObjects:value_0,value_1,value_2,value_3,value_4,value_5, nil];

CABasicAnimation *scaleAni = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
scaleAni.fromValue = [NSNumber numberWithFloat:0.8f];
scaleAni.toValue = [NSNumber numberWithFloat:2.0f];
    
CABasicAnimation *rotateAni = [CABasicAnimation animationWithKeyPath:@"transform.rotation"];
rotateAni.toValue = [NSNumber numberWithFloat:M_PI*4];
    
CAAnimationGroup *groupAni = [CAAnimationGroup animation];
groupAni.animations = [NSArray arrayWithObjects:positionAni,scaleAni,rotateAni, nil];
groupAni.duration = 4.0f;
[self.babyView.layer addAnimation:groupAni forKey:@"groupAnimation"];
  • 过渡动画
CATransition *transitionAni = [CATransition animation];
transitionAni.type = kCATransitionMoveIn;
transitionAni.subtype = kCATransitionFromRight;
transitionAni.duration = 1.0f;
[self.babyView.layer addAnimation:transitionAni forKey:@"moveInAnimation"];
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].