How to control widget after listview in stack-CodePudding

I build a flutter app with ads as a carousel slider as a bottom layer of the stack widget, and I have I list view in the top layer of the stack widget and when the list is scrolled vertically it overlays the ads on the screen.

now I have a problem with the carousel slider, I can't scroll it manually and I can't click any

how to solve it?

demo code:

Scaffold(
    appBar: AppBar(
      title: Text(widget.title),
    ),
    body: Stack(
      children: [
        CarouselSlider(
          options: CarouselOptions(
            autoPlay: true,
          ),
          items: imgList
              .map((item) => Center(
                      child: Image.network(
                    item,
                    fit: BoxFit.cover,
                  )))
              .toList(),
        ),
        ListView.builder(
            shrinkWrap: true,
            padding: const EdgeInsets.only(top: 210),
            itemBuilder: (context, index) => Container(
                  color: Colors.white,
                  child: Text(
                    'ITEM $index',
                    textAlign: TextAlign.center,
                  ),
                ))
      ],
    ));

CodePudding user response：

It depends on how you want to lay your widgets out. If you want to keep the ads persistent (not to scroll away with list) then keep the layout like :

Scaffold(
  body: Column(
    children: [
      CarouselSlider(),
      Expanded(
        child: ListView.builder(),
      ),
    ],
  ),
)

CodePudding user response：

Using positioned widget inside stack you can easily position the widgets. Maybe this will help you.

Stack(
          children: [
            Positioned(
              top: 0,
              bottom: 250,
              left: 0,
              right: 0,
              child: ListView.builder(
                  shrinkWrap: true,
                  itemBuilder: (context, index) => Container(
                        color: Colors.white,
                        child: Text(
                          'ITEM $index',
                          textAlign: TextAlign.center,
                        ),
                      )),
            ),
            Positioned(
              bottom: 8,
              right: 0,
              left: 0,
              child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: CarouselSlider(
                  options: CarouselOptions(
                    autoPlay: true,
                  ),
                  items: imgList
                      .map((item) => Center(
                              child: Image.network(
                            item,
                            fit: BoxFit.cover,
                          )))
                      .toList(),
                ),
              ),
            ),
          ],
        )