Блог

Я пытаюсь реализовать сворачивающуюся панель инструментов с вкладками. При прокрутке содержимое вкладки не прилипает к нижней части вкладки, а прокручивается вверх до строки состояния.

Я не уверен, что именно я делаю неправильно. Я хотел бы получить вашу помощь для решения этой проблемы.

Вот фрагмент кода:

 import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:mobile/src/data/model/order_response.dart';
import 'package:mobile/src/widget/order_view.dart';

class OrderDetailPage extends StatefulWidget {
  final OrderResponse item;

  OrderDetailPage(this.item);

  @override
  _OrderDetailPageState createState() => _OrderDetailPageState();
}

class _OrderDetailPageState extends State<OrderDetailPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: DefaultTabController(
        length: 2,
        child: NestedScrollView(
            headerSliverBuilder:
                (BuildContext context, bool innerBoxIsScrolled) {
              return <Widget>[
                SliverAppBar(
                  backgroundColor: Colors.black12,
                  elevation: 0.0,
                  expandedHeight: 230,
                  floating: false,
                  pinned: true,
                  flexibleSpace: FlexibleSpaceBar(
                    collapseMode: CollapseMode.parallax,
                    background: Align(
                      alignment: Alignment.bottomCenter,
                      child: Container(
                        child: Column(
                          children: [
                            SizedBox(
                              height: 90,
                            ),
                            OrderListItemView(widget.item, null)
                          ],
                        ),
                      ),
                    ),
                  ),
                ),
                SliverPersistentHeader(
                  pinned: true,
                  delegate: _SliverAppBarDelegate(
                    TabBar(
                      labelColor: Colors.black87,
                      unselectedLabelColor: Colors.grey,
                      tabs: [
                        new Tab(text: "Instant Match"),
                        new Tab(text: "Requests"),
                      ],
                    ),
                  ),
                )
              ];
            },
            body: new TabBarView(
              children: <Widget>[
                Text(
                  'This content should stick to the bottom of tab bar',
                  style: TextStyle(fontSize: 24),
                ),
                Text('This content should stick to the bottom of tab bar')
              ],
            )),
      ),
    );
  }

  void _onClickMenu(String value) {}
}

class _SliverAppBarDelegate extends SliverPersistentHeaderDelegate {
  _SliverAppBarDelegate(this._tabBar);

  final TabBar _tabBar;

  @override
  double get minExtent => _tabBar.preferredSize.height;

  @override
  double get maxExtent => _tabBar.preferredSize.height;

  @override
  Widget build(
      BuildContext context, double shrinkOffset, bool overlapsContent) {
    return new Container(
      child: _tabBar,
    );
  }

  @override
  bool shouldRebuild(_SliverAppBarDelegate oldDelegate) {
    return false;
  }
}
  

Текущий вывод:

В желаемом выводе содержимое должно располагаться в нижней части панели вкладок.