I am trying to create a floating search bar for my flutter application and it is throwing me the following exception:
Exception has occurred.
FlutterError (BoxConstraints forces an infinite height.
These invalid constraints were provided to RenderSemanticsAnnotations's layout() function by the following function, which probably computed the invalid constraints in question:
RenderBox.layout (package:flutter/src/rendering/box.dart:2430:11)
The offending constraints were:
BoxConstraints(w=411.4, h=Infinity))
The following is the function code and the body of the view I am trying to display it in, respectivly:
Widget buildFloatingSearchBar(BuildContext context) {
final isPortrait = MediaQuery.of(context).orientation == Orientation.portrait;
return FloatingSearchBar(
hint: 'Search...',
scrollPadding: const EdgeInsets.only(top: 16, bottom: 56),
transitionDuration: const Duration(milliseconds: 800),
transitionCurve: Curves.easeInOut,
physics: const BouncingScrollPhysics(),
axisAlignment: isPortrait ? 0.0 : -1.0,
openAxisAlignment: 0.0,
width: isPortrait ? 600 : 500,
debounceDelay: const Duration(milliseconds: 500),
onQueryChanged: (query) {
// Call your model, bloc, controller here.
},
// Specify a custom transition to be used for
// animating between opened and closed stated.
transition: CircularFloatingSearchBarTransition(),
actions: [
FloatingSearchBarAction(
showIfOpened: false,
child: CircularButton(
icon: const Icon(Icons.place),
onPressed: () {},
),
),
FloatingSearchBarAction.searchToClear(
showIfClosed: false,
),
],
builder: (context, transition) {
return ClipRRect(
borderRadius: BorderRadius.circular(8),
child: Material(
color: Colors.white,
elevation: 4.0,
child: Column(
mainAxisSize: MainAxisSize.min,
children: Colors.accents.map((color) {
return Container(height: 112, color: color);
}).toList(),
),
),
);
},
);
}
the body:
body: SingleChildScrollView(
//scroll widget
child: Column(
children: [
Stack(
fit: StackFit.expand,
//stack widgets on top of each other
children: <Widget>[
Image.asset(
//loads an image on to the app
'images/map.png',
),
SizedBox(
//a box of dimensions 400x400 and an x-y scale of 200 starting from the top left and going downwards and right
width: 400,
height: 400,
child: CustomPaint(
//paint
painter: LocationCircles(),
),
),
buildFloatingSearchBar(context),
],
),
],
),
),
I tried putting the buildFloatingSearchBar function inside a Flexible() widget but that didn't work either
This is what eventually worked for me inside a
Stack()
widget.Keep in mind that this is implementing a widget using the material_floating_search_bar library.