Горизонтальный флаттер ListView БЕЗ явной высоты - PullRequest
Новая
       33

Горизонтальный флаттер ListView БЕЗ явной высоты

0 голосов
/ 13 февраля 2019

Я пытаюсь создать горизонтальную прокрутку listview.builder() без заданной высоты.

Я пытался установить shrinkwrap в значение true и обернуть его внутри расширенного / гибкого.

Единственный способ (который я нашел) в настоящее время достичь желаемого эффекта - это обернутьстрока внутри singlechildscrollview внутри столбца, согласно этому ответу ( Флаттер: минимальная высота при горизонтальном просмотре списка ).

Проблема этого метода заключается в том, что не существует метода построителя для загрузки динамических данных в карты внутри singlechildscrollview.

Мой вопрос заключается в том, как создать горизонтальный listview, который генерирует выходные данные с помощью row, вложенного в singlechildscrollview ( Флаттер: минимальная высота в горизонтальном представлении списка )но с методом конструктора?

с гибким 

Scaffold(
  body: Container(
    child: Column(
      mainAxisSize: MainAxisSize.min,
      children: <Widget>[
        Flexible(
          child: ListView.builder(
            scrollDirection: Axis.horizontal,
            itemCount: 3,
            itemBuilder: (BuildContext context, int index) {
              return FeaturedCard();
            },
          ),
        ),
        Flexible(
          child: ListView.builder(
            shrinkWrap: true,
            itemCount: 10,
            itemBuilder: (BuildContext context, int index) {
              return FeaturedCard();
            },
          ),
        ),
      ],
    ),
  ),
)

результат : https://i.stack.imgur.com/XKiWo.jpg

сrow 1035 * (метод, который работает) 

 Container(
  padding: EdgeInsets.only(top: 16, bottom: 8),
  child: Column(
    mainAxisSize: MainAxisSize.min,
    children: <Widget>[
      SingleChildScrollView(
        scrollDirection: Axis.horizontal,
        child: Row(
          children: <Widget>[
            FeaturedCard(),
            FeaturedCard(),
          ],
        ),
      ),
    ],
  ),
)

Результат: https://i.stack.imgur.com/va3TY.jpg

Обратите внимание на добавленное пространство внутри картыпри использовании гибкого (это фактически делает хуже на разных устройствах)

PS извините за качество изображения!:)

Решил проблему, создав собственный метод конструктора, например: 

  Widget _buildFeaturedCards(List<Product> product) {
final cards = <Widget>[];
Widget FeautredCards;

if (product.length > 0) {
  for (int i = 0; i < product.length; i++) {
    cards.add(FeaturedCard(product[i]));
    print(product.length);
  }
  FeautredCards = Container(
    padding: EdgeInsets.only(top: 16, bottom: 8),
    child: Column(
      mainAxisSize: MainAxisSize.min,
      children: <Widget>[
        SingleChildScrollView(
          scrollDirection: Axis.horizontal,
          child: Row(children: cards),
        ),
      ],
    ),
  );
} else {
  FeautredCards = Container();
}
return FeautredCards;}

1 Ответ

0 голосов
/ 13 февраля 2019

Среда Flutter может знать высоту виджета только после его создания.

Если вы строите ListView потомков динамически, он не может рассчитать требуемую высоту ListView, пока не будут построены все его потомки, что может никогда не произойти (бесконечно ListView).

Вы можете либо задать ListView фиксированную высоту и динамически построить его дочерние элементы, либо иметь высоту ListView's, зависящую от его дочерних элементов, и в этом случае вам нужно будет построить все его дочерние элементы заранее.

...