Как сделать прокручиваемый ListView внутри одного из элементов «SliverFixedExtentList», используя «customScrollView» во флаттере?

Question

Я использую "CustomScrollView" с "SliverPersistentHeader" и "SliverFixedExtentList". Я пытаюсь не прокручивать данные в столбце (виджет "ListTest") до тех пор, пока заголовок SliverPersistentHeader не попадет в начало. Означает сказать, что если пользователь попытается прокрутить "ListTest" data, SliverPersistentHeader должен сначала придерживаться вершины, тогда данные в «listTest» станут прокручиваемыми. Я знаю, что может показаться глупым, что я использую "column" вместо "listview", я пытался использовать «Listview» на фоновом изображении (которое является частью виджета «foodContent»), но это не получилось так, как я хочу , Это так расстраивает , пожалуйста, кто-нибудь, помогите . Любая эффективная альтернатива для достижения этой цели будет оценена

Вот изображение того, что я получаю https://i.imgur.com/CEZyiLM.gif

class Home extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    final deviceSize = MediaQuery.of(context).size;
    return Material(
      type: MaterialType.transparency,
      child: Stack(
        children: <Widget>[
          Container(
            child: CustomScrollView(
              slivers: <Widget>[
                SliverPersistentHeader(
                  pinned: true,
                  floating: false,
                  delegate: SliverAppBarDelegateClass(
                    maxExtent: deviceSize.height * 0.37,
                    minExtent: deviceSize.height * 0.15,
                  ),
                ),
                SliverFixedExtentList(

                  itemExtent: deviceSize.height * 0.850,
                  delegate: SliverChildListDelegate(
                    [
                      FoodContent(), 
                    ],
                  ),
                ),
              ],
            ),
          ),

          // NavBar(),
        ],
      ),
    );
  }
}

class FoodContent extends StatefulWidget {
  @override
  _FoodContentState createState() => _FoodContentState();
}

class _FoodContentState extends State<FoodContent> {
  @override
  Widget build(BuildContext context) {

    return Stack(
      children: <Widget>[
        FoodContentBg(), // THIS IS THE CURVED SHAPE BACKGROUND THAT I WANT TO STICK AND COLUMN DATA 
                         // START TOO SCROLL AS USER SCROLL SliverPersistentHeader TO THE TOP

        listTest(),      // THIS LIST SHOULD NOT BE SCROLL ABLE UNTILL SliverPersistentHeader  TITLE GET 
                         // TO TOP 
        SearchBar(),
      ],
    );
  }
}

// **This "LISTTEST" contains "Column" containing example data**

class listTest extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.only(top: 100, bottom: 80),
      child: Center(
        child: SingleChildScrollView(
          child: Column(
            children: <Widget>[
              Container(
                padding: EdgeInsets.all(15),
                color: Colors.red,
                width: MediaQuery.of(context).size.width / 2,
                child: Text("data1",
                    style: TextStyle(fontSize: 60, color: Colors.white)),
              ),
              Container(
                color: Colors.green,
                padding: EdgeInsets.all(15),
                width: MediaQuery.of(context).size.width / 2,
                child: Text("data2",
                    style: TextStyle(fontSize: 60, color: Colors.white)),
              ),
              Container(
                padding: EdgeInsets.all(15),
                color: Colors.brown,
                width: MediaQuery.of(context).size.width / 2,
                child: Text("data3",
                    style: TextStyle(fontSize: 60, color: Colors.white)),
              ),
              Container(
                padding: EdgeInsets.all(15),
                color: Colors.blue,
                width: MediaQuery.of(context).size.width / 2,
                child: Text("data4",
                    style: TextStyle(fontSize: 60, color: Colors.white)),
              ),
              Container(
                padding: EdgeInsets.all(15),
                color: Colors.purple,
                width: MediaQuery.of(context).size.width / 2,
                child: Text("data5",
                    style: TextStyle(fontSize: 60, color: Colors.white)),
              ),
              Container(
                padding: EdgeInsets.all(15),
                color: Colors.purple,
                width: MediaQuery.of(context).size.width / 2,
                child: Text("data5",
                    style: TextStyle(fontSize: 60, color: Colors.white)),
              ),
              Container(
                padding: EdgeInsets.all(15),
                color: Colors.purple,
                width: MediaQuery.of(context).size.width / 2,
                child: Text("data5",
                    style: TextStyle(fontSize: 60, color: Colors.white)),
              ),
              Container(
                padding: EdgeInsets.all(15),
                color: Colors.purple,
                width: MediaQuery.of(context).size.width / 2,
                child: Text("data5",
                    style: TextStyle(fontSize: 60, color: Colors.white)),
              ),
              Container(
                padding: EdgeInsets.all(15),
                color: Colors.purple,
                width: MediaQuery.of(context).size.width / 2,
                child: Text("data5",
                    style: TextStyle(fontSize: 60, color: Colors.white)),
              ),
              Container(
                padding: EdgeInsets.all(15),
                color: Colors.purple,
                width: MediaQuery.of(context).size.width / 2,
                child: Text("data5",
                    style: TextStyle(fontSize: 60, color: Colors.white)),
              ),
            ],
          ),
        ),
      ),    
    );
  }
}

***This delegate might not be needed to extract solution but I paste it here anyways,*** 


class SliverAppBarDelegateClass extends SliverPersistentHeaderDelegate {
  SliverAppBarDelegateClass({

    this.maxExtent,
    this.minExtent,
  });

  final double maxExtent; 
  final double minExtent;

  @override
  Widget build(
    BuildContext context,
    double shrinkOffset,
    bool overlapsContent,
  ) {
    final deviceSize = MediaQuery.of(context).size;

    final double visibleMainHeight = max(maxExtent - shrinkOffset, minExtent);
    final double animationVal = scrollAnimationValue(shrinkOffset);

    return Container(
      height: visibleMainHeight,
      width: deviceSize.width,
      child: Stack(
        fit: StackFit.expand,
        children: <Widget>[
// ------------------------------------------------------   C U S T O M I R I Z I N G    A P P B A R    A N I M A T I O N 
          Container(
            color: Colors.black.withOpacity(0.5),
          ),
          Opacity(
            opacity: animationVal,
            child: HomeCoverBg(),
          ),
          Positioned(
            bottom: deviceSize.height *
                0.003, 
            child: SizedBox(
              width: deviceSize.width,
              child: Row(

                children: <Widget>[
                  Expanded(
                    flex: (animationVal * 20)
                        .toInt(), // Decrease the size on the left of titles (Row animation)
                    child: Container(),
                  ),
                  Titles(),
                  Expanded(
                    flex: 120,
                    child: Container(),
                  )
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }


  double scrollAnimationValue(double shrinkOffset) {
return 1.0 -
        max(0.0, shrinkOffset) /
            maxExtent; //// simple formula: fade out or scroll text as soon as shrinkOffset > 0
  }

  @override
  bool shouldRebuild(SliverPersistentHeaderDelegate oldDelegate) {
    return true;
  }
}