How to make Expandable card?

Question

I am new to flutter and I want to make a list of cards like this.

I tried to Understand the original Project but I am not able to figure out.

I just

Answer 1

If you don't want to use ExpansionTile then one of the easiest way of doing it is following

class ExpandableCardContainer extends StatefulWidget {
  final bool isExpanded;
  final Widget collapsedChild;
  final Widget expandedChild;

  const ExpandableCardContainer(
      {Key key, this.isExpanded, this.collapsedChild, this.expandedChild})
      : super(key: key);

  @override
  _ExpandableCardContainerState createState() =>
      _ExpandableCardContainerState();
}

class _ExpandableCardContainerState extends State {
  @override
  Widget build(BuildContext context) {
    return new AnimatedContainer(
      duration: new Duration(milliseconds: 200),
      curve: Curves.easeInOut,
      child: widget.isExpanded ? widget.expandedChild : widget.collapsedChild,
    );
  }
}

Use this widget and pass the collapsed child and expanded child and change the value of isExpanded on click of button or text.

 ExpandableCardContainer(
      expandedChild: createExpandedColumn(context),
      collapsedChild: createCollapsedColumn(context),
      isExpanded: widget.model.isExpanded,
 )

Now change the value of isExpanded on click of icon/text

GestureDetector(
  child: Icon(
    widget.model.isExpanded
        ? EvaIcons.chevronDownOutline
        : EvaIcons.chevronUpOutline,
    color: Colors.grey,
    size: 20,
  ),
  onTap: () {
    setState(() {
      widget.model.isExpanded =
          !widget.model.isExpanded;
    });
  },
 ),
)