'Column in column widget overflow, how to fix?
I got an error while adding Column to Column. I need the whole page to scroll except for these elements: LogoAppBar and BackStepWidget. Therefore, I created a new column inside the column in which I placed all the widgets for scrolling and wanted to wrap the clone in a SingleChildScrollView but ran into a widget overflow problem (I attached a screenshot below). Tell me how to solve this error and make scrollable those elements that I need and not the whole page?
body
Column(
children: [
const LogoAppBar(isPadding: false),
const SizedBox(height: 24),
BackStepWidget(
text: 'Balance after sending: $coins',
textStyle: constants.Styles.bigHeavyTextStyleWhite),
Column(
children: [
const Text('Send JoinCoins',
style: constants.Styles.bigHeavyTextStyleWhite),
const Image(
image: AssetImage('assets/images/image.png'),
),
const Text('I Want To Send',
style: constants.Styles.smallBoldTextStyleWhite),
const SizedBox(height: 10),
const CoinsCounterWidget(),
const SizedBox(height: 10),
const Text('JoynCoins',
style: constants.Styles.smallBoldTextStyleWhite),
const SizedBox(height: 19),
ClipRRect(
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 8.0, sigmaY: 8.0),
child: Container(
decoration: BoxDecoration(
borderRadius:
const BorderRadius.all(Radius.circular(24)),
color: constants.Colors.greyDark.withOpacity(0.5),
),
child: Padding(
padding:
const EdgeInsets.only(top: 21, left: 12, right: 24),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
const Text(
'Close Connection',
style:
constants.Styles.smallerHeavyTextStyleWhite,
),
Padding(
padding:
const EdgeInsets.only(top: 8, bottom: 17),
child: SizedBox(
height: 188,
child: FriendsList(
isFavourites: true,
controller: controller1,
)),
),
const Text(
'Other Connection',
style:
constants.Styles.smallerHeavyTextStyleWhite,
),
const SizedBox(height: 8),
const SearchWidget(),
Padding(
padding:
const EdgeInsets.only(top: 17, bottom: 15),
child: SizedBox(
height: 188,
child: FriendsList(
isFavourites: false,
controller: controller2,
),
),
),
],
),
),
),
),
),
const Padding(
padding:
EdgeInsets.only(top: 19, bottom: 50, left: 12, right: 12),
child: DefaultButtonGlow(
text: 'Buy Now',
color: constants.Colors.purpleMain,
textStyle: constants.Styles.buttonTextStyle,
shadowColor: constants.Colors.purpleMain,
borderColor: constants.Colors.purpleMain),
),
],
),
],
),
Solution 1:[1]
Your inner Column of ClipRRect children is not getting enough height, you can reduce the height of SizedBox or wrap with scrollable widget like SingleChildScrollView
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | Yeasin Sheikh |

