我正试图在网格视图顶部的一行中构建一个搜索栏和一个按钮,屏幕上显示的一切都很好,但当我将搜索栏包裹在行中时,整个屏幕消失了,我知道行会扩展并占据所有空间,所以我试着将其包裹在扩展的小部件中,就像列中的网格视图一样,但仍然没有显示,我该怎么办?
Scaffold(
body: Center(
child: StreamBuilder(
stream: _stream,
builder: (context, snapshot) {
if (snapshot.hasData) {
var myData = [];
myData = snapshot.data as List<dynamic>;
return Column(
children: [
Center(child: AppLogo()),
Row(
children: [
Padding(
padding: const EdgeInsets.all(8.0),
child: TextField(
decoration: InputDecoration(
fillColor: kLavieGrey,
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(7),
borderSide: const BorderSide(
color: kLavieGrey,
),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(7),
borderSide: BorderSide(color: Colors.grey),
),
filled: true,
hintText: 'Search',
prefixIcon: Icon(
Ionicons.search,
color: Colors.grey,
),
),
),
),
],
),
Expanded(
child: GridView.builder(
gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
maxCrossAxisExtent:
MediaQuery.of(context).size.width * 0.5,
childAspectRatio: 1 / 1.4,
),
itemCount: myData.length,
itemBuilder: (context, i) => Center(
child: ProductCard(
i,
myData[i],
),
),
),
),
],
);
}
return const CircularProgressIndicator();
}),
),
);
这可能是由溢出引起的
您应该尝试为Row
中的每个孩子添加Flexible
小部件,以正确调整它们的大小。