bubble_timeline

Package Overview

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

BubbleTimeline is a Flutter widget designed to create interactive, customizable timeline interfaces. It allows developers to display events as animated bubbles that can be easily styled and arranged. Each bubble supports custom content, colors, and interactions, making it ideal for visualizing sequences such as project milestones, historical events, or user activity logs. The widget is lightweight and flexible, with straightforward integration via pub.dev. Its clean API enables quick setup without sacrificing design control.

Use cases

Displaying project timelines
Visualizing historical events
Showing user activity streams
Presenting step-by-step processes
Creating interactive storytelling interfaces

Key features

Customizable event bubbles
Interactive touch responses
Easy styling options
Smooth animations
Flexible layout control
Supports vertical and horizontal orientation

Suitable for

Developers building timeline-based apps
Designers needing interactive UI components
Apps requiring event visualization
Educational or portfolio applications
Projects with sequential data presentation

Considerations

Limited platform-specific optimizations
No built-in date formatting
Requires manual handling of large datasets
Not optimized for very long timelines
May need additional logic for dynamic updates

Original README

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

Bubble Timeline Package

A Flutter Widget to make interactive timeline widget.

This widget can be used to make Event Timelines, or Timelines for certain travel journey. This widget provides easy customisation of individual event bubbles.

Screenshots

Installing

To use this package:

Add the following to your pubspec.yaml file:

dependencies:
    bubble_timeline: ^1.0.5

How to Use

Simply create a BubbleTimeline widget, and pass the required params:

 BubbleTimeline(
    bubbleDiameter: 120,
    // List of Timeline Bubble Items
    items: [
        TimelineItem(
            title: 'Boat',
            subtitle: 'Travel through Oceans',
            child: Icon(
                Icons.directions_boat,
                color: Colors.white,
            ),
            bubbleColor: Colors.grey,
        ),
        TimelineItem(
            title: 'Bike',
            subtitle: 'Road Trips are best',
            child: Icon(
                Icons.directions_bike,
                color: Colors.white,
            ),
            bubbleColor: Colors.grey,
        ),
        TimelineItem(
            title: 'Bus',
            subtitle: 'I like to go with friends',
            child: Icon(
                Icons.directions_bus,
                color: Colors.white,
            ),
            bubbleColor: Colors.grey,
        ),
    ],
    stripColor: Colors.teal,
    scaffoldColor: Colors.white,
)

Use TimelineItem to add items in Timeline.

TimelineItem(
    title: 'Title',
    subtitle: 'Subtitle',
    description: 'Description',
    child: Icon(
        Icons.directions_bus,
    ),
    bubbleColor: Colors.blue,
),

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Please make sure to update tests as appropriate.

CONTRIBUTORS

Vansh Goel

Search packages, repositories and app categories

Install package