动画 · solar · 分享于 10 个月前 · 394 次阅读 · 1 次下载
来源: lkzhao/Hero
Licence: MIT
作者: lkzhao
分类: 动画
平台: iOS8+
设备: iPhone
大小: 1 M
更新: 10 个月前
关键字: iOS界面切换动画

Carthage compatible Version License Xcode 8.2+ iOS 8.0+ Swift 3.0+



Hero is a library for building iOS view controller transitions. It provides a layer on top of the UIKit's cumbersome transition APIs. Making custom transitions an easy task for developers.


With Hero, you can easily mix & match these effects to build your own custom transition.

At its core, Hero is similar to Keynote's Magic Move. It checks the heroID property on all source and destinations views. Every matched view pairs are then automatically transitioned from it's old state to it's new state.

Hero can also construct animations for unmatched views. It is easy to define these animations via the heroModifiers property. Hero will run these animations alongside the Magic Move animations. All of these can be interactive, too.

By default, Hero provides dynamic duration & easing based on the Material Design Motion Guide. The duration is determined by the distance and size change. The easing curve is selected base on whether or not the view is entering or exiting the screen. It save you the hassle while providing consistent and delightful animations.

Hero does not make any assumption about how the view is built or structured. It will not modify any of your views' states other than hiding them during the animation. This means that it works with autolayout, programmatic layout, UICollectionView(without modifying its layout object), UITableView, UINavigationController, UITabBarController, etc...

Video Demos

The following videos give you a general idea of what you can do with Hero

  1. Video overview of the example project.
  2. Video overview of the built-in debugger that display timeline, arc curve, and 3d informations.
  3. Video overview of the usage with Injection App to provide dynamic modifications in realtime. Changing HeroID or HeroModifiers without recompiling!

Installation & Usage Guide

Hero is available on Carthage & Cocoapods. See the usage guide for instructions.

NOTE: Hero won't work on iPhone 7 Simulators due to a bug by Apple. Try using other simulators or a real device when working with Hero.

Usage Example 1

View Controller 1
redView.heroID = "foo"
greyView.heroID = "bar"
View Controller 2
isHeroEnabled = true
redView.heroID = "foo"
greyView.heroID = "bar"
greenView.heroModifiers = [.translate(x:0, y:100), .scale(0.5)]

Usage Example 2

View Controller 1
greyView.heroID = "foo"
View Controller 2
isHeroEnabled = true
greyView.heroID = "foo"

// collectionView is the parent view of all red cells
collectionView.heroModifiers = [.cascade]
for cell in redCells {
    cell.heroModifiers = [.fade, .scale(0.5)]

You can do these in the storyboard too!


We welcome any contributions. Please read the Contribution Guide.


Hero is available under the MIT license. See the LICENSE file for more info.

共收到 0 条回复