Flutter Question posted in
The official Flutter documentation can be found here.

Flutter – Problem in widget assignment causing vertical viewport has given unbounded height. How to solve?

I am writing code for a web application, To make it dynamic I am creating the following code. Now when I use the markdown as Expanded the issue starts . I have tried To make things expanded now its going beyond my understanding. I am asking help from the community to solve this and enlighten me. I am attaching the code snippet for better understanding.

Column(
  children: [
    Expanded(
      child: Row(
        children: [
          Expanded(
            flex: 5,
            child:
                Container(), //rest of the container code container a singlechild scrollview as child
          ),
          Expanded(
              flex: 2,
              child: Container(
                padding: const EdgeInsets.all(defaultPadding),
                decoration: BoxDecoration(
                    color: colorScheme.secondary,
                    borderRadius: BorderRadius.circular(20)),
                child: SingleChildScrollView(
                  child: Column(
                    mainAxisSize: MainAxisSize.min,
                    children: [
                      Expanded(
                          child: Markdown(
                              data:
                                  data)), //When I am trying to use this the problem occurs
                    ],
                  ),
                ),
              ))
        ],
      ),
    )
  ],
),

You can run the same thing . I am facing error of vertical viewport has given unbounded height. Now I have tried devtool also but cannot understand what I need to do to solve it???? More over I will add some other widgets on top of that markdown. Please help me by solving it.

Tags:

2

Answers


  1. 0

    Since you are using SingleChildScrollView, it’s content has unbounded height. And you are placing Column as it’s child, using Expanded for that Column can’t decide the height of the child.

    You must set the height of Markdown or wrap it with Flexible, not with Expanded.

    Login or Signup to reply.
  2. 0

    Since you are using an Expanded widget inside the child of the main Column, you cannot again give it SingleChildScrollView as a child as both their sizes are unbounded hence the error. The solution is simply removing the SingleChildScrollChild widget as the parent Expanded widget already takes care of the vertical expansion capability as shown below:

    Column(
      children: [
        Expanded(
          child: Row(
            children: [
              Expanded(
                flex: 5,
                child:
                    Container(), //rest of the container code container a singlechild scrollview as child
              ),
              Expanded(
                  flex: 2,
                  child: Container(
                    padding: const EdgeInsets.all(defaultPadding),
                    decoration: BoxDecoration(
                    color: colorScheme.secondary,
                        borderRadius: BorderRadius.circular(20)),
                    child: Column(
                      mainAxisSize: MainAxisSize.min,
                      children: [
                        Expanded(
                            child: Markdown(
                          data:
                              data)), //When I am
                        // trying to use this the problem occurs
                      ],
                    ),
                  ))
            ],
          ),
        )
      ],
    ),

    Hope this helps and Happy coding!!😊

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search