https://github.com/juyan/swiftui-fadein-text

A SwiftUI based fade-in text animation that works for iOS 15 and above
https://github.com/juyan/swiftui-fadein-text

animation fade-in ios swiftui

Last synced: 16 days ago
JSON representation

A SwiftUI based fade-in text animation that works for iOS 15 and above

• Host: GitHub
• URL: https://github.com/juyan/swiftui-fadein-text
• Owner: juyan
• License: apache-2.0
• Created: 2024-12-26T05:21:22.000Z (about 2 months ago)
• Default Branch: main
• Last Pushed: 2025-01-21T02:55:11.000Z (21 days ago)
• Last Synced: 2025-01-21T03:19:33.185Z (21 days ago)
• Topics: animation, fade-in, ios, swiftui
• Language: Swift
• Homepage:
• Size: 39.1 KB
• Stars: 4
• Watchers: 3
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# swiftui-fadein-text

![Apache 2.0 License](https://img.shields.io/github/license/juyan/swiftui-fadein-text)

![Package Releases](https://img.shields.io/github/v/release/juyan/swiftui-fadein-text)

![Build Results](https://img.shields.io/github/actions/workflow/status/juyan/swiftui-fadein-text/.github/workflows/swift.yml?branch=main)

![Swift Version](https://img.shields.io/badge/swift-5.5-critical)

![Supported Platforms](https://img.shields.io/badge/platform-iOS%2015%20-lightgrey)

## What

A SwiftUI based fade-in text animation that works for iOS 15 and above.

## Why

It's surprisingly difficult/clumsy to build smooth fade-in text animation in SwiftUI prior to iOS 18 TextRenderer APIs. 

## How

This approach uses `AttributedString` to achieve a smooth opacity transition over the given time.

It is also designed to be highly customizable so that you can introduce your own logic on how to tokenize the string or interpolate the animation.

## Quick Start

```swift

import FadeInText

struct MyView: View {

  let text: String

  var body: some View {

    FadeInText(text: text, color: .black, tokenizer: DefaultTokenizer(), interpolator: LinearInterpolator(config: .defaultValue))

  }

}

```

Animation Preview:

https://github.com/user-attachments/assets/a2744e7b-b7cf-4952-a174-d130a308437c

## FAQ

### Why not simply use `.opacity(value)`?

In order to animate with different opacity values for different parts of the text, it would require iOS 17 minimum target.

```swift

  var body: some View {

    var text = Text("")

    for chu in chunk {

      if #available(iOS 17.0, *) {

        text = text + Text(chu).foregroundStyle(.red.opacity(0.5))

      } else {

        // Fallback on earlier versions

      }

    }

    return text

  }

```

### Why not use [textrenderer](https://developer.apple.com/documentation/swiftui/view/textrenderer(_:)) ?

It requires iOS 18 minimum target.

###