import 'package:common_module/shelf.dart';
import 'package:flutter/material.dart';
import 'package:extended_nested_scroll_view/extended_nested_scroll_view.dart';
import 'package:extended_tabs/extended_tabs.dart';

class ExtendedTestWidget extends StatefulWidget {
  const ExtendedTestWidget({super.key});

  @override
  State<ExtendedTestWidget> createState() => _ExtendedTestWidgetState();
}

class _ExtendedTestWidgetState extends State<ExtendedTestWidget> with TickerProviderStateMixin{
  late final TabController primaryTC;
  TabController? mainTabController;
  final GlobalKey<ExtendedNestedScrollViewState> _key =
  GlobalKey<ExtendedNestedScrollViewState>();

  @override
  void initState() {
    super.initState();
    // primaryTC = TabController(length: 4, vsync: this);
    mainTabController = TabController(length: 4, initialIndex: 0, vsync: this);
  }

  @override
  void dispose() {
    // primaryTC.dispose();
    mainTabController?.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: _buildScaffoldBody(),
      floatingActionButton: FloatingActionButton(
        child: const Icon(Icons.file_upload),
        onPressed: () {
          ///scroll current tab list
          _key.currentState?.outerController.animateTo(
            0.0,
            duration: const Duration(seconds: 1),
            curve: Curves.easeIn,
          );

          ///scroll all tab list
          // _key.currentState.innerScrollPositions.forEach((position) {
          //   position.animateTo(0.0,
          //       duration: Duration(seconds: 1), curve: Curves.easeIn);
          // });
        },
      ),
    );
  }

  Widget _buildScaffoldBody() {
    final double statusBarHeight = MediaQuery.of(context).padding.top;
    final double pinnedHeaderHeight =
    //statusBar height
    statusBarHeight +
        //pinned SliverAppBar height in header
        kToolbarHeight;
    return ExtendedNestedScrollView(
      key: _key,
      onlyOneScrollInBody: true,
      headerSliverBuilder: (BuildContext c, bool f) {
        return <Widget>[
          SliverAppBar(
            pinned: true,
            expandedHeight: 200.0,
            title: const Text('scroll to top'),
            flexibleSpace: FlexibleSpaceBar(
              //centerTitle: true,
              collapseMode: CollapseMode.pin,
              background: Image.asset('assets/images/bg_common_dialog.png',
                  package: CommonModuleConstant.PACKAGE_NAME,
                  fit: BoxFit.fill),
            ),
          ),
        ];
      },
      //1.[pinned sliver header issue](https://github.com/flutter/flutter/issues/22393)
      pinnedHeaderSliverHeightBuilder: () {
        return pinnedHeaderHeight;
      },

      body: Column(
        children: <Widget>[
          TabBar(
            // controller: primaryTC,
            controller: mainTabController,
            labelColor: Colors.blue,
            indicatorColor: Colors.blue,
            indicatorSize: TabBarIndicatorSize.label,
            indicatorWeight: 2.0,
            isScrollable: false,
            unselectedLabelColor: Colors.grey,
            tabs: const <Tab>[
              Tab(text: 'Tab0'),
              Tab(text: 'Tab1'),
              Tab(text: 'Tab2'),
              Tab(text: 'Tab3'),
            ],
          ),

          Expanded(
            child: ExtendedTabBarView(
              // controller: primaryTC,
              physics: null,
              cacheExtent: 4,
              controller: mainTabController,
              children: <Widget>[
                ListView.builder(
                  //store Page state
                  key: const PageStorageKey<String>('Tab0'),
                  physics: const ClampingScrollPhysics(),
                  itemBuilder: (BuildContext c, int i) {
                    return Container(
                      alignment: Alignment.center,
                      height: 60.0,
                      child:
                      Text(const Key('Tab0').toString() + ': ListView$i'),
                    );
                  },
                  itemCount: 50,
                ),
                ListView.builder(
                  //store Page state
                  key: const PageStorageKey<String>('Tab1'),
                  physics: const ClampingScrollPhysics(),
                  itemBuilder: (BuildContext c, int i) {
                    return Container(
                      alignment: Alignment.center,
                      height: 60.0,
                      child:
                      Text(const Key('Tab1').toString() + ': ListView$i'),
                    );
                  },
                  itemCount: 50,
                ),
                ListView.builder(
                  //store Page state
                  key: const PageStorageKey<String>('Tab2'),
                  physics: const ClampingScrollPhysics(),
                  itemBuilder: (BuildContext c, int i) {
                    return Container(
                      alignment: Alignment.center,
                      height: 60.0,
                      child:
                      Text(const Key('Tab2').toString() + ': ListView$i'),
                    );
                  },
                  itemCount: 50,
                ),
                ListView.builder(
                  //store Page state
                  key: const PageStorageKey<String>('Tab3'),
                  physics: const ClampingScrollPhysics(),
                  itemBuilder: (BuildContext c, int i) {
                    return Container(
                      alignment: Alignment.center,
                      height: 60.0,
                      child:
                      Text(const Key('Tab3').toString() + ': ListView$i'),
                    );
                  },
                  itemCount: 50,
                ),
              ],
            ),
          )
        ],
      ),
    );
  }
}