Flutter Bottom Overflow on custom bottom sheet - flutter

Question

You can see the problem here (I turned on flutter inspector gridlines so you can see the problem better)
Overflow disappears when I wrap my Container inside Expanded,
but then my search bar height is just stretching and it isn't good. Tried to use SingleChildScrollView but it didn't do the trick.
Container(
margin: const EdgeInsets.symmetric(
horizontal: AppConstants.bottomModalSheetSearchMarin,
vertical: AppConstants.bottomModalSheetSearchMarin),
decoration: BoxDecoration(
color: AppColors.searchBoxBackgroundColor,
borderRadius:
BorderRadius.circular(AppConstants.searchBoxRadius),
),
child: const TextField(
// onChanged: (value)=>controller.filterMountain(value),
decoration: InputDecoration(
hintStyle:
TextStyle(fontSize: AppFontSizes.searchBoxHintText),
hintText: 'Search',
suffixIcon: Icon(
Icons.search,
color: AppColors.searchBoxSearchIconColor,
),
border: InputBorder.none,
contentPadding:
EdgeInsets.all(AppPaddings.searchBoxPadding),
),
),
),
The problem is in the search bar container (we can see that from flutter inspector - show gridlines)
This is how it looks when I wrap Container with Expanded, (don't be bothered with the different look of the cards below)
Edit:
Here is the full bottomSheet code as requested:
bottomNavigationBar: SolidBottomSheet(
draggableBody: false,
headerBar: Container(
child: ClipRRect(
borderRadius: const BorderRadius.only(
topRight: Radius.circular(20),
topLeft: Radius.circular(20)
),
child: OutlinedButton(
child: Column(
children: const [
Icon(Icons.expand_less,),
Text("Search pois")
],
),
onPressed: () {}),
),
),
body: Container(
color:Colors.blue,
child: Column(
children: [
Container(
decoration: BoxDecoration(
color:Colors.red,
borderRadius: BorderRadius.circular(20),
),
child: const TextField(
decoration: InputDecoration(,
hintText: 'Search',
suffixIcon: Icon(Icons.search,),
),
),
),
Obx(
),
],
),
),
),

Answer 1

You can wrap TextFiled's Container with Expanded and enable expanded on TextFiled.
body: Container(
child: Column(
children: [
Expanded(
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(22),
),
child: TextField(
expands: true,
maxLines: null,
minLines: null,
)),
),
],
),
),
SingleChildScrollView also work
body: SingleChildScrollView(
child: Column(
children: [
Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(22),
),
child: TextField(
maxLines: 3,
minLines: 1,
)),
],
),
),
class HomePage extends StatelessWidget {
const HomePage({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(),
bottomNavigationBar: SolidBottomSheet(
draggableBody: true,
headerBar: Container(
child: ClipRRect(
borderRadius: const BorderRadius.only(
topRight: Radius.circular(22), topLeft: Radius.circular(22)),
child: OutlinedButton(
child: Column(
children: const [
Icon(
Icons.expand_less,
),
Text(
"Search pois",
)
],
),
onPressed: () {}),
),
),
body: SingleChildScrollView(
child: Column(
children: [
Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(22),
),
child: TextField(
maxLines: 3,
minLines: 1,
)),
],
),
),
),
);
}
}