import 'package:flutter/material.dart';

void main() => runApp(const TabBarNotScrollingHome());

class TabBarNotScrollingHome extends StatelessWidget {
  const TabBarNotScrollingHome({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(primarySwatch: Colors.blue),
      home: const TabBarNotScrollingAfterControllerChanged(),
    );
  }
}

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

  @override
  State<TabBarNotScrollingAfterControllerChanged> createState() =>
      _TabBarNotScrollingAfterControllerChangedState();
}

class _TabBarNotScrollingAfterControllerChangedState
    extends State<TabBarNotScrollingAfterControllerChanged>
    with TickerProviderStateMixin {
  final _scrollViewController = ScrollController(initialScrollOffset: 0.0);
  TabController? _tabController;
  late List<Widget> tabPages;
  bool increaseTabs = false;
  int _totalTabs = 10;
  TabBar? _tabBar;

  @override
  void initState() {
    super.initState();
    _generateTabs();
  }

  @override
  void dispose() {
    _tabController?.dispose();
    _scrollViewController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    final buildBody =
        TabBarView(controller: _tabController, children: tabPages);

    return Scaffold(
      body: NestedScrollView(
        controller: _scrollViewController,
        floatHeaderSlivers: true,
        headerSliverBuilder: buildAppBar,
        body: buildBody,
      ),
    );
  }

  List<Widget> buildAppBar(BuildContext context, bool isScrolled) {
    final addButton = IconButton(
      icon: Icon(increaseTabs ? Icons.remove : Icons.add),
      onPressed: () {
        increaseTabs = !increaseTabs;
        _generateTabs();
        setState(() {});
      },
    );

    return <Widget>[
      SliverAppBar(
        title: const Text('Press + to increase tabs =>'),
        bottom: _tabBar,
        pinned: true,
        snap: false,
        primary: true,
        actions: [addButton],
      ),
    ];
  }

  void _generateTabs() {
    if (increaseTabs) {
      _totalTabs = 15;
    } else {
      _totalTabs = 10;
    }
    _tabController = TabController(
        vsync: this, length: _totalTabs, initialIndex: _totalTabs - 1);

    _tabBar = TabBar(
      tabs: List.generate(
          _totalTabs, (index) => Center(child: Tab(text: 'Tab $index'))),
      controller: _tabController,
      isScrollable: true,
    );

    tabPages = List.generate(
      _totalTabs,
      (index) => Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text('Page $index', textAlign: TextAlign.center),
            const SizedBox(height: 20),
            const Text(
              'After pressing the + button to increase the tabs this page '
              'will change but the tab above will not scroll to the last Tab '
              'even though that becomes the selected tab. However if you press '
              'again to decrease the tabs it will scroll to the new last tab',
              textAlign: TextAlign.center,
              style: TextStyle(color: Colors.red),
            ),
          ],
        ),
      ),
    );
  }
}