Issue
Hey I am currently trying to make a page scrollable in flutter/dart.
The problem I have is that the structure is different from anything that I could find online.
It currently looks like that:
@override
Widget build(BuildContext context) {
return new Scaffold(
resizeToAvoidBottomPadding: false,
body: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Container(...),
SizedBox(height: 10.0),
Row(...),
Container(...),
],
),
);
}
I want to make the Row(…) and the second Container(…) scrollable now.
I couldn’t figure it out.
Hopefully you can help me with it!
Thanks in advance
Solution
Wrap your Row
and Container
in a Column
, then wrap that Column
in a SingleChildScrollView
;
@override
Widget build(BuildContext context) {
return Scaffold(
resizeToAvoidBottomPadding: false,
body: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Container(),
SizedBox(height: 10.0),
SingleChildScrollView(
child: Column(
children: <Widget>[
Row(...),
Container(...),
],
),
)
],
),
);
}
p.s. as of Dart 2.0 you no longer need the new
keyword in front of your Scaffold
.
Answered By – SupposedlySam
Answer Checked By – Senaida (FlutterFixes Volunteer)