Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up

New way to perform animated transitions

License

NotificationsYou must be signed in to change notification settings

AlexandrGraschenkov/LiquidTransition

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

48 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

CocoapodsiOS 8.0+VersionSwift 5LicenseDonate

LiquidTransition provide new API for transition creation.

Features:

  • Easy and convinient API (less boilerplate code)
  • Animate backward
  • Interrupt transition at any time to continue interactive
  • Helper class for restore views state
  • Animation of custom properties(orCALayer properties)
  • Complex transition without 'lag'

Web browser  Photo browser
Complex animation  Complex animation

Instalation

CocoaPods

Add the following entry to your Podfile:

pod'LiquidTransition'

Then runpod install.

Don't forget toimport LiquidTransition in every file you'd like to use LiquidTransition.

Usage

Like this you can create simple transition

import LiquidTransitionclassFadeTransition:Animator<FromViewController,ToViewController>{init(){        super.init()                duration=0.3        timing=Timing.default        // do not perform here complex operations, cause it calls on app initialization}overridefunc animation(src:FromViewController, dst:ToViewController, container:UIView, duration:Double){        dst.view.alpha=0                // perform linear animation and manage timing function with `self.timing`UIView.animate(withDuration: duration, delay:0, options:[.curveLinear], animations:{            dst.view.alpha=1}){ _in            dst.view.alpha=1 // if anim somehow canceled}}}

On app starts you can setup transitions

Liquid.shared.becomeDelegate() // Liquid automaticly becomes delegates for all animated transitionsLiquid.shared.addTransitions([FadeTransition()])

That's it! Easy enought?! :)

Customization

import LiquidTransitionclassExampleTransition:Animator<SampleController,CardsNavigationController>{varimgView:UIImageView!overrideinit(){        super.init()                duration=0.4        timing=Timing.init(closure:{ $0* $0})addCustomAnimation{[weak self](progress)inself?.imgView?.layer.cornerRadius=20*(1-progress)}}overridefunc animation(src:SampleController, dst:CardsNavigationController, container:UIView, duration:Double){        imgView= dst.imgView                // this class restore all views state before transition        // when you have lot of property changes, it can be might helpfullletrestore=TransitionRestorer()        restore.addRestore(imgView, src.fadeView)                // cause on end transition we dont want restore superview of `src.view` and `dst.view`        restore.addRestore(dst.view, ignoreFields:[.superview])                dst.view.alpha=0UIView.animate(withDuration: duration, delay:0, options:[.curveLinear], animations:{            dst.view.alpha=1            src.fadeView.alpha=0self.imgView.frame=CGRect(/*new frame*/)}){ _in            restore.restore()}}}

Sometimes we need that one transition work for multiple controllers. In this case you can defineUIViewController as template classes and call init method with multiple classes defined:

classFadeTransition:Animator<UIViewController,UIViewController>{init(){    super.init(from:[VC1.self,VC2.self,VC3.self], to:[VC4.self,VC5.self], direction:.both)    duration=0.3}overridefunc animation(src:UIViewController, dst:UIViewController, container:UIView, duration:Double){// animation}

Or use protocol, to have access to common views. If it's not your case, you can ovverridecanAnimate function

openfunc canAnimate(src:UIViewController, dst:UIViewController, direction animDirection:Direction)->Bool

and define your conditions

TODO

  • Backward animation
  • Custom timing function
  • Allow custom animation
  • Restore view state helper class
  • Smooth interactive animation for complex prepare animation
  • Support Cocoapods
  • Support Swift Package Manager
  • Support Carthage
  • Add custom save keys forTransitionRestorer
  • Add some default animations

Notes

LiquidTransition controls animation percent completion. So if you define animation in one direction, it can run animation backward. In backward animation run from 1 to 0. So if you works withNSNavigationController withnavigationBar, you can see thatnavigationBar animates backward (see example with photos). In this case better to define animation in both directions.

LiquidTransition 'inspired' byHero. We have complex UI with custom animation. Several weaks we try to implement performance animation inHero. When nothing works withHero, we check manual implementation of transition. It works much faster. CauseHero do a lot of snapshots, performs transition becomes laggy. In real projectHero showed not enough performance and require a lot of code to say what you really want. So in real app manual transition looks more suitable.Hero was removed from project and we move to transitions with manual control. Some pieces of new library start appear in our project. Now some ideas and code was moved and refactored for common usage in one library.

If you look for something similar, take a look onTransition andEasyTransitions. I found this projects after finishLiquidTransition and they have good ideas behind. They less convenient, but still good lib.

Credits

Alexandr Graschenkov:alexandr.graschenkov91@gmail.com
iOS andComputer Vision developer


[8]ページ先頭

©2009-2025 Movatter.jp