sdv.development
sdv.development

Reputation: 177

How to dynamically extend the CARD widget height size based on the text in the card?

So if I put a lot of text in a widget card the text will exceed the card widget and I can t see anymore the rest of it.

Only if I manually the size of each card it will show all the text.

Is it possible to dynamically extend the CARD widget height size based on the text in the card?

For example, no matter how much text I put there the height of the card it will extend in order to show all the text in it.

The code:

    Widget _card(
      {Color primary = Colors.redAccent,
      String imgPath,
      String chipText1 = '',
      String chipText2 = '',
      Widget backWidget,
      Color chipColor = LightColor.orange,
      bool isPrimaryCard = false}) {
    return Container(          
        height: isPrimaryCard ? 500 : 500,
        width: isPrimaryCard ? width * .90 : width * .90,
        margin: EdgeInsets.symmetric(horizontal: 10, vertical: 20),
        decoration: BoxDecoration(
            color: primary.withAlpha(200),
            borderRadius: BorderRadius.all(Radius.circular(20)),
            boxShadow: <BoxShadow>[
              BoxShadow(
                  offset: Offset(0, 5),
                  blurRadius:
                      10, 
                  color: LightColor.lightpurple.withAlpha(20))
            ]),
        child: ClipRRect(
          borderRadius: BorderRadius.all(Radius.circular(20)),
          child: Container(
            child: Stack(
              children: <Widget>[
                backWidget,
                Positioned(                      
                    top: 20,
                    left: 10,
                    child: CircleAvatar(                         
                      backgroundColor: Colors.transparent,
                      backgroundImage: NetworkImage(imgPath),
                    )),
                Positioned(                      
                  top: 30,
                  left: 20,
                  child: _cardInfo(chipText1, chipText2,
                      LightColor.titleTextColor, chipColor,
                      isPrimaryCard: isPrimaryCard),
                )
              ],
            ),
          ),
        ));
  }

Upvotes: 4

Views: 5231

Answers (1)

MickaelHrndz
MickaelHrndz

Reputation: 3832

You might want to use a ConstrainedBox. It allows you to set a minimum height, but can expand if needed :

Card(
  child: ConstrainedBox(
    constraints: BoxConstraints(
      minHeight: 100,
    ),
    child: Text("")
  )
)

Upvotes: 2

Related Questions