Data Presentation

Line Calendar

A compact calendar component that displays dates in a horizontally scrollable line, ideal for date selection in limited space.

API Reference

Hold Shift while scrolling to navigate through dates on desktop and web.

1@override
2Widget build(BuildContext _) => FLineCalendar(
3 control: .managed(initial: .now().subtract(const Duration(days: 1))),
4);
5

CLI

To generate a specific style for customization:

dart run forui style create line-calendar

Usage

FLineCalendar(...)

1FLineCalendar(
2 style: const .delta(itemSpacing: 10),
3 scrollCacheExtent: null,
4 keyboardDismissBehavior: .manual,
5 physics: null,
6 selectable: (date) => true,
7 builder: (context, data, child) => child!,
8)

Item

An item is typically used to group related information together.

Select Menu Tile

A tile that, when triggered, displays a list of options for the user to pick from.

On this page

CLIUsageFLineCalendar(...)