Story-Telling

How to build an auto rundown paragraph animation?

Can be use in game apps, education apps, and etc.

Reference Source

Youtube Tutorial: Lets Build That App
Story Source: Æsop for Children
Pictures Source: Storytime, Meridian Financial Partners, Inc.

The race is not always to the swift.(but to Swift 4!?)

A Glance of Code

@objc func handleUpdate() {
  let now = Date()
  let elapsedTime = now.timeIntervalSince(animationStartDate)
  let percentage = elapsedTime/speed
  let nowShowing = Int(percentage * (endValue - startValue))
        
  let index = storyString!.index(storyString!.startIndex, offsetBy: nowShowing)
  let mySubstring = String(storyString![..<index])
  self.attributedText = applyFancy(normal: mySubstring)
        
   if nowShowing >= storyString!.count {
       displayLink.invalidate()
       delegate?.endAnimation(nextTag: paragraphCounter)
   }
}

Every time the frame updates trigger this method. This method calculates what is the length should be shown at that moment. Therefore, the paragraph works like animation.

Techniques in Demo App

• CADisplayLink
• MVC Structure
• Delegation Pattern
• Basic Animation
• Theme Configuration
• Clean Code(Refactoring)