FreeCharts

Activity Heatmap

GitHub-style activity heatmap with streak tracking, gradient streak card, flow-layout heatmap grid, and color legend

Free
Free with a ShipSwift account.

Copies a short instruction with your private download link. Paste it into your agent: it downloads the whole skill (the source code, the setup steps and the mistakes we already made for you) and builds the screen.

Works with

+70

What it does

A GitHub-style activity heatmap with streak tracking. Contains three sub-components under the SWActivityHeatmap enum: StreakCard (gradient background streak display), HeatmapGrid (flow-layout activity grid), and HeatmapLegend (Less/More color legend). Also provides a static calculateStreak(from:) method and StreakInfo model. Pure SwiftUI implementation with a custom FlowLayout.

What you get

  • ✓514 lines of source code, ready to paste
  • ✓Source Code
  • ✓Usage
chartheatmapactivitystreakSwiftUI

Usage

Complete Example in a Form

// 1. Prepare timestamp data
let timestamps: [Date] = {
    var dates: [Date] = []
    let calendar = Calendar.current
    let today = Date()

    for i in 0..<60 {
        if Int.random(in: 0...100) < 70 {
            if let date = calendar.date(byAdding: .day, value: -i, to: today) {
                let count = Int.random(in: 1...3)
                for _ in 0..<count {
                    dates.append(date)
                }
            }
        }
    }
    return dates
}()

// 2. Compose sub-components
Form {
    // Streak card
    Section {
        SWActivityHeatmap.StreakCard(
            streaks: timestamps,
            colors: [.blue, .purple]
        )
    }
    .listRowInsets(EdgeInsets())

    // Heatmap grid with legend
    Section {
        SWActivityHeatmap.HeatmapGrid(
            timestamps: timestamps,
            days: 60,
            baseColor: .green
        )
    } header: {
        Text("Past 60 days")
    } footer: {
        SWActivityHeatmap.HeatmapLegend(
            baseColor: .green
        )
    }
}

Calculate Streak Independently

let info = SWActivityHeatmap.calculateStreak(from: timestamps)
print(info.currentStreak)    // Consecutive days count
print(info.displayText())    // Human-readable description