Data Presentation

Card

A flexible container component that displays content with an optional title, subtitle, and child widget. Cards are commonly used to group related information and actions.

API Reference
1@override
2Widget build(BuildContext _) => FCard(
3 image: Container(
4 decoration: BoxDecoration(
5 image: DecorationImage(
6 image: AssetImage(path('avatar.png')),
7 fit: .cover,
8 ),
9 ),
10 height: 200,
11 ),
12 title: const Text('Gratitude'),
13 subtitle: const Text(
14 'The quality of being thankful; readiness to show appreciation for and to return kindness.',
15 ),
16);
17

CLI

To generate and customize this style:

dart run forui style create card

Usage

FCard(...)

1FCard(
2 style: const .delta(decoration: .delta(color: Color(0xFFFFFFFF))),
3 mainAxisSize: .min,
4 image: const Placeholder(),
5 title: const Text('Title'),
6 subtitle: const Text('Subtitle'),
7 child: const Text('Content'),
8)

FCard.raw(...)

1FCard.raw(
2 style: .delta(decoration: .delta(color: Color(0xFFFFFFFF))),
3 child: Text('Content'),
4)

Calendar

A calendar component for selecting and editing dates.

Item Group

An item group that typically groups related information together.

On this page

CLI
Usage
FCard(...)
FCard.raw(...)