CODEWITHSUNDEEP
flutter
Ali Alqallaf
Ali Alqallaf

Reputation: 1017

how to use spacer inside a column that is wrapped with singlechildscrollview?

I am trying to use spacer inside a column that is wrapped with singlechildscrollview and it gives me an error.

RenderFlex children have non-zero flex but incoming height constraints are unbounded.

here is my widget

class Test extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Form(
        child: SingleChildScrollView(
      child: Column(
        children: <Widget>[
          TextFormField(),
          TextFormField(),
          //Spacer()
          Divider(),
          Icon(Icons.block)
        ],
      ),
    ));
  }
}

what should i use? your help is appreciated

Upvotes: 23

Views: 8598

Answers (2)

Paras Arora
Paras Arora

Reputation: 703

We can add Spacer in SingleChildScrollview by assigning height to its Child widget and if we want Scrollable effect in Smaller device and Unscrollable effect on bigger device. we can check device is small or big base on this we assign physics property . As you can see below.

enter image description here

Function to check device is small or big.

          isSmallDevice(Size size)
            {
              return size.height < 675;
            }

Youtube Demo link:

https://www.youtube.com/watch?v=9zHMuv6_oPk

Github Repo link: https://github.com/paras-28/Using-spacer-inside-Scrollview

Upvotes: -1

timilehinjegede
timilehinjegede

Reputation: 14043

You can try this out, I added an example using your code, it works:

class Test extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(body: LayoutBuilder(
      builder: (context, constraint) {
        return Form(
          child: SingleChildScrollView(
            child: ConstrainedBox(
              constraints: BoxConstraints(minHeight: constraint.maxHeight),
              child: IntrinsicHeight(
                child: Column(
                  children: <Widget>[
                    TextFormField(),
                    TextFormField(),
                    Spacer(),
                    Divider(),
                    Icon(Icons.block)
                  ],
                ),
              ),
            ),
          ),
        );
      },
    ));
  }
}

Check this Github issue for much details on the solution above: Wrapping a Column with an expanded in a SingleChildScrollView throws an exception

Upvotes: 33

Related Questions