Как закрепить контейнер или любой другой виджет под панелью приложения в представлении прокрутки во флаттере - PullRequest
Новая
       96

Как закрепить контейнер или любой другой виджет под панелью приложения в представлении прокрутки во флаттере

0 голосов
/ 09 апреля 2020

Я хочу, чтобы виджет размещался под приложением при прокрутке экрана. Экран содержит плавающую панель приложения с гибким пространством (sliverappbar) и под ним один контейнер, который имеет любой контейнер или вид вкладки. Видео в ссылке является примером эффекта, который я хотел.

Ответы [ 2 ]

0 голосов
/ 29 апреля 2020

Хорошо, я думаю, что понимаю вас сейчас. Вам нужно будет реализовать CustomScrollView 

CustomScrollView(
              slivers: <Widget>[
                SliverAppBar(
                    // Your appbar goes here
                    ),
                SliverPersistentHeader(
                  pinned: true,
                  delegate: PersistentHeader(
                    widget: Row(
                      // Format this to meet your need
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: <Widget>[
                        Text('Hello World'),
                        Text('Hello World'),
                        Text('Hello World'),
                      ],
                    ),
                  ),
                ),
              ],
            ),

Создать новый класс для постоянного заголовка, который расширяет SliverPersistentHeaderDelegate, как показано: 

class PersistentHeader extends SliverPersistentHeaderDelegate {
  final Widget widget;

  PersistentHeader({this.widget});

  @override
  Widget build(
      BuildContext context, double shrinkOffset, bool overlapsContent) {
    return Container(
      width: double.infinity,
      height: 56.0,
      child: Card(
        margin: EdgeInsets.all(0),
        color: Colors.white,
        elevation: 5.0,
        child: Center(child: widget),
      ),
    );
  }

  @override
  double get maxExtent => 56.0;

  @override
  double get minExtent => 56.0;

  @override
  bool shouldRebuild(SliverPersistentHeaderDelegate oldDelegate) {
    return true;
  }
}

Дайте мне знать, если вы столкнетесь с какой-либо другой выпуск.

0 голосов
/ 23 апреля 2020

У меня есть идея решения вашей конкретной проблемы: недавно я реализовал что-то очень похожее или идентичное тому, что вы хотите, но я не могу найти ссылку, о которой вы говорили, на видео эффекта, который вы пытаетесь достичь. Не могли бы вы отредактировать и загрузить ссылку на видео, чтобы я мог просмотреть ее, чтобы я смог найти точное решение вашей проблемы?

...