├── README ├── UIView+Visuals.h ├── CAMediaTimingFunction+AdditionalEquations.h ├── UIView+Visuals.m └── CAMediaTimingFunction+AdditionalEquations.m /README: -------------------------------------------------------------------------------- 1 | UIView Category wrapping some basic CALayer visual enhancements (Drop Shadows, Borders etc.). 2 | --- 3 | Note: Include QuartzCore.framework in your project! 4 | 5 | mail@boxedfolder.com 6 | 7 | --- 8 | 9 | UIView-Visuals is licensed under MIT License. Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: 10 | 11 | The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. 12 | 13 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. 14 | -------------------------------------------------------------------------------- /UIView+Visuals.h: -------------------------------------------------------------------------------- 1 | // 2 | // UIView+Visuals.h 3 | // 4 | // Created by Heiko Dreyer on 25.05.11. 5 | // Copyright 2011 boxedfolder.com. All rights reserved. 6 | // 7 | 8 | #import 9 | #import 10 | 11 | 12 | @interface UIView (Visuals) 13 | 14 | /* 15 | * Sets a corners with radius, given stroke size & color 16 | */ 17 | -(void)cornerRadius: (CGFloat)radius 18 | strokeSize: (CGFloat)size 19 | color: (UIColor *)color; 20 | 21 | /* 22 | * Draws shadow with properties 23 | */ 24 | -(void)shadowWithColor: (UIColor *)color 25 | offset: (CGSize)offset 26 | opacity: (CGFloat)opacity 27 | radius: (CGFloat)radius; 28 | 29 | /* 30 | * Removes from superview with fade 31 | */ 32 | -(void)removeFromSuperviewWithFadeDuration: (NSTimeInterval)duration; 33 | 34 | /* 35 | * Adds a subview with given transition & duration 36 | */ 37 | -(void)addSubview: (UIView *)view withTransition: (UIViewAnimationTransition)transition duration: (NSTimeInterval)duration; 38 | 39 | /* 40 | * Removes view from superview with given transition & duration 41 | */ 42 | -(void)removeFromSuperviewWithTransition: (UIViewAnimationTransition)transition duration: (NSTimeInterval)duration; 43 | 44 | /* 45 | * Rotates view by given angle. TimingFunction can be nil and defaults to kCAMediaTimingFunctionEaseInEaseOut. 46 | */ 47 | -(void)rotateByAngle: (CGFloat)angle 48 | duration: (NSTimeInterval)duration 49 | autoreverse: (BOOL)autoreverse 50 | repeatCount: (CGFloat)repeatCount 51 | timingFunction: (CAMediaTimingFunction *)timingFunction; 52 | 53 | /* 54 | * Moves view to point. TimingFunction can be nil and defaults to kCAMediaTimingFunctionEaseInEaseOut. 55 | */ 56 | -(void)moveToPoint: (CGPoint)newPoint 57 | duration: (NSTimeInterval)duration 58 | autoreverse: (BOOL)autoreverse 59 | repeatCount: (CGFloat)repeatCount 60 | timingFunction: (CAMediaTimingFunction *)timingFunction; 61 | 62 | @end 63 | -------------------------------------------------------------------------------- /CAMediaTimingFunction+AdditionalEquations.h: -------------------------------------------------------------------------------- 1 | // 2 | // CAMediaTimingFunction+AdditionalEquations.h 3 | // 4 | // Created by Heiko Dreyer on 02.04.12. 5 | // Copyright (c) 2012 boxedfolder.com. All rights reserved. 6 | // 7 | 8 | #import 9 | 10 | @interface CAMediaTimingFunction (AdditionalEquations) 11 | 12 | 13 | ///--------------------------------------------------------------------------------------- 14 | /// @name Circ Easing 15 | ///--------------------------------------------------------------------------------------- 16 | 17 | +(CAMediaTimingFunction *)easeInCirc; 18 | +(CAMediaTimingFunction *)easeOutCirc; 19 | +(CAMediaTimingFunction *)easeInOutCirc; 20 | 21 | ///--------------------------------------------------------------------------------------- 22 | /// @name Cubic Easing 23 | ///--------------------------------------------------------------------------------------- 24 | 25 | +(CAMediaTimingFunction *)easeInCubic; 26 | +(CAMediaTimingFunction *)easeOutCubic; 27 | +(CAMediaTimingFunction *)easeInOutCubic; 28 | 29 | ///--------------------------------------------------------------------------------------- 30 | /// @name Expo Easing 31 | ///--------------------------------------------------------------------------------------- 32 | 33 | +(CAMediaTimingFunction *)easeInExpo; 34 | +(CAMediaTimingFunction *)easeOutExpo; 35 | +(CAMediaTimingFunction *)easeInOutExpo; 36 | 37 | ///--------------------------------------------------------------------------------------- 38 | /// @name Quad Easing 39 | ///--------------------------------------------------------------------------------------- 40 | 41 | +(CAMediaTimingFunction *)easeInQuad; 42 | +(CAMediaTimingFunction *)easeOutQuad; 43 | +(CAMediaTimingFunction *)easeInOutQuad; 44 | 45 | ///--------------------------------------------------------------------------------------- 46 | /// @name Quart Easing 47 | ///--------------------------------------------------------------------------------------- 48 | 49 | +(CAMediaTimingFunction *)easeInQuart; 50 | +(CAMediaTimingFunction *)easeOutQuart; 51 | +(CAMediaTimingFunction *)easeInOutQuart; 52 | 53 | ///--------------------------------------------------------------------------------------- 54 | /// @name Quint Easing 55 | ///--------------------------------------------------------------------------------------- 56 | 57 | +(CAMediaTimingFunction *)easeInQuint; 58 | +(CAMediaTimingFunction *)easeOutQuint; 59 | +(CAMediaTimingFunction *)easeInOutQuint; 60 | 61 | ///--------------------------------------------------------------------------------------- 62 | /// @name Sine Easing 63 | ///--------------------------------------------------------------------------------------- 64 | 65 | +(CAMediaTimingFunction *)easeInSine; 66 | +(CAMediaTimingFunction *)easeOutSine; 67 | +(CAMediaTimingFunction *)easeInOutSine; 68 | 69 | ///--------------------------------------------------------------------------------------- 70 | /// @name Back Easing 71 | ///--------------------------------------------------------------------------------------- 72 | 73 | +(CAMediaTimingFunction *)easeInBack; 74 | +(CAMediaTimingFunction *)easeOutBack; 75 | +(CAMediaTimingFunction *)easeInOutBack; 76 | 77 | @end 78 | -------------------------------------------------------------------------------- /UIView+Visuals.m: -------------------------------------------------------------------------------- 1 | // 2 | // UIView+Visuals.m 3 | // 4 | // Created by Heiko Dreyer on 25.05.11. 5 | // Copyright 2011 boxedfolder.com. All rights reserved. 6 | // 7 | 8 | #import "UIView+Visuals.h" 9 | 10 | // Degree -> Rad 11 | #define degToRad(x) (M_PI * (x) / 180.0) 12 | 13 | @implementation UIView (Visuals) 14 | 15 | /////////////////////////////////////////////////////////////////////////////////////////////////// 16 | /////////////////////////////////////////////////////////////////////////////////////////////////// 17 | 18 | -(void)cornerRadius: (CGFloat)radius strokeSize: (CGFloat)size color: (UIColor *)color 19 | { 20 | self.layer.cornerRadius = radius; 21 | self.layer.borderColor = color.CGColor; 22 | self.layer.borderWidth = size; 23 | } 24 | 25 | /////////////////////////////////////////////////////////////////////////////////////////////////// 26 | 27 | -(void)shadowWithColor: (UIColor *)color 28 | offset: (CGSize)offset 29 | opacity: (CGFloat)opacity 30 | radius: (CGFloat)radius 31 | { 32 | self.clipsToBounds = NO; 33 | self.layer.shadowColor = color.CGColor; 34 | self.layer.shadowOffset = offset; 35 | self.layer.shadowOpacity = opacity; 36 | self.layer.shadowRadius = radius; 37 | } 38 | 39 | /////////////////////////////////////////////////////////////////////////////////////////////////// 40 | 41 | -(void)removeFromSuperviewWithFadeDuration: (NSTimeInterval)duration 42 | { 43 | [UIView beginAnimations: nil context: NULL]; 44 | [UIView setAnimationBeginsFromCurrentState: YES]; 45 | [UIView setAnimationDuration: duration]; 46 | [UIView setAnimationDelegate: self]; 47 | [UIView setAnimationDidStopSelector: @selector(removeFromSuperview)]; 48 | self.alpha = 0.0; 49 | [UIView commitAnimations]; 50 | } 51 | 52 | /////////////////////////////////////////////////////////////////////////////////////////////////// 53 | 54 | -(void)addSubview: (UIView *)subview withTransition: (UIViewAnimationTransition)transition duration: (NSTimeInterval)duration 55 | { 56 | [UIView beginAnimations: nil context: NULL]; 57 | [UIView setAnimationDuration: duration]; 58 | [UIView setAnimationTransition: transition forView: self cache: YES]; 59 | [self addSubview: subview]; 60 | [UIView commitAnimations]; 61 | } 62 | 63 | /////////////////////////////////////////////////////////////////////////////////////////////////// 64 | 65 | -(void)removeFromSuperviewWithTransition: (UIViewAnimationTransition)transition duration: (NSTimeInterval)duration 66 | { 67 | [UIView beginAnimations: nil context: NULL]; 68 | [UIView setAnimationDuration: duration]; 69 | [UIView setAnimationTransition: transition forView: self.superview cache: YES]; 70 | [self removeFromSuperview]; 71 | [UIView commitAnimations]; 72 | } 73 | 74 | /////////////////////////////////////////////////////////////////////////////////////////////////// 75 | 76 | -(void)rotateByAngle: (CGFloat)angle 77 | duration: (NSTimeInterval)duration 78 | autoreverse: (BOOL)autoreverse 79 | repeatCount: (CGFloat)repeatCount 80 | timingFunction: (CAMediaTimingFunction *)timingFunction 81 | { 82 | CABasicAnimation *rotation = [CABasicAnimation animationWithKeyPath: @"transform.rotation"]; 83 | rotation.toValue = [NSNumber numberWithFloat: degToRad(angle)]; 84 | rotation.duration = duration; 85 | rotation.repeatCount = repeatCount; 86 | rotation.autoreverses = autoreverse; 87 | rotation.removedOnCompletion = NO; 88 | rotation.fillMode = kCAFillModeBoth; 89 | rotation.timingFunction = timingFunction != nil ? timingFunction : [CAMediaTimingFunction functionWithName: kCAMediaTimingFunctionEaseInEaseOut]; 90 | [self.layer addAnimation: rotation forKey: @"rotationAnimation"]; 91 | } 92 | 93 | /////////////////////////////////////////////////////////////////////////////////////////////////// 94 | 95 | -(void)moveToPoint: (CGPoint)newPoint 96 | duration: (NSTimeInterval)duration 97 | autoreverse: (BOOL)autoreverse 98 | repeatCount: (CGFloat)repeatCount 99 | timingFunction: (CAMediaTimingFunction *)timingFunction 100 | { 101 | CABasicAnimation *move = [CABasicAnimation animationWithKeyPath: @"position"]; 102 | move.toValue = [NSValue valueWithCGPoint: newPoint]; 103 | move.duration = duration; 104 | move.removedOnCompletion = NO; 105 | move.repeatCount = repeatCount; 106 | move.autoreverses = autoreverse; 107 | move.fillMode = kCAFillModeBoth; 108 | move.timingFunction = timingFunction != nil ? timingFunction : [CAMediaTimingFunction functionWithName: kCAMediaTimingFunctionEaseInEaseOut]; 109 | [self.layer addAnimation: move forKey: @"positionAnimation"]; 110 | } 111 | 112 | 113 | @end 114 | -------------------------------------------------------------------------------- /CAMediaTimingFunction+AdditionalEquations.m: -------------------------------------------------------------------------------- 1 | // 2 | // CAMediaTimingFunction+AdditionalEquations.m 3 | // 4 | // Created by Heiko Dreyer on 02.04.12. 5 | // Copyright (c) 2012 boxedfolder.com. All rights reserved. 6 | // 7 | 8 | #import "CAMediaTimingFunction+AdditionalEquations.h" 9 | 10 | @implementation CAMediaTimingFunction (AdditionalEquations) 11 | 12 | /////////////////////////////////////////////////////////////////////////////////////////////////// 13 | /////////////////////////////////////////////////////////////////////////////////////////////////// 14 | 15 | #pragma mark - Circ 16 | 17 | +(CAMediaTimingFunction *)easeInCirc 18 | { 19 | return [CAMediaTimingFunction functionWithControlPoints: 0.6 : 0.04 : 0.98 : 0.335]; 20 | } 21 | 22 | /////////////////////////////////////////////////////////////////////////////////////////////////// 23 | 24 | +(CAMediaTimingFunction *)easeOutCirc 25 | { 26 | return [CAMediaTimingFunction functionWithControlPoints: 0.075 : 0.82 : 0.165 : 1.0]; 27 | } 28 | 29 | /////////////////////////////////////////////////////////////////////////////////////////////////// 30 | 31 | +(CAMediaTimingFunction *)easeInOutCirc 32 | { 33 | return [CAMediaTimingFunction functionWithControlPoints: 0.785 : 0.135 : 0.15 : 0.86]; 34 | } 35 | 36 | /////////////////////////////////////////////////////////////////////////////////////////////////// 37 | /////////////////////////////////////////////////////////////////////////////////////////////////// 38 | 39 | #pragma mark - Cubic 40 | 41 | +(CAMediaTimingFunction *)easeInCubic 42 | { 43 | return [CAMediaTimingFunction functionWithControlPoints: 0.55 : 0.055 : 0.675 : 0.19]; 44 | } 45 | 46 | /////////////////////////////////////////////////////////////////////////////////////////////////// 47 | 48 | +(CAMediaTimingFunction *)easeOutCubic 49 | { 50 | return [CAMediaTimingFunction functionWithControlPoints: 0.215 : 0.61 : 0.355 : 1.0]; 51 | } 52 | 53 | /////////////////////////////////////////////////////////////////////////////////////////////////// 54 | 55 | +(CAMediaTimingFunction *)easeInOutCubic 56 | { 57 | return [CAMediaTimingFunction functionWithControlPoints: 0.645 : 0.045 : 0.355 : 1.0]; 58 | } 59 | 60 | /////////////////////////////////////////////////////////////////////////////////////////////////// 61 | /////////////////////////////////////////////////////////////////////////////////////////////////// 62 | 63 | #pragma mark - Expo 64 | 65 | +(CAMediaTimingFunction *)easeInExpo 66 | { 67 | return [CAMediaTimingFunction functionWithControlPoints: 0.95 : 0.05 : 0.795 : 0.035]; 68 | } 69 | 70 | /////////////////////////////////////////////////////////////////////////////////////////////////// 71 | 72 | +(CAMediaTimingFunction *)easeOutExpo 73 | { 74 | return [CAMediaTimingFunction functionWithControlPoints: 0.19 : 1.0 : 0.22 : 1.0]; 75 | } 76 | 77 | /////////////////////////////////////////////////////////////////////////////////////////////////// 78 | 79 | +(CAMediaTimingFunction *)easeInOutExpo 80 | { 81 | return [CAMediaTimingFunction functionWithControlPoints: 1.0 : 0.0 : 0.0 : 1.0]; 82 | } 83 | 84 | /////////////////////////////////////////////////////////////////////////////////////////////////// 85 | /////////////////////////////////////////////////////////////////////////////////////////////////// 86 | 87 | #pragma mark - Quad 88 | 89 | +(CAMediaTimingFunction *)easeInQuad 90 | { 91 | return [CAMediaTimingFunction functionWithControlPoints: 0.55 : 0.085 : 0.68 : 0.53]; 92 | } 93 | 94 | /////////////////////////////////////////////////////////////////////////////////////////////////// 95 | 96 | +(CAMediaTimingFunction *)easeOutQuad 97 | { 98 | return [CAMediaTimingFunction functionWithControlPoints: 0.25 : 0.46 : 0.45 : 0.94]; 99 | } 100 | 101 | /////////////////////////////////////////////////////////////////////////////////////////////////// 102 | 103 | +(CAMediaTimingFunction *)easeInOutQuad 104 | { 105 | return [CAMediaTimingFunction functionWithControlPoints: 0.455 : 0.03 : 0.515 : 0.955]; 106 | } 107 | 108 | /////////////////////////////////////////////////////////////////////////////////////////////////// 109 | /////////////////////////////////////////////////////////////////////////////////////////////////// 110 | 111 | #pragma mark - Quart 112 | 113 | +(CAMediaTimingFunction *)easeInQuart 114 | { 115 | return [CAMediaTimingFunction functionWithControlPoints: 0.895 : 0.03 : 0.685 : 0.22]; 116 | } 117 | 118 | /////////////////////////////////////////////////////////////////////////////////////////////////// 119 | 120 | +(CAMediaTimingFunction *)easeOutQuart 121 | { 122 | return [CAMediaTimingFunction functionWithControlPoints: 0.165 : 0.84 : 0.44 : 1.0]; 123 | } 124 | 125 | /////////////////////////////////////////////////////////////////////////////////////////////////// 126 | 127 | +(CAMediaTimingFunction *)easeInOutQuart 128 | { 129 | return [CAMediaTimingFunction functionWithControlPoints: 0.77 : 0.0 : 0.175 : 1.0]; 130 | } 131 | 132 | /////////////////////////////////////////////////////////////////////////////////////////////////// 133 | /////////////////////////////////////////////////////////////////////////////////////////////////// 134 | 135 | #pragma mark - Quint 136 | 137 | +(CAMediaTimingFunction *)easeInQuint 138 | { 139 | return [CAMediaTimingFunction functionWithControlPoints: 0.755 : 0.05 : 0.855 : 0.06]; 140 | } 141 | 142 | /////////////////////////////////////////////////////////////////////////////////////////////////// 143 | 144 | +(CAMediaTimingFunction *)easeOutQuint 145 | { 146 | return [CAMediaTimingFunction functionWithControlPoints: 0.23 : 1.0 : 0.320 : 1.0]; 147 | } 148 | 149 | /////////////////////////////////////////////////////////////////////////////////////////////////// 150 | 151 | +(CAMediaTimingFunction *)easeInOutQuint 152 | { 153 | return [CAMediaTimingFunction functionWithControlPoints: 0.86 : 0.0 : 0.07 : 1.0]; 154 | } 155 | 156 | /////////////////////////////////////////////////////////////////////////////////////////////////// 157 | /////////////////////////////////////////////////////////////////////////////////////////////////// 158 | 159 | #pragma mark - Sine 160 | 161 | +(CAMediaTimingFunction *)easeInSine 162 | { 163 | return [CAMediaTimingFunction functionWithControlPoints: 0.47 : 0.0 : 0.745 : 0.715]; 164 | } 165 | 166 | /////////////////////////////////////////////////////////////////////////////////////////////////// 167 | 168 | +(CAMediaTimingFunction *)easeOutSine 169 | { 170 | return [CAMediaTimingFunction functionWithControlPoints: 0.39 : 0.575 : 0.565 : 1.0]; 171 | } 172 | 173 | /////////////////////////////////////////////////////////////////////////////////////////////////// 174 | 175 | +(CAMediaTimingFunction *)easeInOutSine 176 | { 177 | return [CAMediaTimingFunction functionWithControlPoints: 0.445 : 0.05 : 0.55 : 0.95]; 178 | } 179 | 180 | /////////////////////////////////////////////////////////////////////////////////////////////////// 181 | /////////////////////////////////////////////////////////////////////////////////////////////////// 182 | 183 | #pragma mark - Back 184 | 185 | +(CAMediaTimingFunction *)easeInBack 186 | { 187 | return [CAMediaTimingFunction functionWithControlPoints: 0.6 : -0.28 : 0.735 : 0.045]; 188 | } 189 | 190 | /////////////////////////////////////////////////////////////////////////////////////////////////// 191 | 192 | +(CAMediaTimingFunction *)easeOutBack 193 | { 194 | return [CAMediaTimingFunction functionWithControlPoints: 0.175 : 0.885 : 0.320 : 1.275]; 195 | } 196 | 197 | /////////////////////////////////////////////////////////////////////////////////////////////////// 198 | 199 | +(CAMediaTimingFunction *)easeInOutBack 200 | { 201 | return [CAMediaTimingFunction functionWithControlPoints: 0.68 : -0.55 : 0.265 : 1.55]; 202 | } 203 | 204 | @end 205 | --------------------------------------------------------------------------------