Here is my code layout

PlayerProfile
├─ NestedScrollView
│  ├─ SliverAppBar (collapsible)
│  │  ├─ ProfileHeader (banner + info)
│  │  └─ ActionButtons
│  ├─ SliverPersistentHeader (TabBar)
│  └─ TabBarView
│     ├─ HomeTab (posts with infinite scroll)
│     ├─ PositionTab
│     ├─ AwardsTab
│     └─ ... (other tabs)

HomeTab
├─ RefreshIndicator
└─ ListView
   └─ Posts (paginated content)

PostBloc
├─ Events
│  ├─ FetchPosts
│  ├─ FetchMorePosts
│  └─ ... (other events)
└─ States
   ├─ Initial
   ├─ Loading
   ├─ Loaded(posts, hasMore)
   └─ Error

class PlayerProfile extends StatefulWidget {
  @override
  State<PlayerProfile> createState() => _PlayerProfileState();
}

class _PlayerProfileState extends State<PlayerProfile> with SingleTickerProviderStateMixin {
  late TabController _tabController;
  final ScrollController _mainScrollController = ScrollController();
  
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: NestedScrollView(
        controller: _mainScrollController,
        headerSliverBuilder: (context, innerBoxIsScrolled) => [
          SliverAppBar(...),
          SliverPersistentHeader(TabBar(...))
        ],
        body: TabBarView([contains multiple tabs along with HomeTab])
      )
    );
  }
}

// Home tab with infinite scroll
class HomeTab extends StatefulWidget {
  @override
  State<HomeTab> createState() => _HomeTabState();
}

class _HomeTabState extends State<HomeTab> {
  final ScrollController _scrollController = ScrollController();

  @override
  void initState() {
    super.initState();
    _scrollController.addListener(_onScroll);
  }

  void _onScroll() {
    // Trying to detect when to load more posts
    // This is where the main issue is
  }
}
 

The exact problem I am facing is to implement the infinite scroll pagination with tabbar. I was able to achieve it in some way, but the scroll behaviour for sliverappbar and body was not how I wanted [it should be like facebook's Profile UI ]

PlayerProfile
├─ NestedScrollView
│  ├─ SliverAppBar (collapsible)
│  │  ├─ ProfileHeader (banner + info)
│  │  └─ ActionButtons (edit profile, add friend, etc.)
│  ├─ SliverPersistentHeader (TabBar)
│  └─ TabBarView
│     ├─ HomeTab (posts with infinite scroll)
│     ├─ PositionTab (positions info of the player)
│     ├─ AwardsTab (awards list)
│     └─ ... (other tabs like stats, achievements, etc.)

HomeTab
├─ ScrollController (used for ScrollListener to detect when to load more posts)
│  └─ ScrollListener (trigger FetchMorePosts when 43% scroll extent reached)
├─ RefreshIndicator (for manual data refresh)
└─ ListView (scrollable content)
   └─ Posts (paginated content displayed dynamically)
      ├─ PostSkeleton (shown while loading)
      ├─ PostCard (actual posts displayed after loading)
      └─ NoPostsWidget (shown when no posts are available)

This is something I want to achieve