#flutter #listview
Вопрос:
У меня есть это «дополнительное пространство» в моем первом элементе listview, который представляет собой карту, помещенную в контейнер. Как мне его удалить?
Widget build(BuildContext context) {
return Container(
padding: EdgeInsets.all(15.0),
height: 300,
child: Column(children: [
Row(children: [
Expanded(
child: Text("Lowest Fuel Price",
style: TextStyle(
fontWeight: FontWeight.w500,
color: Theme.orange3,
fontSize: 16.0)))
]),
Container(
height: 250,
child: Card(
elevation: 3,
child: ListView.builder(
itemCount: cheapest.length,
shrinkWrap: true,
physics: NeverScrollableScrollPhysics(),
itemBuilder: (context, index) {
final item = cheapest[index];
return Column(
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: <Widget>[
Text(
item.petrolType,
style: TextStyle(
color: Theme.gray1, fontSize: 18),
),
Text(
"$" item.petrolPrice,
style: TextStyle(
color: Theme.gray1, fontSize: 25),
),
Image(
fit: BoxFit.fill,
image: new AssetImage(
'assets/images/fuel_station/'
item.petrolStation.toLowerCase()
'.png')),
]),
index != cheapest.length - 1
? Divider(
color: Colors.grey,
)
: Divider(color: Colors.white)
],
);
})),
)
]));
}
Ответ №1:
https://api.flutter.dev/flutter/widgets/ListView-class.html
По умолчанию ListView автоматически заполнит прокручиваемые края списка, чтобы избежать частичных препятствий, обозначенных заполнением MediaQuery. Чтобы избежать такого поведения, переопределите свойство с нулевым заполнением.
Card(
elevation: 3,
child: MediaQuery.removePadding(
context: context,
removeTop: true,
child: ListView.builder(),
),
),
Комментарии:
1. выглядит странно, когда я снимаю верх. у последнего элемента теперь есть заполнение, хотя «removeBottom: true»
2. Попробуйте сделать высоту вашего контейнера динамичной. У вас есть 2 контейнера, высота которых равна 300 и 250, я подозреваю, что проблема в 300. Попробуйте использовать
BoxConstraints.tightForFinite()
в поле ограничения контейнера.3. Мне пришлось придать ему некоторую верхнюю обивку после removeTop = true, чтобы придать ему более однородный вид, и добавить tightForFinite устраняет проблему двойной высоты
4. Нет проблем, если этот ответ решит ваш вопрос, пожалуйста, примите его.