Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

flutter - correct way to create a box that starts at minHeight, grows to maxHeight

Tags:

flutter

dart

I have a container that I want to start off at a minimum size and grow (if its contents grow while user is adding content) to a maximum size, then stop.

The correct widget for this seems to be ConstrainedBox, like so:

new ConstrainedBox(   constraints: new BoxConstraints(     minHeight: 35.0,     maxHeight: 60.0,   ),   child: ...child with growing content (has default height 25.0)... ), 

however, this starts the box off at the maxHeight.

I tried to use hasBoundedHeight, but can not seem to construct the correct syntax for it or find an example in documentation.

What is the best way to get the box working as described?

like image 729
Deborah Avatar asked Feb 08 '18 00:02

Deborah


People also ask

How do you set the container height limit in Flutter?

Are you trying to set minimum or maximum height or width of Container() widget in a Flutter, then use ' constraints ' attribute and apply BoxConstraints() on it like below. Alternatively, you can use ConstrainedBox() like below.

What is the minimum height to container in Flutter?

If you'll give only minHeight parameter for eg. 300, the child will be of minimum height and will increase its size according to its content. If height required by SomeWidget() is less than 300, it will be of height 300. Otherwise, it will increase it's height accordingly.

What is box constraint Flutter?

BoxConstraints is a built-in widget in flutter SDK. Its functionality is to add sized constraints on its child widget. It is usually taken as the object of constraints property in ConstrainedBox widget. It comes packed with many properties for customization.


1 Answers

There's no notion of "Starts from max/min size".

The thing is, ContrainedBox only add constraints to it's child. But in the end, it doesn't pick a size.

If you want your child to hit minSize, then they have to not expend. Which translate into not having a width/height of double.INFINITY. Fact is that double.INFINITY is the default value of many widgets, including Container.

On the other hand, some widgets such as DecoratedBox have a default size of 0. Which means that this code :

return new ConstrainedBox(   constraints: new BoxConstraints(     minHeight: 5.0,     minWidth: 5.0,     maxHeight: 30.0,     maxWidth: 30.0,   ),   child: new DecoratedBox(     decoration: new BoxDecoration(color: Colors.red),   ), ); 

Will render a 5.0*5.0 red square.

like image 157
Rémi Rousselet Avatar answered Sep 26 '22 01:09

Rémi Rousselet