[iOS] RevealingSplashView:图标缩放、背景、颜色可定制的动画转场效果

RevealingSplashView A Splash view that animates and reveals its content, inspired by the Tw

[iOS] RevealingSplashView:图标缩放、背景、颜色可定制的动画转场效果

RevealingSplashView

A Splash view that animates and reveals its content, inspired by the Twittersplash.

[iOS] RevealingSplashView:图标缩放、背景、颜色可定制的动画转场效果

:star:️Features

  • Customizable reveal icon image.
  • Customizable icon image color.
  • Customizable icon image size.
  • Customizable background color.
  • Customizable animation duration.
  • Customizable animation delay.
  • Several animation to choose from.
  • Easy to use :wink:.

[iOS] RevealingSplashView:图标缩放、背景、颜色可定制的动画转场效果Installation

Get RevealingSplashViewon CocoaPods, just add pod 'RevealingSplashView'to your Podfileand then run pod install. You can also add the github to your Carthagefile.

If you use Carthageyou can just install it by adding github "PiXeL16/RevealingSplashView"to your Carthagefile.

Using Swift 2.3?

If you are using Swift 2.3, please use the 0.0.6release.

��Usage

Usage is pretty easy, just initialize your RevealingSplashViewin your entry ViewControllerand in your viewDidLoad()function add it to your view. Then call startAnimation():

import RevealingSplashViewoverride func viewDidLoad() { super.viewDidLoad() //Initialize a revealing Splash with with the iconImage, the initial size and the background color let revealingSplashView = RevealingSplashView(iconImage: UIImage(named: "twitterLogo")!,iconInitialSize: CGSize(width: 70, height: 70), backgroundColor: UIColor(red:0.11, green:0.56, blue:0.95, alpha:1.0)) //Adds the revealing splash view as a sub view self.view.addSubview(revealingSplashView) //Starts animation revealingSplashView.startAnimation(){ print("Completed") } }

Ideallyyour iconInitialSizeshould match the size of the icon in your LaunchScreen.storyboard.

So it you set your constrains in your LaunchScreen.storyboardto be 80 heightand 80 widthyou should set the same size as the initial size of the RevealingSplashView

Custom Icon Color

You are also able to change the color of your iconImage.

import RevealingSplashViewoverride func viewDidLoad() { super.viewDidLoad() //Initialize a revealing Splash with with the iconImage, the initial size and the background color let revealingSplashView = RevealingSplashView(iconImage: UIImage(named: "twitterLogo")!,iconInitialSize: CGSize(width: 70, height: 70), backgroundColor: UIColor(red:0.11, green:0.56, blue:0.95, alpha:1.0)) revealingSplashView.useCustomIconColor = true revealingSplashView.iconColor = UIColor.red //Adds the revealing splash view as a sub view self.view.addSubview(revealingSplashView) //Starts animation revealingSplashView.startAnimation(){ print("Completed") } }

This will change the actual icon color to red before the animation.

Using NavigationBar or TabBar?

If you are using a NavigationBaror TabBaras your entry view controller, chances are that the animation will look offset by some pixels. There are a couple of options here: Instead of adding the RevealingSplashViewto your ViewController, you can add it to your window.

let window = UIApplication.sharedApplication().keyWindowwindow?.addSubview(revealingSplashView)

You can also create anotherentry view controller. Then add the RevealingSplashViewto that ViewController instead of the one with the NavigationBaror TabBar. Then after the animation of the RevealingSplashViewends you can transition to your NavigationViewController.

:+1:Animations Types

There are several animations to choose from just set the animationTypeproperty of the RevealingSplashView

Twitter

Its the default animation that Twitteruse for their app. If animationTypeis not set it will default to this one.

[iOS] RevealingSplashView:图标缩放、背景、颜色可定制的动画转场效果

HeartBeat

HeartBeat like animation, unlike the other animations, this specialanimation allows you to continue to animate until a function its called. This could be more entertaining to the user than having a quick launch and waiting on a spinning wheel if the app needs to fetch more data.

[iOS] RevealingSplashView:图标缩放、背景、颜色可定制的动画转场效果

Rotate Out

Similar to the Twitterone but rotating while zooming out.

revealingSplashView.animationType = SplashAnimationType.RotateOut

[iOS] RevealingSplashView:图标缩放、背景、颜色可定制的动画转场效果

Pop and Zoom Out

Pop the view a couple of times and zoom out.

revealingSplashView.animationType = SplashAnimationType.PopAndZoomOut

[iOS] RevealingSplashView:图标缩放、背景、颜色可定制的动画转场效果

Squeeze and Zoom Out

Squeeze the view and zoom out.

revealingSplashView.animationType = SplashAnimationType.SqueezeAndZoomOut

[iOS] RevealingSplashView:图标缩放、背景、颜色可定制的动画转场效果

Swing and Zoom Out

Swings the view and zoom out.

revealingSplashView.animationType = SplashAnimationType.SwingAndZoomOut

[iOS] RevealingSplashView:图标缩放、背景、颜色可定制的动画转场效果

Wobble and Zoom Out

Wobbles the view and zoom out.

revealingSplashView.animationType = SplashAnimationType.WobbleAndZoomOut

[iOS] RevealingSplashView:图标缩放、背景、颜色可定制的动画转场效果

TODO

  • Better code coverage
  • More animations

:alien:Author

Chris Jimenez - http://code.chrisjimenez.net, @chrisjimeneznat

License

RevealingSplashViewis released under the MIT license. SeeLICENSE for details.

未登录用户
全部评论0
到底啦