Coder Social home page Coder Social logo

augmify / revealingsplashview Goto Github PK

View Code? Open in Web Editor NEW

This project forked from pixel16/revealingsplashview

0.0 0.0 0.0 5.21 MB

A Splash view that animates and reveals its content, inspired by Twitter splash

License: MIT License

Ruby 21.99% Swift 76.65% Objective-C 1.36%

revealingsplashview's Introduction

Banner

Build Status codecov.io CocoaPods Compatible Carthage compatible Awesome Language GitHub license

RevealingSplashView

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

RevealingSplashView

โญ 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 ๐Ÿ˜‰.

:octocat: Installation

Get RevealingSplashView on CocoaPods, just add pod 'RevealingSplashView' to your Podfile and then run pod install. You can also add the github to your Carthage file.

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

Using Swift 2.3?

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

๐Ÿค˜ Usage

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

import RevealingSplashView

override 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")
        }

    }

Ideally your iconInitialSize should match the size of the icon in your LaunchScreen.storyboard.

So it you set your constrains in your LaunchScreen.storyboard to be 80 height and 80 width you 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 RevealingSplashView

override 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 NavigationBar or TabBar as 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 RevealingSplashView to your ViewController, you can add it to your window.

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

You can also create another entry view controller. Then add the RevealingSplashView to that ViewController instead of the one with the NavigationBar or TabBar. Then after the animation of the RevealingSplashView ends you can transition to your NavigationViewController.

๐Ÿ‘ Animations Types

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

Twitter

Its the default animation that Twitter use for their app. If animationType is not set it will default to this one.

RevealingSplashView

HeartBeat

HeartBeat like animation, unlike the other animations, this special animation 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.

HeartBeatAnimation

Rotate Out

Similar to the Twitter one but rotating while zooming out.

revealingSplashView.animationType = SplashAnimationType.rotateOut

RotateOutAnimation

Pop and Zoom Out

Pop the view a couple of times and zoom out.

revealingSplashView.animationType = SplashAnimationType.popAndZoomOut

RotateOutAnimation

Squeeze and Zoom Out

Squeeze the view and zoom out.

revealingSplashView.animationType = SplashAnimationType.squeezeAndZoomOut

RotateOutAnimation

Swing and Zoom Out

Swings the view and zoom out.

revealingSplashView.animationType = SplashAnimationType.swingAndZoomOut

RotateOutAnimation

Wobble and Zoom Out

Wobbles the view and zoom out.

revealingSplashView.animationType = SplashAnimationType.wobbleAndZoomOut

RotateOutAnimation

TODO

  • Better code coverage
  • More animations

๐Ÿ‘ฝ Author

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

License

RevealingSplashView is released under the MIT license. See LICENSE for details.

revealingsplashview's People

Contributors

pixel16 avatar shoheiyokoyama avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.