import 'package:flutter/material.dart';

class StorePages1 extends StatefulWidget {
  const StorePages1({Key? key}) : super(key: key);

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

class _StorePages1State extends State<StorePages1>
    with TickerProviderStateMixin {
  late TabController _tabController;

  @override
  void initState() {
    _tabController = TabController(
      length: 3,
      vsync: this,
    );

    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: NestedScrollView(
          headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
            return [
              SliverToBoxAdapter(
                child: Column(
                  children: [
                    Image.network(
                      "https://images.pexels.com/photos/396547/pexels-photo-396547.jpeg?auto=compress&cs=tinysrgb&h=350",
                      fit: BoxFit.cover,
                    )
                  ],
                ),
              ),
              SliverPersistentHeader(
                delegate: _SliverAppBarDelegate(
                  TabBar(
                    controller: _tabController,
                    tabs: const [
                      Tab(text: "Tab 1"),
                      Tab(text: "Tab 2"),
                      Tab(text: "Tab 3"),
                    ],
                  ),
                ),
                pinned: true,
              ),
            ];
          },
          body: TabBarView(
            controller: _tabController,
            children: [
              ListView(
                children: const [
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                  Text('asdfasjkdfahsdjkl'),
                ],
              ),
              const Center(
                child: Text('Tab 2'),
              ),
              const Center(
                child: Text('Tab 3'),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

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 Container(
      color: Colors.red,
      child: _tabBar,
    );
  }

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