BubbleTimeline은 상호작용 가능하고 사용자 정의가 가능한 타임라인 인터페이스를 생성하기 위해 설계된 Flutter 위젯입니다. 개발자는 이벤트를 애니메이션 효과가 있는 버블로 표시할 수 있으며, 쉽게 스타일링하고 배열할 수 있습니다. 각 버블은 커스텀 콘텐츠, 색상 및 상호작용을 지원하여 프로젝트 마일스톤, 역사적 사건 또는 사용자 활동 로그와 같은 시퀀스를 시각적으로 표현하는 데 이상적입니다. 이 위젯은 가볍고 유연하며 pub.dev를 통해 간편하게 통합할 수 있습니다. 깔끔한 API는 디자인 제어를 희생하지 않고도 빠른 설정을 가능하게 합니다.
사용 사례
프로젝트 일정 표시
역사적 사건 시각화
사용자 활동 스트림 표시
단계별 프로세스 제시
인터랙티브 스토리텔링 인터페이스 만들기
주요 기능
사용자 정의 가능한 이벤트 버블
인터랙티브 터치 반응
간편한 스타일 옵션
부드러운 애니메이션
유연한 레이아웃 제어
수직 및 수평 방향을 지원
적합한 대상
타임라인 기반 앱을 개발하는 개발자
인터랙티브 UI 컴포넌트가 필요한 디자이너
이벤트 시각화가 필요한 앱
교육용 또는 포트폴리오 애플리케이션
순차적 데이터 표시를 가진 프로젝트
고려 사항
제한된 플랫폼별 최적화
내장된 날짜 형식이 없음
대규모 데이터 세트의 수동 처리가 필요합니다
매우 긴 타임라인에 최적화되지 않음
동적 업데이트를 위한 추가 로직이 필요할 수 있습니다
원본 README
연결된 소스 저장소의 README 원문 스냅샷입니다. 최신 내용은 저장소에서 확인하세요.
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,
)
