Home > database >  Adapt a Card height according to content in Flutter
Adapt a Card height according to content in Flutter

Time:02-21

I have a Card, consisting of a title, a description and an iconbutton bar at the bottom .

Only the description has a variable size.

I want that when my card is created it adapts its height

Here the widget for the description :

///Widget for the description of the post
  Widget _descriptionPost()
  {
    return Container(
      margin: const EdgeInsets.only(left: 7, top: 10),
      child: Text(
        widget.postModel.descriptionPost,
        maxLines: 4,
        overflow: TextOverflow.ellipsis,
        style: const TextStyle(fontSize: 16),
      ),
    );
  }

Here's the build :

@override
  Widget build(BuildContext context) {
    return Container(
      width: MediaQuery.of(context).size.width/1.2,
      height: HERE I WANT ADAPT THE HEIGHT,
      margin: const EdgeInsets.only(left: 5, right: 5, top: 5, bottom: 5),
      child: Card(
        elevation: 3,
        child: InkWell(
          onTap: ()
          {
            Navigator.pushNamed(context, '/post_detail', arguments: widget.postModel);
          },
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              _profilePicAndUsernameAndTime(),
              _titlePostAndNameGame(),
              _descriptionPost(),
              Spacer(),
              _bottomBar()
            ],
          ),
        ),
      ),
    );
  }

CodePudding user response:

You should use the constraints property of your Container and set it accordingly to your needs.

constraints: const BoxConstraints(minHeight: 0, maxHeight: 200.0)

This will ensure that your Container will have any H value between 0 and 200.0, based on its child.

However, have in mind, that if the child needs more height than your maxHeight, you'll experience an overflow, so you should only use this if you have a maximum height as requisite, otherwise just leave it blank.

  • Related