0

I want to have a line that has 100% parent height, the line should has a fluid height following it's parent's height. the parent's height would be dynamic because every content has it's own height. Just like in Path app.

This is my app, currently I'm setting the height as a constant, how to make it dynamic following it's parent's height? :

Container(
  width: 1,
  color: Colors. redAccent,
  height: 300, // <-- this height
)

screenshoot

Galih laras prakoso
  • 689
  • 2
  • 7
  • 22
  • could you show me the code example? – Galih laras prakoso Jun 20 '20 at 04:19
  • Does this answer your question? [The equivalent of wrap\_content and match\_parent in flutter?](https://stackoverflow.com/questions/42257668/the-equivalent-of-wrap-content-and-match-parent-in-flutter) – Claudio Redi Jun 20 '20 at 04:22
  • Using `LayoutBuilder` should be working in this case. You can get parent's `maxHeight` from its constraint and using that info to determine the red line height. – The Vinh Luong Jun 20 '20 at 04:23
  • Using LayoutBuilder constraints.maxHeight throws an error : ``` flutter: The following assertion was thrown during performLayout(): flutter: BoxConstraints forces an infinite height. flutter: These invalid constraints were provided to _RenderColoredBox's layout() function by the following flutter: function, which probably computed the invalid constraints in question: flutter: RenderConstrainedBox.performLayout (package:flutter/src/rendering/proxy_box.dart:270:13) ``` – Galih laras prakoso Jun 20 '20 at 04:29
  • Container( width: 1, color: Colors. redAccent, height: constraints.maxHeight, // <-- this height ) That is my code, throwing an error. @TheVinhLuong – Galih laras prakoso Jun 20 '20 at 04:29
  • @Galihlarasprakoso from your images i think you are trying to do something similar to [shared-axis](https://pub.dev/packages/animations#shared-axis) pattern. – dev-aentgs Jun 20 '20 at 05:58
  • i was try it and try layoutbuilder with return container and height : constraint.maxheight * 0.5. it give error infinity it "Another exception was thrown: BoxConstraints forces an infinite height." – Michael Fernando Aug 26 '21 at 06:02

2 Answers2

0

try to use the Expanded Widget which uses the available space. you just have to definewhat is the available space here

Expanded(
          child: Container(
            color: Colors.amber,
            width: 100,
          ),
        ),

here, if you dont put something on top of the expanded, it will take all the screen and if not on the bottom, it will reach the bottom of the screen.

it takes the whole free space.

0

I solved this by adding container and add border left :)

Galih laras prakoso
  • 689
  • 2
  • 7
  • 22
  • i was try it and try layoutbuilder with return container and height : constraint.maxheight * 0.5. it give error infinity it "Another exception was thrown: BoxConstraints forces an infinite height." – Michael Fernando Aug 26 '21 at 06:03