expandable_widgets 1.0.2

A package that provides expandable widgets for Flutter. Written in %100 Dart.

Expandable Widgets

A package that provides expandable widgets for Flutter. Written in %100 Dart.

Examples

General use:

         Expandable(
          primaryWidget: Container(
            height: 30,
            child: Center(child: Text('Hello world!')),
          ),
          secondaryWidget: Container(
            height: 45,
            child: Center(
              child: Column(
                children: [
                  Text('Hello'),
                  Text('World!'),
                ],
              ),
            ),
          ),
          backgroundColor: Colors.grey.withOpacity(0.4),
          showArrowIcon: true,
          centralizePrimaryWidget: true,
          isClickable: true,
          padding: EdgeInsets.all(5.0),
         ),

For a long text:

         ExpandableText(
          elevation: 5,
          padding: EdgeInsets.all(10.0),
          animationDuration: Duration(milliseconds: 500),
          textWidget: Text(
            data,
            maxLines: 3,
            overflow: TextOverflow.ellipsis,
          ),
          showArrowIcon: true,
          initiallyExpanded: false,
          hoverOn: false,
          arrowLocation: ArrowLocation.right,
          finalArrowLocation: ArrowLocation.bottom,
         ),

Extended example:

         Expandable.extended(
          elevation: 10,
          isClickable: false,
          initiallyExpanded: true,
          centralizePrimaryWidget: true,
          centralizeAdditionalWidget: true,
          primaryWidget: Container(
            height: 30,
            child: Center(child: Text('Important Summary')),
          ),
          secondaryWidget: Container(
            height: 70,
            child: Center(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: [
                  Text('More'),
                  Text('Details'),
                  Text('About'),
                  Text('Something'),
                ],
              ),
            ),
          ),
          arrowWidget: Icon(
            Icons.keyboard_arrow_up_rounded,
            color: Colors.blueGrey,
            size: 20.0,
          ),
          additionalWidget: Text('Show me'),
          arrowLocation: ArrowLocation.left,
         ),

Example with background image:

         Expandable(
          primaryWidget: Text('centralizePrimaryWidget: true'),
          secondaryWidget: Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            mainAxisSize: MainAxisSize.max,
            children: [
              Container(width: 30, height: 10, color: Colors.black),
              Container(width: 30, height: 10, color: Colors.black),
              Container(width: 30, height: 10, color: Colors.black),
            ],
          ),
          isClickable: false,
          showArrowIcon: true,
          backgroundImage: DecorationImage(
            image: AssetImage('assets/background.png'),
            repeat: ImageRepeat.repeatX,
          ),
          backgroundColor: Colors.grey.withOpacity(0.3),
          arrowWidget: Icon(
            Icons.arrow_upward_rounded,
            color: Colors.blueGrey,
            size: 20.0,
          ),
          animationDuration: Duration(seconds: 1),
          centralizePrimaryWidget: true,
        ),

Same example with background image but without centralizePrimaryWidget:

         Expandable(
          primaryWidget: Text('centralizePrimaryWidget: false'),
          secondaryWidget: Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            mainAxisSize: MainAxisSize.max,
            children: [
              Container(width: 30, height: 10, color: Colors.black),
              Container(width: 30, height: 10, color: Colors.black),
              Container(width: 30, height: 10, color: Colors.black),
            ],
          ),
          isClickable: false,
          showArrowIcon: true,
          backgroundImage: DecorationImage(
            image: AssetImage('assets/background.png'),
            repeat: ImageRepeat.repeatX,
          ),
          backgroundColor: Colors.grey.withOpacity(0.3),
          arrowWidget: Icon(
            Icons.arrow_upward_rounded,
            color: Colors.blueGrey,
            size: 20.0,
          ),
          animationDuration: Duration(seconds: 1),
          centralizePrimaryWidget: false,
         ),