We're uploading the content right now — check back on October 30th!
FluttyUI Logo
FluttyUI
Components

Accordion

Accordion is a vertically stacked list of expandable panels, each containing a title and associated content.

Usage

Basic

An accordion presents content in collapsible sections. Use FluttyAccordionItem to define each section.

Multiple Expanded

You can allow multiple panels to be open simultaneously by setting allowMultipleOpen to true.

Initially Expanded

Each FluttyAccordionItem can be set to open by default using initiallyExpanded.

Custom Indicator

Override the default expand/collapse icon by providing a custom indicatorBuilder.

Custom Header Background

You can customize the header background using the headerBackground prop.

Custom Icon Color

Customize the expand/collapse icon color using the iconColor prop.

Custom Animation Duration

Control the expand/collapse animation duration with the duration prop.

API

Accordion Props

PropTypeDefault
items
List<FluttyAccordionItem>
-
allowMultipleOpen?
bool
false
duration?
Duration
Duration(milliseconds: 200)
headerBackground?
Color?
-
iconColor?
Color?
-
indicatorBuilder?
AccordionIndicatorBuilder?
-

Accordion Item

PropTypeDefault
title
Widget
-
child
Widget
-
initiallyExpanded?
bool
false
FluttyUI — Build beautiful apps faster