Как я могу добавить виджет, который находится внизу страницы и прокручивается с помощью ListView?

У меня есть ListView, который строит несколько карт, и под ними я хочу добавить один текстовый виджет, который находится под ListView, но расположен внизу страницы, что означает, что вам нужно прокрутить вниз мимо последней карты, чтобы увидеть его. .

   Widget _buildCardList() {
    return ListView.builder(
      itemBuilder: _buildFoodCards,
      itemCount: cardList.length,
    );
  }

   @override
  Widget build(BuildContext context) {
    return Container(
      // constraints: BoxConstraints.expand(),
      decoration: BoxDecoration(
        gradient: LinearGradient(
          begin: Alignment.topCenter,
          end: Alignment.bottomCenter,
          colors: [Color(0xff170422), Color(0xff9B22E6)],
          stops: [0.75, 1],
        ),
      ),
      child: Column(
        children: <Widget>[
          Expanded(child: _buildCardList()),
          Text(
            'TEXT THAT SHOULD BE SCROLLABLE UNDER THE LISTVIEW',
            style: TextStyle(color: Colors.white),
          )
        ],
      ),
    );
  }

У меня есть текст, который сейчас находится под ListView, но текст на странице статичен и не прокручивается с помощью ListView.

как это выглядит сейчас


person Tony    schedule 27.06.2019    source источник
comment
что именно вы хотите в качестве вывода? пожалуйста, добавьте изображение или дополнительную информацию.   -  person Viren V Varasadiya    schedule 27.06.2019


Ответы (1)


Всего несколько изменений, чтобы все заработало:

  • установите shrinkWrap = true на свой ListView.
  • установите physics = NeverScrollableScrollPhysics на свой ListView.
  • добавьте SingleChildScrollView в качестве родительского элемента для вашего Column.
  • удалите виджет Expanded.

Код


  Widget _buildCardList() {
    return ListView.builder(
      shrinkWrap: true,
      physics: NeverScrollableScrollPhysics(),
      itemBuilder: _buildFoodCards,
      itemCount: cardList.length,
    );
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      // constraints: BoxConstraints.expand(),
      decoration: BoxDecoration(
        gradient: LinearGradient(
          begin: Alignment.topCenter,
          end: Alignment.bottomCenter,
          colors: [Color(0xff170422), Color(0xff9B22E6)],
          stops: [0.75, 1],
        ),
      ),
      child: SingleChildScrollView(
        child: Column(
          children: <Widget>[
            _buildCardList(),
            Text(
              'TEXT THAT SHOULD BE SCROLLABLE UNDER THE LISTVIEW',
              style: TextStyle(color: Colors.white),
            )
          ],
        ),
      ),
    );
  }

Надеюсь, это поможет :)

person diegoveloper    schedule 27.06.2019