[BUG] StickyContainerWidget gets duplicated when using dynamic items

[omi-ramdelatina]

Hello @crasowas, really loving your work 🥂
But I am facing some issues since my widget requires dynamic items.
Would really appreciate your help. Thanks!

Steps to reproduce

• Scroll halfway through the button
• Click button until another header appears

Expected results

• Previous header should not be visible

Actual results

• Bugged ui

Code sample

import 'dart:math';

import 'package:easy_sticky_header/easy_sticky_header.dart';
import 'package:flutter/material.dart';

class TestWidget extends StatefulWidget {
  const TestWidget({Key? key}) : super(key: key);
  static const String routeName = "/test";

  @override
  State<TestWidget> createState() => _TestWidgetState();
}

class _TestWidgetState extends State<TestWidget> {
  late final StickyHeaderController _controller;
  late final ScrollController _scrollController;
  int _items = 20;

  @override
  void initState() {
    super.initState();
    _controller = StickyHeaderController();
    _scrollController = ScrollController();
  }

  @override
  void dispose() {
    _controller.dispose();
    _scrollController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBar(
        shadowColor: Colors.transparent,
        backgroundColor: Colors.black,
        foregroundColor: Colors.white,
      ),
      body: Column(
        children: <Widget>[
          Expanded(
            child: StickyHeader(
              controller: _controller,
              child: SingleChildScrollView(
                controller: _scrollController,
                child: Column(
                  children: [
                    Container(
                      width: double.infinity,
                      height: 80,
                      color: Colors.white,
                      padding: const EdgeInsets.only(left: 16),
                      alignment: Alignment.centerLeft,
                      child: const Text(
                        'Item 1',
                        style: TextStyle(
                          color: Colors.black,
                          fontSize: 16,
                        ),
                      ),
                    ),
                    StickyContainerWidget(
                      index: 1,
                      performancePriority: false,
                      child: Container(
                        color: Color.fromRGBO(
                          Random().nextInt(256),
                          Random().nextInt(256),
                          Random().nextInt(256),
                          1,
                        ),
                        padding: const EdgeInsets.only(left: 16.0),
                        alignment: Alignment.centerLeft,
                        width: double.infinity,
                        height: 100,
                        child: const Text(
                          'Header',
                          style: TextStyle(
                            color: Colors.white,
                            fontSize: 16,
                          ),
                        ),
                      ),
                    ),
                    ElevatedButton(
                      style: ElevatedButton.styleFrom(
                        minimumSize: const Size(60, 60),
                      ),
                      onPressed: () {
                        setState(() {
                          _items = Random().nextInt(_items);
                        });
                      },
                      child: const Text('Randomize Items Count'),
                    ),
                    for (var i = 2; i <= _items; i++) ...[
                      Container(
                        width: double.infinity,
                        height: 80,
                        color: Colors.white,
                        padding: const EdgeInsets.only(left: 16),
                        alignment: Alignment.centerLeft,
                        child: Text(
                          'Item $i',
                          style: const TextStyle(
                            color: Colors.black,
                            fontSize: 16,
                          ),
                        ),
                      ),
                    ],
                  ],
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}

Screenshot/Video

Screen.Recording.2024-09-27.at.1.51.01.AM.mov