flutter_timeline

Package Overview

Package selection guidance compiled from public package information, community data, and project usage.

A fully customizable timeline widget for Flutter, designed with real-world application references in mind. It supports flexible layout configurations, allowing developers to create dynamic and interactive timelines for events, processes, or historical data. The widget is built to be general-purpose, making it suitable for various use cases such as project tracking, onboarding flows, and event histories. With intuitive customization options, it adapts seamlessly to different design needs while maintaining performance and readability.

Use cases

Project progress tracking
User onboarding sequences
Historical event displays
Process flow visualization
Application changelogs

Key features

Highly customizable design
Supports vertical and horizontal layouts
Extensible event item configuration
Responsive and performant rendering
Built-in animation support

Suitable for

Developers building process-oriented apps
Designers needing flexible timeline components
Apps requiring visual event sequencing

Considerations

Requires manual setup for complex animations
Limited platform-specific optimizations
No built-in date formatting utilities
Best suited for static or semi-dynamic content
Depends on external styling for theme integration

Original README

Original README snapshot from the linked source repository. Visit the repository for the latest content.

framework: flutter platform: Android, iOS, Web, macOS, Linux, Windows tags: flutter, timeline, flutter timeline, timeline tile title: flutter timeline

logo

a fully customizable & general timeline widget, based on real-world application references

✅ fully customizable indicator dot
✅ support spacing between indicator dot and lines
✅ support spacing between event (items) but leaving the line connected
✅ uses custom paint, but yet, indicator and body are fully customizable.
✅ 2 real-world demos
✅ L2R support
✅ anchor support
✅ global offset support
✅ item offset support
✅ supported & used by enterprise, constantly updated, used on production application.

Installation

dependencies:
  flutter_timeline: latest

usage

simple

  TimelineEventDisplay get plainEventDisplay {
    return TimelineEventDisplay(
        child: TimelineEventCard(
          title: Text("just now"),
          content: Text("someone commented on your timeline ${DateTime.now()}"),
        ),
        indicator: TimelineDots.of(context).circleIcon);
  }

  List<TimelineEventDisplay> events;

  Widget _buildTimeline() {
    return TimelineTheme(
        data: TimelineThemeData(lineColor: Colors.blueAccent),
        child: Timeline(
          indicatorSize: 56,
          events: events,
        ));
  }

  void _addEvent() {
    setState(() {
      events.add(plainEventDisplay);
    });
  }

using offset

Widget _buildTimeline() {
  return Timeline(
      indicatorSize: 56,
      events: events,
      altOffset: Offset(0, -24) // set offset
  );
}

using anchor & offset

  TimelineEventDisplay get plainEventDisplay {
    return TimelineEventDisplay(
        anchor: IndicatorPosition.top,
        indicatorOffset: Offset(0, 24),
        child: TimelineEventCard(
          title: Text("multi\nline\ntitle\nawesome!"),
          content: Text("someone commented on your timeline ${DateTime.now()}"),
        ),
        indicator: randomIndicator);
  }

Search packages, repositories and app categories