skip to Main Content

Design of the web I am building

I am trying to build the website as per the design, however I have been getting overflowed errors.
I am looking for advice/s on how I can avoid these errors, I am using a LayoutBuilder and getting the maxWdth and maxHeight, I then scale the sizes of my widgets using this two constraints. The whole page is in a SingleChildScrollView, except the navigation bar which is in the Appbar.

Any advise on how I can achieve a responsive page with no overflowed errors?
Ideas on the widgets that I can use for the components of the page, would be appreciated.

(I want to have a website that scales with screensize.)

2

Answers


  1. final renderBox = context.findRenderObject() as RenderBox;
    final size = renderBox.size;
    

    Maybe try using constraints in the container using these size.width or size.height

    You can also using SingleChildScrollView() to handle the overflow.

    Login or Signup to reply.
  2. Use Expandeds, Flexibles, in combination with Rows and Columns. This will allow you to make the content dynamically resize.

    You can also use this to get the maximum screen height and width dynamically, which will update automatically upon the user resizing their screen:

    var size = MediaQuery.of(context).size where you can do:

    print(size.height) and print(size.width) to get the max height/width values of the screen.

    Also, you can wrap content in the SingleChildScrollView widget that will allow content to overflow, but then be scrollable as well.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search