├── rippleEffectView1.gif ├── rippleEffectView2.gif ├── rippleEffectView3.gif ├── Demo ├── RippleEffectDemo │ ├── Assets.xcassets │ │ ├── Contents.json │ │ ├── 1.imageset │ │ │ ├── 1.png │ │ │ ├── circle.png │ │ │ └── Contents.json │ │ ├── cell-image.imageset │ │ │ ├── cell-image.png │ │ │ └── Contents.json │ │ └── AppIcon.appiconset │ │ │ └── Contents.json │ ├── Info.plist │ ├── Base.lproj │ │ ├── Main.storyboard │ │ └── LaunchScreen.storyboard │ ├── AppDelegate.swift │ ├── ViewController.swift │ └── RippleEffectView.swift └── RippleEffectDemo.xcodeproj │ └── project.pbxproj ├── LICENSE ├── RippleEffectView.podspec ├── .gitignore ├── README.md └── RippleEffectView └── RippleEffectView.swift /rippleEffectView1.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/alsedi/RippleEffectView/HEAD/rippleEffectView1.gif -------------------------------------------------------------------------------- /rippleEffectView2.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/alsedi/RippleEffectView/HEAD/rippleEffectView2.gif -------------------------------------------------------------------------------- /rippleEffectView3.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/alsedi/RippleEffectView/HEAD/rippleEffectView3.gif -------------------------------------------------------------------------------- /Demo/RippleEffectDemo/Assets.xcassets/Contents.json: -------------------------------------------------------------------------------- 1 | { 2 | "info" : { 3 | "version" : 1, 4 | "author" : "xcode" 5 | } 6 | } -------------------------------------------------------------------------------- /Demo/RippleEffectDemo/Assets.xcassets/1.imageset/1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/alsedi/RippleEffectView/HEAD/Demo/RippleEffectDemo/Assets.xcassets/1.imageset/1.png -------------------------------------------------------------------------------- /Demo/RippleEffectDemo/Assets.xcassets/1.imageset/circle.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/alsedi/RippleEffectView/HEAD/Demo/RippleEffectDemo/Assets.xcassets/1.imageset/circle.png -------------------------------------------------------------------------------- /Demo/RippleEffectDemo/Assets.xcassets/cell-image.imageset/cell-image.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/alsedi/RippleEffectView/HEAD/Demo/RippleEffectDemo/Assets.xcassets/cell-image.imageset/cell-image.png -------------------------------------------------------------------------------- /Demo/RippleEffectDemo/Assets.xcassets/cell-image.imageset/Contents.json: -------------------------------------------------------------------------------- 1 | { 2 | "images" : [ 3 | { 4 | "idiom" : "universal", 5 | "filename" : "cell-image.png", 6 | "scale" : "1x" 7 | }, 8 | { 9 | "idiom" : "universal", 10 | "scale" : "2x" 11 | }, 12 | { 13 | "idiom" : "universal", 14 | "scale" : "3x" 15 | } 16 | ], 17 | "info" : { 18 | "version" : 1, 19 | "author" : "xcode" 20 | }, 21 | "properties" : { 22 | "template-rendering-intent" : "template" 23 | } 24 | } -------------------------------------------------------------------------------- /Demo/RippleEffectDemo/Assets.xcassets/1.imageset/Contents.json: -------------------------------------------------------------------------------- 1 | { 2 | "images" : [ 3 | { 4 | "idiom" : "iphone", 5 | "scale" : "1x" 6 | }, 7 | { 8 | "idiom" : "iphone", 9 | "scale" : "2x" 10 | }, 11 | { 12 | "idiom" : "iphone", 13 | "filename" : "circle.png", 14 | "scale" : "3x" 15 | }, 16 | { 17 | "idiom" : "ipad", 18 | "scale" : "1x" 19 | }, 20 | { 21 | "idiom" : "ipad", 22 | "filename" : "1.png", 23 | "scale" : "2x" 24 | } 25 | ], 26 | "info" : { 27 | "version" : 1, 28 | "author" : "xcode" 29 | } 30 | } -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | Copyright (c) 2016 Alex Sergeev alex@alsedi.com 2 | 3 | Permission is hereby granted, free of charge, to any person obtaining a copy 4 | of this software and associated documentation files (the "Software"), to deal 5 | in the Software without restriction, including without limitation the rights 6 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 7 | copies of the Software, and to permit persons to whom the Software is 8 | furnished to do so, subject to the following conditions: 9 | 10 | The above copyright notice and this permission notice shall be included in 11 | all copies or substantial portions of the Software. 12 | 13 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 14 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 15 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 16 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 17 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 18 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 19 | THE SOFTWARE. 20 | -------------------------------------------------------------------------------- /RippleEffectView.podspec: -------------------------------------------------------------------------------- 1 | # 2 | # Initial version created by Maximilian Alexander 3 | # 4 | 5 | Pod::Spec.new do |s| 6 | s.name = 'RippleEffectView' 7 | s.version = '1.0.2' 8 | s.summary = 'RippleEffectView - A Neat Rippling View Effect' 9 | s.description = <<-DESC 10 | RippleEffectView inspired by [https://www.raywenderlich.com/133224/how-to-create-an-uber-splash-screen](RayWenderlich.com) article How To Create an Uber Splash Screen 11 | DESC 12 | s.homepage = 'https://github.com/alsedi/RippleEffectView' 13 | s.screenshots = 'https://raw.githubusercontent.com/alsedi/RippleEffectView/master/rippleEffectView1.gif', 'https://raw.githubusercontent.com/alsedi/RippleEffectView/master/rippleEffectView2.gif' 14 | s.license = { :type => 'MIT', :file => 'LICENSE' } 15 | s.authors = { 'Alex Sergev' => ' alex@alsedi.com' } 16 | s.source = { :git => 'https://github.com/alsedi/RippleEffectView.git', :tag => s.version.to_s } 17 | s.ios.deployment_target = '8.0' 18 | s.source_files = 'RippleEffectView/RippleEffectView.swift' 19 | 20 | s.frameworks = 'UIKit' 21 | end 22 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Xcode 2 | # 3 | # gitignore contributors: remember to update Global/Xcode.gitignore, Objective-C.gitignore & Swift.gitignore 4 | 5 | ## Build generated 6 | build/ 7 | DerivedData/ 8 | 9 | ## Various settings 10 | *.pbxuser 11 | !default.pbxuser 12 | *.mode1v3 13 | !default.mode1v3 14 | *.mode2v3 15 | !default.mode2v3 16 | *.perspectivev3 17 | !default.perspectivev3 18 | xcuserdata/ 19 | 20 | ## Other 21 | *.moved-aside 22 | *.xcuserstate 23 | 24 | ## Obj-C/Swift specific 25 | *.hmap 26 | *.ipa 27 | *.dSYM.zip 28 | *.dSYM 29 | 30 | ## Playgrounds 31 | timeline.xctimeline 32 | playground.xcworkspace 33 | 34 | # Swift Package Manager 35 | # 36 | # Add this line if you want to avoid checking in source code from Swift Package Manager dependencies. 37 | # Packages/ 38 | .build/ 39 | 40 | # CocoaPods 41 | # 42 | # We recommend against adding the Pods directory to your .gitignore. However 43 | # you should judge for yourself, the pros and cons are mentioned at: 44 | # https://guides.cocoapods.org/using/using-cocoapods.html#should-i-check-the-pods-directory-into-source-control 45 | # 46 | # Pods/ 47 | 48 | # Carthage 49 | # 50 | # Add this line if you want to avoid checking in source code from Carthage dependencies. 51 | # Carthage/Checkouts 52 | 53 | Carthage/Build 54 | 55 | # fastlane 56 | # 57 | # It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the 58 | # screenshots whenever they are needed. 59 | # For more information about the recommended setup visit: 60 | # https://github.com/fastlane/fastlane/blob/master/fastlane/docs/Gitignore.md 61 | 62 | fastlane/report.xml 63 | fastlane/Preview.html 64 | fastlane/screenshots 65 | fastlane/test_output 66 | -------------------------------------------------------------------------------- /Demo/RippleEffectDemo/Info.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | CFBundleDevelopmentRegion 6 | en 7 | CFBundleExecutable 8 | $(EXECUTABLE_NAME) 9 | CFBundleIdentifier 10 | $(PRODUCT_BUNDLE_IDENTIFIER) 11 | CFBundleInfoDictionaryVersion 12 | 6.0 13 | CFBundleName 14 | $(PRODUCT_NAME) 15 | CFBundlePackageType 16 | APPL 17 | CFBundleShortVersionString 18 | 1.0 19 | CFBundleSignature 20 | ???? 21 | CFBundleVersion 22 | 1 23 | LSRequiresIPhoneOS 24 | 25 | UILaunchStoryboardName 26 | LaunchScreen 27 | UIMainStoryboardFile 28 | Main 29 | UIRequiredDeviceCapabilities 30 | 31 | armv7 32 | 33 | UISupportedInterfaceOrientations 34 | 35 | UIInterfaceOrientationPortrait 36 | UIInterfaceOrientationLandscapeLeft 37 | UIInterfaceOrientationLandscapeRight 38 | 39 | UISupportedInterfaceOrientations~ipad 40 | 41 | UIInterfaceOrientationPortrait 42 | UIInterfaceOrientationPortraitUpsideDown 43 | UIInterfaceOrientationLandscapeLeft 44 | UIInterfaceOrientationLandscapeRight 45 | 46 | 47 | 48 | -------------------------------------------------------------------------------- /Demo/RippleEffectDemo/Base.lproj/Main.storyboard: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /Demo/RippleEffectDemo/Base.lproj/LaunchScreen.storyboard: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /Demo/RippleEffectDemo/Assets.xcassets/AppIcon.appiconset/Contents.json: -------------------------------------------------------------------------------- 1 | { 2 | "images" : [ 3 | { 4 | "idiom" : "iphone", 5 | "size" : "20x20", 6 | "scale" : "2x" 7 | }, 8 | { 9 | "idiom" : "iphone", 10 | "size" : "20x20", 11 | "scale" : "3x" 12 | }, 13 | { 14 | "idiom" : "iphone", 15 | "size" : "29x29", 16 | "scale" : "2x" 17 | }, 18 | { 19 | "idiom" : "iphone", 20 | "size" : "29x29", 21 | "scale" : "3x" 22 | }, 23 | { 24 | "idiom" : "iphone", 25 | "size" : "40x40", 26 | "scale" : "2x" 27 | }, 28 | { 29 | "idiom" : "iphone", 30 | "size" : "40x40", 31 | "scale" : "3x" 32 | }, 33 | { 34 | "idiom" : "iphone", 35 | "size" : "60x60", 36 | "scale" : "2x" 37 | }, 38 | { 39 | "idiom" : "iphone", 40 | "size" : "60x60", 41 | "scale" : "3x" 42 | }, 43 | { 44 | "idiom" : "ipad", 45 | "size" : "20x20", 46 | "scale" : "1x" 47 | }, 48 | { 49 | "idiom" : "ipad", 50 | "size" : "20x20", 51 | "scale" : "2x" 52 | }, 53 | { 54 | "idiom" : "ipad", 55 | "size" : "29x29", 56 | "scale" : "1x" 57 | }, 58 | { 59 | "idiom" : "ipad", 60 | "size" : "29x29", 61 | "scale" : "2x" 62 | }, 63 | { 64 | "idiom" : "ipad", 65 | "size" : "40x40", 66 | "scale" : "1x" 67 | }, 68 | { 69 | "idiom" : "ipad", 70 | "size" : "40x40", 71 | "scale" : "2x" 72 | }, 73 | { 74 | "idiom" : "ipad", 75 | "size" : "76x76", 76 | "scale" : "1x" 77 | }, 78 | { 79 | "idiom" : "ipad", 80 | "size" : "76x76", 81 | "scale" : "2x" 82 | }, 83 | { 84 | "idiom" : "ipad", 85 | "size" : "83.5x83.5", 86 | "scale" : "2x" 87 | } 88 | ], 89 | "info" : { 90 | "version" : 1, 91 | "author" : "xcode" 92 | } 93 | } -------------------------------------------------------------------------------- /Demo/RippleEffectDemo/AppDelegate.swift: -------------------------------------------------------------------------------- 1 | // 2 | // AppDelegate.swift 3 | // RippleEffectDemo 4 | // 5 | // Created by Alex Sergeev on 8/21/16. 6 | // Copyright © 2016 ALSEDI Group. All rights reserved. 7 | // 8 | // Permission is hereby granted, free of charge, to any person obtaining a copy 9 | // of this software and associated documentation files (the "Software"), to deal 10 | // in the Software without restriction, including without limitation the rights 11 | // to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 12 | // copies of the Software, and to permit persons to whom the Software is 13 | // furnished to do so, subject to the following conditions: 14 | // 15 | // The above copyright notice and this permission notice shall be included in all 16 | // copies or substantial portions of the Software. 17 | // 18 | // THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 19 | // IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 20 | // FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 21 | // AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 22 | // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 23 | // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 24 | // SOFTWARE. 25 | // 26 | 27 | import UIKit 28 | 29 | @UIApplicationMain 30 | class AppDelegate: UIResponder, UIApplicationDelegate { 31 | 32 | var window: UIWindow? 33 | 34 | 35 | func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool { 36 | // Override point for customization after application launch. 37 | return true 38 | } 39 | 40 | func applicationWillResignActive(_ application: UIApplication) { 41 | // Sent when the application is about to move from active to inactive state. This can occur for certain types of temporary interruptions (such as an incoming phone call or SMS message) or when the user quits the application and it begins the transition to the background state. 42 | // Use this method to pause ongoing tasks, disable timers, and throttle down OpenGL ES frame rates. Games should use this method to pause the game. 43 | } 44 | 45 | func applicationDidEnterBackground(_ application: UIApplication) { 46 | // Use this method to release shared resources, save user data, invalidate timers, and store enough application state information to restore your application to its current state in case it is terminated later. 47 | // If your application supports background execution, this method is called instead of applicationWillTerminate: when the user quits. 48 | } 49 | 50 | func applicationWillEnterForeground(_ application: UIApplication) { 51 | // Called as part of the transition from the background to the inactive state; here you can undo many of the changes made on entering the background. 52 | } 53 | 54 | func applicationDidBecomeActive(_ application: UIApplication) { 55 | // Restart any tasks that were paused (or not yet started) while the application was inactive. If the application was previously in the background, optionally refresh the user interface. 56 | } 57 | 58 | func applicationWillTerminate(_ application: UIApplication) { 59 | // Called when the application is about to terminate. Save data if appropriate. See also applicationDidEnterBackground:. 60 | } 61 | 62 | 63 | } 64 | 65 | -------------------------------------------------------------------------------- /Demo/RippleEffectDemo/ViewController.swift: -------------------------------------------------------------------------------- 1 | // 2 | // ViewController.swift 3 | // RippleEffectDemo 4 | // 5 | // Created by Alex Sergeev on 8/21/16. 6 | // Copyright © 2016 ALSEDI Group. All rights reserved. 7 | // 8 | // Permission is hereby granted, free of charge, to any person obtaining a copy 9 | // of this software and associated documentation files (the "Software"), to deal 10 | // in the Software without restriction, including without limitation the rights 11 | // to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 12 | // copies of the Software, and to permit persons to whom the Software is 13 | // furnished to do so, subject to the following conditions: 14 | // 15 | // The above copyright notice and this permission notice shall be included in all 16 | // copies or substantial portions of the Software. 17 | // 18 | // THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 19 | // IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 20 | // FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 21 | // AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 22 | // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 23 | // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 24 | // SOFTWARE. 25 | 26 | import UIKit 27 | 28 | extension UIColor { 29 | static var random: UIColor { 30 | get { 31 | let hue = CGFloat(Double(arc4random() % 360) / 360.0) // 0.0 to 1.0 32 | let saturation: CGFloat = 0.7 33 | let brightness: CGFloat = 0.8 34 | return UIColor(hue: hue, saturation: saturation, brightness: brightness, alpha: 1.0) 35 | } 36 | } 37 | } 38 | 39 | class ViewController: UIViewController { 40 | var rippleEffectView: RippleEffectView! 41 | 42 | override var prefersStatusBarHidden : Bool { 43 | return true 44 | } 45 | 46 | override func viewDidLoad() { 47 | rippleEffectView = RippleEffectView() 48 | rippleEffectView.tileImage = UIImage(named: "cell-image") 49 | rippleEffectView.magnitude = 0.2 50 | rippleEffectView.cellSize = CGSize(width:50, height:50) 51 | rippleEffectView.rippleType = .heartbeat 52 | view.addSubview(rippleEffectView) 53 | 54 | //Example, simple tile image customization 55 | /* 56 | rippleEffectView.tileImageCustomizationClosure = {rows, columns, row, column, image in 57 | if (row % 2 == 0 && column % 2 == 0) { 58 | let newImage = image.imageWithRenderingMode(UIImageRenderingMode.AlwaysTemplate) 59 | UIGraphicsBeginImageContextWithOptions(image.size, false, newImage.scale) 60 | UIColor.random.set() 61 | newImage.drawInRect(CGRectMake(0, 0, image.size.width, newImage.size.height)); 62 | if let titledImage = UIGraphicsGetImageFromCurrentImageContext() { 63 | UIGraphicsEndImageContext() 64 | return titledImage 65 | } 66 | UIGraphicsEndImageContext() 67 | } 68 | return image 69 | } 70 | */ 71 | 72 | //Example 2: Complex tile image customization 73 | rippleEffectView.tileImageCustomizationClosure = { rows, columns, row, column, image in 74 | let newImage = image.withRenderingMode(UIImageRenderingMode.alwaysTemplate) 75 | UIGraphicsBeginImageContextWithOptions(image.size, false, newImage.scale) 76 | 77 | let xmiddle = (columns % 2 != 0) ? columns/2 : columns/2 + 1 78 | let ymiddle = (rows % 2 != 0) ? rows/2 : rows/2 + 1 79 | 80 | let xoffset = abs(xmiddle - column) 81 | let yoffset = abs(ymiddle - row) 82 | 83 | UIColor(hue: 206/360.0, saturation: 1, brightness: 0.95, alpha: 1).withAlphaComponent(1.0 - CGFloat((xoffset + yoffset)) * 0.1).set() 84 | 85 | newImage.draw(in: CGRect(x: 0, y: 0, width: image.size.width, height: newImage.size.height)); 86 | if let titledImage = UIGraphicsGetImageFromCurrentImageContext() { 87 | UIGraphicsEndImageContext() 88 | return titledImage 89 | } 90 | UIGraphicsEndImageContext() 91 | return image 92 | } 93 | 94 | 95 | 96 | rippleEffectView.setupView() 97 | rippleEffectView.animationDidStop = { [unowned self] in 98 | //Each time animation sequency finished this callback will change background of the wrapper view. 99 | UIView.animate(withDuration: 1.5, animations: { _ in 100 | self.rippleEffectView.backgroundColor = UIColor.random.withAlphaComponent(0.25) 101 | }) 102 | } 103 | } 104 | 105 | override func viewDidAppear(_ animated: Bool) { 106 | rippleEffectView.startAnimating() 107 | } 108 | } 109 | 110 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # RippleEffectView 2 | Not only Uber-like animated screen background. 3 | 4 | [![Swift 3.0](https://img.shields.io/badge/Swift-3.x-orange.svg?style=flat)](https://developer.apple.com/swift/) 5 | [![Pod](https://img.shields.io/cocoapods/p/RippleEffectView.svg?style=flat)](http://cocoapods.org/pods/RippleEffectView) 6 | [![Twitter](https://img.shields.io/badge/Twitter-@ALSEDI-blue.svg?style=flat)](http://twitter.com/alsedi) 7 | [![Blog](https://img.shields.io/badge/Blog-ALSEDI-green.svg?style=flat)](http://blog.alsedi.com) 8 | 9 | RippleEffectView inspired by RayWenderlich.com article [How To Create an Uber Splash Screen](https://www.raywenderlich.com/133224/how-to-create-an-uber-splash-screen) 10 | 11 | ## How it may looks like 12 | ### Basic customization (color randomization) 13 | ``` swift 14 | rippleEffectView.tileImageRandomizationClosure = { rows, columns, row, column, image in 15 | let newImage = image.imageWithRenderingMode(UIImageRenderingMode.AlwaysTemplate) 16 | UIGraphicsBeginImageContextWithOptions(image.size, false, newImage.scale) 17 | UIColor.random.set() 18 | newImage.drawInRect(CGRectMake(0, 0, image.size.width, newImage.size.height)); 19 | if let titledImage = UIGraphicsGetImageFromCurrentImageContext() { 20 | UIGraphicsEndImageContext() 21 | return titledImage 22 | } 23 | UIGraphicsEndImageContext() 24 | return image 25 | } 26 | ``` 27 | ``` swift 28 | rippleEffectView.magnitude = -0.6 29 | ``` 30 | ![rippleEffectView.magnitude = -0.6](rippleEffectView1.gif) 31 | 32 | ``` swift 33 | rippleEffectView.magnitude = 0.2 34 | ``` 35 | ![rippleEffectView.magnitude = 0.2](rippleEffectView2.gif) 36 | 37 | ### Complex customization 38 | ``` swift 39 | rippleEffectView.tileImageCustomizationClosure = { rows, columns, row, column, image in 40 | let newImage = image.imageWithRenderingMode(UIImageRenderingMode.AlwaysTemplate) 41 | UIGraphicsBeginImageContextWithOptions(image.size, false, newImage.scale) 42 | 43 | let xmiddle = (columns % 2 != 0) ? columns/2 : columns/2 + 1 44 | let ymiddle = (rows % 2 != 0) ? rows/2 : rows/2 + 1 45 | 46 | let xoffset = abs(xmiddle - column) 47 | let yoffset = abs(ymiddle - row) 48 | 49 | UIColor(hue: 206/360.0, saturation: 1, brightness: 0.95, alpha: 1).colorWithAlphaComponent(1.0 - CGFloat((xoffset + yoffset)) * 0.1).set() 50 | 51 | newImage.drawInRect(CGRectMake(0, 0, image.size.width, newImage.size.height)); 52 | if let titledImage = UIGraphicsGetImageFromCurrentImageContext() { 53 | UIGraphicsEndImageContext() 54 | return titledImage 55 | } 56 | UIGraphicsEndImageContext() 57 | return image 58 | } 59 | ``` 60 | ``` swift 61 | rippleEffectView.rippleType = .Heartbeat 62 | rippleEffectView.magnitude = 0.2 63 | ``` 64 | ![rippleEffectView.magnitude = 0.2](rippleEffectView3.gif) 65 | 66 | 67 | ## Requirements 68 | - Swift 3.0+ 69 | - iOS 9.3+ 70 | - Xcode 8.0+ 71 | 72 | # Installation 73 | 74 | ## CocoaPods 75 | RippleEffectView is available through [CocoaPods](http://cocoapods.org/pods/RippleEffectView). To install 76 | it, simply add the following line to your Podfile: 77 | 78 | ```ruby 79 | target 'Your Project' do 80 | use_frameworks! 81 | pod "RippleEffectView" 82 | end 83 | ``` 84 | 85 | ### Manual 86 | Copy `RippleEffectView.swift`to your project, then 87 | 88 | #Usage 89 | Add new RippleEffectView, assign `tileImage` and call `startAnimating()`. 90 | ``` swift 91 | rippleEffectView = RippleEffectView() 92 | rippleEffectView.tileImage = UIImage(named: "some image") 93 | rippleEffectView.magnitude = 0.2 94 | rippleEffectView.cellSize = CGSize(width:50, height:50) 95 | rippleEffectView.rippleType = .heartbeat 96 | view.addSubview(rippleEffectView) 97 | ``` 98 | NB! startAnimating doesn't work if called in viewDidLoad and viewWillAppear. Working on fix. Place `startAnimating()` in `viewDidAppear()` 99 | 100 | ## Configurable properties 101 | NB! RippleEffectView initialize itself with parent view bounds automatically, so you do not need to set it manually. If you need to use it in limited view, then use auxiliary view, e.g. 102 | 103 | Animation uses `transform`, `scale` and `opacity`. 104 | 105 | ### Special properties 106 | 1. `tileImage` UIImage that will displayed in every title. RippleEffectView uses size of image to calculate grid size. No default value. 107 | 2. `animationDuraton`. Default `3.5` 108 | 3. `magnitude` force that will be applied to every circle to create ripple effect. Uber-like effect is about `0.1` - `0.2`. GIF example `-0.8` 109 | 4. `cellSize` size of tile. Could be helpful if vector image used. Property is optional, if not set then tileImage size will be used. 110 | 5. `rippleType` Type of ripple effect. `.OneWave` and `.Heartbeat`. Default `.OneWave` 111 | 112 | ##Read-only properties 113 | 1. `rows` rows count 114 | 2. `columns` columns count 115 | 116 | ## Methods 117 | `stopAnimating` Start ripple animation 118 | `startAnimating` Stop all animations 119 | 120 | ### Manual control of the grid. 121 | You will need this if you change `tileImageRandomizationClosure`. When you call `renderGrid` to recreate all items. 122 | If you want just remove all items (e.g. memory warning) then call `removeGrid` 123 | 124 | ## Callbacks 125 | ### Tile image customization. 126 | 127 | You may setup image for each grid view individually, or customize one that assigned in `tileImage`. (See Demo project for example code) 128 | ``` swift 129 | var tileImageRandomizationClosure: RandomizationClosure? = (totalRows:Int, totalColumns:Int, currentRow:Int, currentColumn:Int, originalImage:UIImage)->(UIImage) 130 | ``` 131 | 132 | ### Animation Finished 133 | Main purpose of this component is to create animated screen background. You may stop animation and hide a screen as soon as data available, or wait for the animation end and the show the data. 134 | ``` swift 135 | rippleEffectView.animationDidStop = { _ in 136 | // do something 137 | } 138 | ``` 139 | -------------------------------------------------------------------------------- /Demo/RippleEffectDemo/RippleEffectView.swift: -------------------------------------------------------------------------------- 1 | // 2 | // RippleEffectView.swift 3 | // RippleEffectView 4 | // 5 | // Created by Alex Sergeev on 8/14/16. 6 | // Copyright © 2016 ALSEDI Group. All rights reserved. 7 | // 8 | // Permission is hereby granted, free of charge, to any person obtaining a copy 9 | // of this software and associated documentation files (the "Software"), to deal 10 | // in the Software without restriction, including without limitation the rights 11 | // to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 12 | // copies of the Software, and to permit persons to whom the Software is 13 | // furnished to do so, subject to the following conditions: 14 | // 15 | // The above copyright notice and this permission notice shall be included in all 16 | // copies or substantial portions of the Software. 17 | // 18 | // THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 19 | // IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 20 | // FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 21 | // AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 22 | // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 23 | // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 24 | // SOFTWARE. 25 | 26 | import UIKit 27 | 28 | enum RippleType { 29 | case oneWave 30 | case heartbeat 31 | } 32 | 33 | @IBDesignable 34 | class RippleEffectView: UIView { 35 | typealias CustomizationClosure = (_ totalRows:Int, _ totalColumns:Int, _ currentRow:Int, _ currentColumn:Int, _ originalImage:UIImage)->(UIImage) 36 | typealias VoidClosure = () -> () 37 | 38 | var cellSize:CGSize? 39 | var rippleType: RippleType = .oneWave 40 | 41 | var tileImage:UIImage! 42 | var magnitude: CGFloat = -0.6 43 | var animationDuration: Double = 3.5 44 | 45 | var isAnimating: Bool = false 46 | 47 | fileprivate var tiles = [GridItemView]() 48 | fileprivate var isGridRendered: Bool = false 49 | 50 | var tileImageCustomizationClosure: CustomizationClosure? = nil { 51 | didSet { 52 | stopAnimating() 53 | removeGrid() 54 | renderGrid() 55 | } 56 | } 57 | 58 | var animationDidStop: VoidClosure? 59 | 60 | func setupView() { 61 | if isAnimating { 62 | stopAnimating() 63 | } 64 | removeGrid() 65 | renderGrid() 66 | } 67 | } 68 | 69 | // MARK: View operations 70 | extension RippleEffectView { 71 | override func willMove(toSuperview newSuperview: UIView?) { 72 | if let parent = newSuperview, newSuperview != nil { 73 | self.frame = CGRect(x: 0, y: 0, width: parent.frame.width, height: parent.frame.height) 74 | } 75 | } 76 | 77 | override func layoutSubviews() { 78 | guard let parent = superview else { return } 79 | self.frame = CGRect(x: 0, y: 0, width: parent.frame.width, height: parent.frame.height) 80 | setupView() 81 | } 82 | } 83 | 84 | //MARK: Animations 85 | extension RippleEffectView { 86 | func stopAnimating() { 87 | isAnimating = false 88 | layer.removeAllAnimations() 89 | } 90 | 91 | func simulateAnimationEnd() { 92 | waitAndRun(animationDuration){ 93 | if let callback = self.animationDidStop { 94 | callback() 95 | } 96 | 97 | if self.isAnimating { 98 | self.simulateAnimationEnd() 99 | } 100 | } 101 | } 102 | 103 | func startAnimating() { 104 | guard superview != nil else { 105 | return 106 | } 107 | 108 | if isGridRendered == false { 109 | renderGrid() 110 | } 111 | 112 | isAnimating = true 113 | layer.shouldRasterize = true 114 | simulateAnimationEnd() 115 | 116 | for tile in tiles { 117 | let distance = self.distance(fromPoint:tile.position, toPoint:self.center) 118 | var vector = self.normalizedVector(fromPoint:tile.position, toPoint:self.center) 119 | 120 | vector = CGPoint(x:vector.x * magnitude * distance, y: vector.y * magnitude * distance) 121 | tile.startAnimatingWithDuration(animationDuration, rippleDelay: animationDuration - 0.0006666 * TimeInterval(distance), rippleOffset: vector) 122 | } 123 | } 124 | } 125 | 126 | //MARK: Grid operations 127 | extension RippleEffectView { 128 | func removeGrid() { 129 | for tile in tiles { 130 | tile.removeAllAnimations() 131 | tile.removeFromSuperlayer() 132 | } 133 | tiles.removeAll() 134 | isGridRendered = false 135 | } 136 | 137 | func renderGrid() { 138 | guard isGridRendered == false else { return } 139 | guard tileImage != nil else { return } 140 | 141 | isGridRendered = true 142 | let itemWidth = (cellSize == nil) ? tileImage.size.width : cellSize!.width 143 | let itemHeight = (cellSize == nil) ? tileImage.size.height : cellSize!.height 144 | 145 | let rows = ((self.rows % 2 == 0) ? self.rows + 3 : self.rows + 2) 146 | let columns = ((self.columns % 2 == 0) ? self.columns + 3 : self.columns + 2) 147 | 148 | let offsetX = columns / 2 149 | let offsetY = rows / 2 150 | 151 | let startPoint = CGPoint(x: center.x - (CGFloat(offsetX) * itemWidth), y: center.y - (CGFloat(offsetY) * itemHeight)) 152 | 153 | for row in 0..CGFloat { 196 | let nX = (fromPoint.x - toPoint.x) 197 | let nY = (fromPoint.y - toPoint.y) 198 | return sqrt(nX*nX + nY*nY) 199 | } 200 | 201 | func normalizedVector(fromPoint:CGPoint,toPoint:CGPoint)->CGPoint { 202 | let length = distance(fromPoint:fromPoint, toPoint:toPoint) 203 | guard length > 0 else { return CGPoint.zero } 204 | return CGPoint(x:(fromPoint.x - toPoint.x)/length, y:(fromPoint.y - toPoint.y)/length) 205 | } 206 | } 207 | 208 | private class GridItemView: CALayer { 209 | var tileImage:UIImage? 210 | var rippleType:RippleType = .oneWave 211 | 212 | func startAnimatingWithDuration(_ duration: TimeInterval, rippleDelay: TimeInterval, rippleOffset: CGPoint) { 213 | let timingFunction = CAMediaTimingFunction(controlPoints: 0.25, 0, 0.2, 1) 214 | let linearFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionLinear) 215 | let zeroPointValue = NSValue(cgPoint: CGPoint.zero) 216 | 217 | var animations = [CAAnimation]() 218 | 219 | let scaleAnimation = CAKeyframeAnimation(keyPath: "transform.scale") 220 | if rippleType == .heartbeat { 221 | scaleAnimation.keyTimes = [0, 0.3, 0.4, 0.5, 0.6, 0.69, 0.735, 1] 222 | scaleAnimation.timingFunctions = [linearFunction, timingFunction, timingFunction, timingFunction, timingFunction, timingFunction] 223 | scaleAnimation.values = [1, 1, 1.35, 1.05, 1.20, 0.95, 1, 1] 224 | } else { 225 | scaleAnimation.keyTimes = [0, 0.5, 0.6, 1] 226 | scaleAnimation.values = [1, 1, 1.15, 1] 227 | scaleAnimation.timingFunctions = [linearFunction, timingFunction, timingFunction] 228 | } 229 | scaleAnimation.beginTime = 0.0 230 | scaleAnimation.duration = duration 231 | animations.append(scaleAnimation) 232 | 233 | let positionAnimation = CAKeyframeAnimation(keyPath: "position") 234 | positionAnimation.duration = duration 235 | if rippleType == .heartbeat { 236 | let secondBeat = CGPoint(x:rippleOffset.x, y:rippleOffset.y) 237 | positionAnimation.timingFunctions = [linearFunction, timingFunction, timingFunction, timingFunction, timingFunction, linearFunction] 238 | positionAnimation.keyTimes = [0, 0.3, 0.4, 0.5, 0.6, 0.7, 0.75, 1] 239 | positionAnimation.values = [zeroPointValue, zeroPointValue, NSValue(cgPoint:rippleOffset), zeroPointValue, NSValue(cgPoint:secondBeat), NSValue(cgPoint:CGPoint(x:-rippleOffset.x*0.3,y:-rippleOffset.y*0.3)),zeroPointValue, zeroPointValue] 240 | } else { 241 | positionAnimation.timingFunctions = [linearFunction, timingFunction, timingFunction] 242 | positionAnimation.keyTimes = [0, 0.5, 0.6, 1] 243 | positionAnimation.values = [zeroPointValue, zeroPointValue, NSValue(cgPoint:rippleOffset), zeroPointValue] 244 | } 245 | positionAnimation.isAdditive = true 246 | animations.append(positionAnimation) 247 | 248 | let opacityAnimation = CAKeyframeAnimation(keyPath: "opacity") 249 | opacityAnimation.duration = duration 250 | if rippleType == .heartbeat { 251 | opacityAnimation.timingFunctions = [linearFunction, timingFunction, timingFunction, linearFunction] 252 | opacityAnimation.keyTimes = [0, 0.3, 0.4, 0.5, 0.6, 0.69, 1] 253 | opacityAnimation.values = [1, 1, 0.85, 0.75, 0.90, 1, 1] 254 | } else { 255 | opacityAnimation.timingFunctions = [linearFunction, timingFunction, timingFunction, linearFunction] 256 | opacityAnimation.keyTimes = [0, 0.5, 0.6, 0.94, 1] 257 | opacityAnimation.values = [1, 1, 0.45, 1, 1] 258 | } 259 | animations.append(opacityAnimation) 260 | 261 | let groupAnimation = CAAnimationGroup() 262 | groupAnimation.repeatCount = Float.infinity 263 | groupAnimation.fillMode = kCAFillModeBackwards 264 | groupAnimation.duration = duration 265 | groupAnimation.beginTime = rippleDelay 266 | groupAnimation.isRemovedOnCompletion = false 267 | groupAnimation.animations = animations 268 | groupAnimation.timeOffset = 0.35 * duration 269 | 270 | shouldRasterize = true 271 | add(groupAnimation, forKey: "ripple") 272 | } 273 | 274 | func stopAnimating() { 275 | removeAllAnimations() 276 | } 277 | } 278 | 279 | func waitAndRun(_ delay:Double, closure:@escaping ()->()) { 280 | DispatchQueue.main.asyncAfter(deadline: DispatchTime.now() + Double(Int64(delay * Double(NSEC_PER_SEC))) / Double(NSEC_PER_SEC), execute: closure) 281 | } 282 | -------------------------------------------------------------------------------- /RippleEffectView/RippleEffectView.swift: -------------------------------------------------------------------------------- 1 | // 2 | // RippleEffectView.swift 3 | // RippleEffectView 4 | // 5 | // Created by Alex Sergeev on 8/14/16. 6 | // Copyright © 2016 ALSEDI Group. All rights reserved. 7 | // 8 | // Permission is hereby granted, free of charge, to any person obtaining a copy 9 | // of this software and associated documentation files (the "Software"), to deal 10 | // in the Software without restriction, including without limitation the rights 11 | // to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 12 | // copies of the Software, and to permit persons to whom the Software is 13 | // furnished to do so, subject to the following conditions: 14 | // 15 | // The above copyright notice and this permission notice shall be included in all 16 | // copies or substantial portions of the Software. 17 | // 18 | // THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 19 | // IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 20 | // FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 21 | // AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 22 | // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 23 | // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 24 | // SOFTWARE. 25 | 26 | import UIKit 27 | 28 | public enum RippleType { 29 | case oneWave 30 | case heartbeat 31 | } 32 | 33 | @IBDesignable 34 | open class RippleEffectView: UIView { 35 | public typealias CustomizationClosure = (_ totalRows:Int, _ totalColumns:Int, _ currentRow:Int, _ currentColumn:Int, _ originalImage:UIImage)->(UIImage) 36 | public typealias VoidClosure = () -> () 37 | 38 | open var cellSize:CGSize? 39 | open var rippleType: RippleType = .oneWave 40 | 41 | open var tileImage:UIImage! 42 | open var magnitude: CGFloat = -0.6 43 | open var animationDuration: Double = 3.5 44 | 45 | var isAnimating: Bool = false 46 | 47 | fileprivate var tiles = [GridItemView]() 48 | fileprivate var isGridRendered: Bool = false 49 | 50 | open var tileImageCustomizationClosure: CustomizationClosure? = nil { 51 | didSet { 52 | stopAnimating() 53 | removeGrid() 54 | renderGrid() 55 | } 56 | } 57 | 58 | open var animationDidStop: VoidClosure? 59 | 60 | open func setupView() { 61 | if isAnimating { 62 | stopAnimating() 63 | } 64 | removeGrid() 65 | renderGrid() 66 | } 67 | } 68 | 69 | // MARK: View operations 70 | extension RippleEffectView { 71 | override open func willMove(toSuperview newSuperview: UIView?) { 72 | if let parent = newSuperview, newSuperview != nil { 73 | self.frame = CGRect(x: 0, y: 0, width: parent.frame.width, height: parent.frame.height) 74 | } 75 | } 76 | 77 | override open func layoutSubviews() { 78 | guard let parent = superview else { return } 79 | self.frame = CGRect(x: 0, y: 0, width: parent.frame.width, height: parent.frame.height) 80 | setupView() 81 | } 82 | } 83 | 84 | //MARK: Animations 85 | extension RippleEffectView { 86 | open func stopAnimating() { 87 | isAnimating = false 88 | layer.removeAllAnimations() 89 | } 90 | 91 | open func simulateAnimationEnd() { 92 | waitAndRun(animationDuration){ 93 | if let callback = self.animationDidStop { 94 | callback() 95 | } 96 | 97 | if self.isAnimating { 98 | self.simulateAnimationEnd() 99 | } 100 | } 101 | } 102 | 103 | open func startAnimating() { 104 | guard superview != nil else { 105 | return 106 | } 107 | 108 | if isGridRendered == false { 109 | renderGrid() 110 | } 111 | 112 | isAnimating = true 113 | layer.shouldRasterize = true 114 | simulateAnimationEnd() 115 | 116 | for tile in tiles { 117 | let distance = self.distance(fromPoint:tile.position, toPoint:self.center) 118 | var vector = self.normalizedVector(fromPoint:tile.position, toPoint:self.center) 119 | 120 | vector = CGPoint(x:vector.x * magnitude * distance, y: vector.y * magnitude * distance) 121 | tile.startAnimatingWithDuration(animationDuration, rippleDelay: animationDuration - 0.0006666 * TimeInterval(distance), rippleOffset: vector) 122 | } 123 | } 124 | } 125 | 126 | //MARK: Grid operations 127 | extension RippleEffectView { 128 | func removeGrid() { 129 | for tile in tiles { 130 | tile.removeAllAnimations() 131 | tile.removeFromSuperlayer() 132 | } 133 | tiles.removeAll() 134 | isGridRendered = false 135 | } 136 | 137 | func renderGrid() { 138 | guard isGridRendered == false else { return } 139 | guard tileImage != nil else { return } 140 | 141 | isGridRendered = true 142 | let itemWidth = (cellSize == nil) ? tileImage.size.width : cellSize!.width 143 | let itemHeight = (cellSize == nil) ? tileImage.size.height : cellSize!.height 144 | 145 | let rows = ((self.rows % 2 == 0) ? self.rows + 3 : self.rows + 2) 146 | let columns = ((self.columns % 2 == 0) ? self.columns + 3 : self.columns + 2) 147 | 148 | let offsetX = columns / 2 149 | let offsetY = rows / 2 150 | 151 | let startPoint = CGPoint(x: center.x - (CGFloat(offsetX) * itemWidth), y: center.y - (CGFloat(offsetY) * itemHeight)) 152 | 153 | for row in 0..CGFloat { 196 | let nX = (fromPoint.x - toPoint.x) 197 | let nY = (fromPoint.y - toPoint.y) 198 | return sqrt(nX*nX + nY*nY) 199 | } 200 | 201 | func normalizedVector(fromPoint:CGPoint,toPoint:CGPoint)->CGPoint { 202 | let length = distance(fromPoint:fromPoint, toPoint:toPoint) 203 | guard length > 0 else { return CGPoint.zero } 204 | return CGPoint(x:(fromPoint.x - toPoint.x)/length, y:(fromPoint.y - toPoint.y)/length) 205 | } 206 | } 207 | 208 | private class GridItemView: CALayer { 209 | var tileImage:UIImage? 210 | var rippleType:RippleType = .oneWave 211 | 212 | func startAnimatingWithDuration(_ duration: TimeInterval, rippleDelay: TimeInterval, rippleOffset: CGPoint) { 213 | let timingFunction = CAMediaTimingFunction(controlPoints: 0.25, 0, 0.2, 1) 214 | let linearFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionLinear) 215 | let zeroPointValue = NSValue(cgPoint: CGPoint.zero) 216 | 217 | var animations = [CAAnimation]() 218 | 219 | let scaleAnimation = CAKeyframeAnimation(keyPath: "transform.scale") 220 | if rippleType == .heartbeat { 221 | scaleAnimation.keyTimes = [0, 0.3, 0.4, 0.5, 0.6, 0.69, 0.735, 1] 222 | scaleAnimation.timingFunctions = [linearFunction, timingFunction, timingFunction, timingFunction, timingFunction, timingFunction] 223 | scaleAnimation.values = [1, 1, 1.35, 1.05, 1.20, 0.95, 1, 1] 224 | } else { 225 | scaleAnimation.keyTimes = [0, 0.5, 0.6, 1] 226 | scaleAnimation.values = [1, 1, 1.15, 1] 227 | scaleAnimation.timingFunctions = [linearFunction, timingFunction, timingFunction] 228 | } 229 | scaleAnimation.beginTime = 0.0 230 | scaleAnimation.duration = duration 231 | animations.append(scaleAnimation) 232 | 233 | let positionAnimation = CAKeyframeAnimation(keyPath: "position") 234 | positionAnimation.duration = duration 235 | if rippleType == .heartbeat { 236 | let secondBeat = CGPoint(x:rippleOffset.x, y:rippleOffset.y) 237 | positionAnimation.timingFunctions = [linearFunction, timingFunction, timingFunction, timingFunction, timingFunction, linearFunction] 238 | positionAnimation.keyTimes = [0, 0.3, 0.4, 0.5, 0.6, 0.7, 0.75, 1] 239 | positionAnimation.values = [zeroPointValue, zeroPointValue, NSValue(cgPoint:rippleOffset), zeroPointValue, NSValue(cgPoint:secondBeat), NSValue(cgPoint:CGPoint(x:-rippleOffset.x*0.3,y:-rippleOffset.y*0.3)),zeroPointValue, zeroPointValue] 240 | } else { 241 | positionAnimation.timingFunctions = [linearFunction, timingFunction, timingFunction] 242 | positionAnimation.keyTimes = [0, 0.5, 0.6, 1] 243 | positionAnimation.values = [zeroPointValue, zeroPointValue, NSValue(cgPoint:rippleOffset), zeroPointValue] 244 | } 245 | positionAnimation.isAdditive = true 246 | animations.append(positionAnimation) 247 | 248 | let opacityAnimation = CAKeyframeAnimation(keyPath: "opacity") 249 | opacityAnimation.duration = duration 250 | if rippleType == .heartbeat { 251 | opacityAnimation.timingFunctions = [linearFunction, timingFunction, timingFunction, linearFunction] 252 | opacityAnimation.keyTimes = [0, 0.3, 0.4, 0.5, 0.6, 0.69, 1] 253 | opacityAnimation.values = [1, 1, 0.85, 0.75, 0.90, 1, 1] 254 | } else { 255 | opacityAnimation.timingFunctions = [linearFunction, timingFunction, timingFunction, linearFunction] 256 | opacityAnimation.keyTimes = [0, 0.5, 0.6, 0.94, 1] 257 | opacityAnimation.values = [1, 1, 0.45, 1, 1] 258 | } 259 | animations.append(opacityAnimation) 260 | 261 | let groupAnimation = CAAnimationGroup() 262 | groupAnimation.repeatCount = Float.infinity 263 | groupAnimation.fillMode = kCAFillModeBackwards 264 | groupAnimation.duration = duration 265 | groupAnimation.beginTime = rippleDelay 266 | groupAnimation.isRemovedOnCompletion = false 267 | groupAnimation.animations = animations 268 | groupAnimation.timeOffset = 0.35 * duration 269 | 270 | shouldRasterize = true 271 | add(groupAnimation, forKey: "ripple") 272 | } 273 | 274 | func stopAnimating() { 275 | removeAllAnimations() 276 | } 277 | } 278 | 279 | func waitAndRun(_ delay:Double, closure:@escaping ()->()) { 280 | DispatchQueue.main.asyncAfter(deadline: DispatchTime.now() + Double(Int64(delay * Double(NSEC_PER_SEC))) / Double(NSEC_PER_SEC), execute: closure) 281 | } 282 | -------------------------------------------------------------------------------- /Demo/RippleEffectDemo.xcodeproj/project.pbxproj: -------------------------------------------------------------------------------- 1 | // !$*UTF8*$! 2 | { 3 | archiveVersion = 1; 4 | classes = { 5 | }; 6 | objectVersion = 46; 7 | objects = { 8 | 9 | /* Begin PBXBuildFile section */ 10 | 1549DBA81D6A28CD002AE54D /* AppDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1549DBA71D6A28CD002AE54D /* AppDelegate.swift */; }; 11 | 1549DBAA1D6A28CD002AE54D /* ViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1549DBA91D6A28CD002AE54D /* ViewController.swift */; }; 12 | 1549DBAD1D6A28CD002AE54D /* Main.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 1549DBAB1D6A28CD002AE54D /* Main.storyboard */; }; 13 | 1549DBAF1D6A28CD002AE54D /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 1549DBAE1D6A28CD002AE54D /* Assets.xcassets */; }; 14 | 1549DBB21D6A28CD002AE54D /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 1549DBB01D6A28CD002AE54D /* LaunchScreen.storyboard */; }; 15 | 1549DBBA1D6A2904002AE54D /* RippleEffectView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1549DBB91D6A2904002AE54D /* RippleEffectView.swift */; }; 16 | /* End PBXBuildFile section */ 17 | 18 | /* Begin PBXFileReference section */ 19 | 1549DBA41D6A28CD002AE54D /* RippleEffectDemo.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = RippleEffectDemo.app; sourceTree = BUILT_PRODUCTS_DIR; }; 20 | 1549DBA71D6A28CD002AE54D /* AppDelegate.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AppDelegate.swift; sourceTree = ""; }; 21 | 1549DBA91D6A28CD002AE54D /* ViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ViewController.swift; sourceTree = ""; }; 22 | 1549DBAC1D6A28CD002AE54D /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/Main.storyboard; sourceTree = ""; }; 23 | 1549DBAE1D6A28CD002AE54D /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = ""; }; 24 | 1549DBB11D6A28CD002AE54D /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/LaunchScreen.storyboard; sourceTree = ""; }; 25 | 1549DBB31D6A28CD002AE54D /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = ""; }; 26 | 1549DBB91D6A2904002AE54D /* RippleEffectView.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = RippleEffectView.swift; sourceTree = ""; }; 27 | /* End PBXFileReference section */ 28 | 29 | /* Begin PBXFrameworksBuildPhase section */ 30 | 1549DBA11D6A28CD002AE54D /* Frameworks */ = { 31 | isa = PBXFrameworksBuildPhase; 32 | buildActionMask = 2147483647; 33 | files = ( 34 | ); 35 | runOnlyForDeploymentPostprocessing = 0; 36 | }; 37 | /* End PBXFrameworksBuildPhase section */ 38 | 39 | /* Begin PBXGroup section */ 40 | 1549DB9B1D6A28CD002AE54D = { 41 | isa = PBXGroup; 42 | children = ( 43 | 1549DBA61D6A28CD002AE54D /* RippleEffectDemo */, 44 | 1549DBA51D6A28CD002AE54D /* Products */, 45 | ); 46 | sourceTree = ""; 47 | }; 48 | 1549DBA51D6A28CD002AE54D /* Products */ = { 49 | isa = PBXGroup; 50 | children = ( 51 | 1549DBA41D6A28CD002AE54D /* RippleEffectDemo.app */, 52 | ); 53 | name = Products; 54 | sourceTree = ""; 55 | }; 56 | 1549DBA61D6A28CD002AE54D /* RippleEffectDemo */ = { 57 | isa = PBXGroup; 58 | children = ( 59 | 1549DBA71D6A28CD002AE54D /* AppDelegate.swift */, 60 | 1549DBA91D6A28CD002AE54D /* ViewController.swift */, 61 | 1549DBAB1D6A28CD002AE54D /* Main.storyboard */, 62 | 1549DBAE1D6A28CD002AE54D /* Assets.xcassets */, 63 | 1549DBB01D6A28CD002AE54D /* LaunchScreen.storyboard */, 64 | 1549DBB31D6A28CD002AE54D /* Info.plist */, 65 | 1549DBB91D6A2904002AE54D /* RippleEffectView.swift */, 66 | ); 67 | path = RippleEffectDemo; 68 | sourceTree = ""; 69 | }; 70 | /* End PBXGroup section */ 71 | 72 | /* Begin PBXNativeTarget section */ 73 | 1549DBA31D6A28CD002AE54D /* RippleEffectDemo */ = { 74 | isa = PBXNativeTarget; 75 | buildConfigurationList = 1549DBB61D6A28CD002AE54D /* Build configuration list for PBXNativeTarget "RippleEffectDemo" */; 76 | buildPhases = ( 77 | 1549DBA01D6A28CD002AE54D /* Sources */, 78 | 1549DBA11D6A28CD002AE54D /* Frameworks */, 79 | 1549DBA21D6A28CD002AE54D /* Resources */, 80 | ); 81 | buildRules = ( 82 | ); 83 | dependencies = ( 84 | ); 85 | name = RippleEffectDemo; 86 | productName = RippleEffectDemo; 87 | productReference = 1549DBA41D6A28CD002AE54D /* RippleEffectDemo.app */; 88 | productType = "com.apple.product-type.application"; 89 | }; 90 | /* End PBXNativeTarget section */ 91 | 92 | /* Begin PBXProject section */ 93 | 1549DB9C1D6A28CD002AE54D /* Project object */ = { 94 | isa = PBXProject; 95 | attributes = { 96 | LastSwiftUpdateCheck = 0730; 97 | LastUpgradeCheck = 0810; 98 | ORGANIZATIONNAME = alsedi; 99 | TargetAttributes = { 100 | 1549DBA31D6A28CD002AE54D = { 101 | CreatedOnToolsVersion = 7.3.1; 102 | LastSwiftMigration = 0810; 103 | }; 104 | }; 105 | }; 106 | buildConfigurationList = 1549DB9F1D6A28CD002AE54D /* Build configuration list for PBXProject "RippleEffectDemo" */; 107 | compatibilityVersion = "Xcode 3.2"; 108 | developmentRegion = English; 109 | hasScannedForEncodings = 0; 110 | knownRegions = ( 111 | en, 112 | Base, 113 | ); 114 | mainGroup = 1549DB9B1D6A28CD002AE54D; 115 | productRefGroup = 1549DBA51D6A28CD002AE54D /* Products */; 116 | projectDirPath = ""; 117 | projectRoot = ""; 118 | targets = ( 119 | 1549DBA31D6A28CD002AE54D /* RippleEffectDemo */, 120 | ); 121 | }; 122 | /* End PBXProject section */ 123 | 124 | /* Begin PBXResourcesBuildPhase section */ 125 | 1549DBA21D6A28CD002AE54D /* Resources */ = { 126 | isa = PBXResourcesBuildPhase; 127 | buildActionMask = 2147483647; 128 | files = ( 129 | 1549DBB21D6A28CD002AE54D /* LaunchScreen.storyboard in Resources */, 130 | 1549DBAF1D6A28CD002AE54D /* Assets.xcassets in Resources */, 131 | 1549DBAD1D6A28CD002AE54D /* Main.storyboard in Resources */, 132 | ); 133 | runOnlyForDeploymentPostprocessing = 0; 134 | }; 135 | /* End PBXResourcesBuildPhase section */ 136 | 137 | /* Begin PBXSourcesBuildPhase section */ 138 | 1549DBA01D6A28CD002AE54D /* Sources */ = { 139 | isa = PBXSourcesBuildPhase; 140 | buildActionMask = 2147483647; 141 | files = ( 142 | 1549DBAA1D6A28CD002AE54D /* ViewController.swift in Sources */, 143 | 1549DBA81D6A28CD002AE54D /* AppDelegate.swift in Sources */, 144 | 1549DBBA1D6A2904002AE54D /* RippleEffectView.swift in Sources */, 145 | ); 146 | runOnlyForDeploymentPostprocessing = 0; 147 | }; 148 | /* End PBXSourcesBuildPhase section */ 149 | 150 | /* Begin PBXVariantGroup section */ 151 | 1549DBAB1D6A28CD002AE54D /* Main.storyboard */ = { 152 | isa = PBXVariantGroup; 153 | children = ( 154 | 1549DBAC1D6A28CD002AE54D /* Base */, 155 | ); 156 | name = Main.storyboard; 157 | sourceTree = ""; 158 | }; 159 | 1549DBB01D6A28CD002AE54D /* LaunchScreen.storyboard */ = { 160 | isa = PBXVariantGroup; 161 | children = ( 162 | 1549DBB11D6A28CD002AE54D /* Base */, 163 | ); 164 | name = LaunchScreen.storyboard; 165 | sourceTree = ""; 166 | }; 167 | /* End PBXVariantGroup section */ 168 | 169 | /* Begin XCBuildConfiguration section */ 170 | 1549DBB41D6A28CD002AE54D /* Debug */ = { 171 | isa = XCBuildConfiguration; 172 | buildSettings = { 173 | ALWAYS_SEARCH_USER_PATHS = NO; 174 | CLANG_ANALYZER_NONNULL = YES; 175 | CLANG_CXX_LANGUAGE_STANDARD = "gnu++0x"; 176 | CLANG_CXX_LIBRARY = "libc++"; 177 | CLANG_ENABLE_MODULES = YES; 178 | CLANG_ENABLE_OBJC_ARC = YES; 179 | CLANG_WARN_BOOL_CONVERSION = YES; 180 | CLANG_WARN_CONSTANT_CONVERSION = YES; 181 | CLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR; 182 | CLANG_WARN_EMPTY_BODY = YES; 183 | CLANG_WARN_ENUM_CONVERSION = YES; 184 | CLANG_WARN_INFINITE_RECURSION = YES; 185 | CLANG_WARN_INT_CONVERSION = YES; 186 | CLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR; 187 | CLANG_WARN_SUSPICIOUS_MOVE = YES; 188 | CLANG_WARN_UNREACHABLE_CODE = YES; 189 | CLANG_WARN__DUPLICATE_METHOD_MATCH = YES; 190 | "CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer"; 191 | COPY_PHASE_STRIP = NO; 192 | DEBUG_INFORMATION_FORMAT = dwarf; 193 | ENABLE_STRICT_OBJC_MSGSEND = YES; 194 | ENABLE_TESTABILITY = YES; 195 | GCC_C_LANGUAGE_STANDARD = gnu99; 196 | GCC_DYNAMIC_NO_PIC = NO; 197 | GCC_NO_COMMON_BLOCKS = YES; 198 | GCC_OPTIMIZATION_LEVEL = 0; 199 | GCC_PREPROCESSOR_DEFINITIONS = ( 200 | "DEBUG=1", 201 | "$(inherited)", 202 | ); 203 | GCC_WARN_64_TO_32_BIT_CONVERSION = YES; 204 | GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR; 205 | GCC_WARN_UNDECLARED_SELECTOR = YES; 206 | GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE; 207 | GCC_WARN_UNUSED_FUNCTION = YES; 208 | GCC_WARN_UNUSED_VARIABLE = YES; 209 | IPHONEOS_DEPLOYMENT_TARGET = 9.3; 210 | MTL_ENABLE_DEBUG_INFO = YES; 211 | ONLY_ACTIVE_ARCH = YES; 212 | SDKROOT = iphoneos; 213 | SWIFT_OPTIMIZATION_LEVEL = "-Onone"; 214 | TARGETED_DEVICE_FAMILY = "1,2"; 215 | }; 216 | name = Debug; 217 | }; 218 | 1549DBB51D6A28CD002AE54D /* Release */ = { 219 | isa = XCBuildConfiguration; 220 | buildSettings = { 221 | ALWAYS_SEARCH_USER_PATHS = NO; 222 | CLANG_ANALYZER_NONNULL = YES; 223 | CLANG_CXX_LANGUAGE_STANDARD = "gnu++0x"; 224 | CLANG_CXX_LIBRARY = "libc++"; 225 | CLANG_ENABLE_MODULES = YES; 226 | CLANG_ENABLE_OBJC_ARC = YES; 227 | CLANG_WARN_BOOL_CONVERSION = YES; 228 | CLANG_WARN_CONSTANT_CONVERSION = YES; 229 | CLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR; 230 | CLANG_WARN_EMPTY_BODY = YES; 231 | CLANG_WARN_ENUM_CONVERSION = YES; 232 | CLANG_WARN_INFINITE_RECURSION = YES; 233 | CLANG_WARN_INT_CONVERSION = YES; 234 | CLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR; 235 | CLANG_WARN_SUSPICIOUS_MOVE = YES; 236 | CLANG_WARN_UNREACHABLE_CODE = YES; 237 | CLANG_WARN__DUPLICATE_METHOD_MATCH = YES; 238 | "CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer"; 239 | COPY_PHASE_STRIP = NO; 240 | DEBUG_INFORMATION_FORMAT = "dwarf-with-dsym"; 241 | ENABLE_NS_ASSERTIONS = NO; 242 | ENABLE_STRICT_OBJC_MSGSEND = YES; 243 | GCC_C_LANGUAGE_STANDARD = gnu99; 244 | GCC_NO_COMMON_BLOCKS = YES; 245 | GCC_WARN_64_TO_32_BIT_CONVERSION = YES; 246 | GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR; 247 | GCC_WARN_UNDECLARED_SELECTOR = YES; 248 | GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE; 249 | GCC_WARN_UNUSED_FUNCTION = YES; 250 | GCC_WARN_UNUSED_VARIABLE = YES; 251 | IPHONEOS_DEPLOYMENT_TARGET = 9.3; 252 | MTL_ENABLE_DEBUG_INFO = NO; 253 | SDKROOT = iphoneos; 254 | SWIFT_OPTIMIZATION_LEVEL = "-Owholemodule"; 255 | TARGETED_DEVICE_FAMILY = "1,2"; 256 | VALIDATE_PRODUCT = YES; 257 | }; 258 | name = Release; 259 | }; 260 | 1549DBB71D6A28CD002AE54D /* Debug */ = { 261 | isa = XCBuildConfiguration; 262 | buildSettings = { 263 | ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon; 264 | DEVELOPMENT_TEAM = ""; 265 | INFOPLIST_FILE = RippleEffectDemo/Info.plist; 266 | LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks"; 267 | PRODUCT_BUNDLE_IDENTIFIER = com.alsedi.RippleEffectDemo; 268 | PRODUCT_NAME = "$(TARGET_NAME)"; 269 | SWIFT_VERSION = 3.0; 270 | }; 271 | name = Debug; 272 | }; 273 | 1549DBB81D6A28CD002AE54D /* Release */ = { 274 | isa = XCBuildConfiguration; 275 | buildSettings = { 276 | ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon; 277 | DEVELOPMENT_TEAM = ""; 278 | INFOPLIST_FILE = RippleEffectDemo/Info.plist; 279 | LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks"; 280 | PRODUCT_BUNDLE_IDENTIFIER = com.alsedi.RippleEffectDemo; 281 | PRODUCT_NAME = "$(TARGET_NAME)"; 282 | SWIFT_VERSION = 3.0; 283 | }; 284 | name = Release; 285 | }; 286 | /* End XCBuildConfiguration section */ 287 | 288 | /* Begin XCConfigurationList section */ 289 | 1549DB9F1D6A28CD002AE54D /* Build configuration list for PBXProject "RippleEffectDemo" */ = { 290 | isa = XCConfigurationList; 291 | buildConfigurations = ( 292 | 1549DBB41D6A28CD002AE54D /* Debug */, 293 | 1549DBB51D6A28CD002AE54D /* Release */, 294 | ); 295 | defaultConfigurationIsVisible = 0; 296 | defaultConfigurationName = Release; 297 | }; 298 | 1549DBB61D6A28CD002AE54D /* Build configuration list for PBXNativeTarget "RippleEffectDemo" */ = { 299 | isa = XCConfigurationList; 300 | buildConfigurations = ( 301 | 1549DBB71D6A28CD002AE54D /* Debug */, 302 | 1549DBB81D6A28CD002AE54D /* Release */, 303 | ); 304 | defaultConfigurationIsVisible = 0; 305 | defaultConfigurationName = Release; 306 | }; 307 | /* End XCConfigurationList section */ 308 | }; 309 | rootObject = 1549DB9C1D6A28CD002AE54D /* Project object */; 310 | } 311 | --------------------------------------------------------------------------------