我想知道如何在list view
下添加一个按钮,并通过按钮添加到此列表视图,而不会出现错误,这是通过使a scrollable list view
我想要这个,因为当添加到列表视图从按钮列表视图得到一个错误的屏幕上
这是错误
════════ Exception caught by rendering library ═════════════════════════════════
The following assertion was thrown during layout:
A RenderFlex overflowed by 47 pixels on the bottom.
The relevant error-causing widget was
Column
alert_list_screen.dart:39
You can inspect this widget using the 'Inspect Widget' button in the VS Code notification.
The overflowing RenderFlex has an orientation of Axis.vertical.
The edge of the RenderFlex that is overflowing has been marked in the rendering with a yellow and black striped pattern. This is usually caused by the contents being too big for the RenderFlex.
Consider applying a flex factor (e.g. using an Expanded widget) to force the children of the RenderFlex to fit within the available space instead of being sized to their natural size.
This is considered an error condition because it indicates that there is content that cannot be seen. If the content is legitimately bigger than the available space, consider clipping it with a ClipRect widget before putting it in the flex, or using a scrollable container rather than a Flex, like a ListView.
The specific RenderFlex in question is: RenderFlex#50fae relayoutBoundary=up6 OVERFLOWING
════════════════════════════════════════════════════════════════════════════════
我的代码(屏幕和可重用小部件)
注:我使用cubit,newDepot
列表是存储数据的地方
var depot = DepotDatabaseCubit.get(context).newDepotList;
Expanded(
child: Container(
child: depotBuilder(
depot: depot,
),
),
),
Container(
child: elevatedButton(
name: 'Add new depot',
onPressed: () {
....
},
),
),
elevatedButton
是一个可以看到普通按钮的普通可重用小部件,但我只是将子小部件更改为名称,以便为按钮添加标签depotBuilder
小部件此小部件通过列表视图将数据和演示带到屏幕上
Widget depotBuilder({required List<Map> depot}) {
return ListView.builder(
shrinkWrap: true,
physics: NeverScrollableScrollPhysics(),
itemBuilder: (context, index) => depotItem(
context: context,
model: depot[index],
),
itemCount: depot.length,
);
}
depotItem
是列表视图的项当运行应用程序时,您将为列表视图添加新项
Widget depotItem({
required Map model,
required BuildContext context,
}) {
return Padding(
padding: const EdgeInsets.all(5),
child: Container(
height: 56,
decoration: BoxDecoration(
color: Colors.white,
boxShadow: [
containerBoxShadow(),
],
borderRadius: BorderRadius.circular(8),
),
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 10, horizontal: 10),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
textBaseline: TextBaseline.alphabetic,
children: [
SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Text(
...
),
),
],
),
),
),
);
}
2条答案
按热度按时间vfhzx4xs1#
您可以尝试使用扩展列表视图和按钮如下。
vjrehmav2#
您可以在Column中使用SingleChildScrollView(),例如: