How to close Slidable on scroll of a parent Scrollable?

[calebcng]

Hi, I am trying to create a screen that is fully scrollable, containing some header elements, followed by a generated list of Slidable objects. My current implementation (full code below) has a parent ListView, with a inner ListView.separated that is not scrollable.

Under this implementation, the logic to automatically close the slidable on scroll doesn't work, even though the first primary Scrollable (the ListView.separated) is never scrollable.

Any pointers as to how I can either:

• Get the slidable to close when the parent ListView is scrolled, or
• Refactor the widget tree to still achieve the same effect of having the header widgets scrollable with the generated widgets?

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

class _TestScreenState extends State<TestScreen> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: SizedBox(
        width: double.infinity,
        child: **ListView**(
           // Manually created header widgets
          children: [
            const Padding(
              padding: EdgeInsets.symmetric(vertical: 20),
              child: Text(
                'Title text',
                style: TextStyle(color: Colors.black),
              ),
            ),
           // Generated list of widgets
            **ListView.separated**(
              physics: const NeverScrollableScrollPhysics(),
              shrinkWrap: true,
              itemCount: 30,
              itemBuilder: (context, index) {
                return Slidable(
                  closeOnScroll: true,
                  endActionPane: ActionPane(
                    motion: const DrawerMotion(),
                    children: [
                      SlidableAction(
                        icon: Icons.edit,
                        backgroundColor: Colors.green.shade400,
                        foregroundColor: Colors.white,
                        onPressed: (context) {},
                      ),
                    ],
                  ),
                  child: Container(
                    width: double.infinity,
                    color: Colors.blue,
                    padding: const EdgeInsets.symmetric(
                      horizontal: 10,
                      vertical: 20,
                    ),
                    child: Text(
                      'Index: $index',
                      style: const TextStyle(color: Colors.white),
                    ),
                  ),
                );
              },
              separatorBuilder: (context, index) => const SizedBox(height: 10),
            ),
          ],
        ),
      ),
    );
  }
}

[doanhovy188]

In my case, I change the "ListView.separated" to "Column", it's "children" look like:
children: items.map((item) => Padding(padding: EdgeInsets.only(top: separatorHeight), MySlidable(item))).toList()