Items closer?

[dimzeta]

I'm new with this plugin, and I'm trying to display a list of images closer, where the two others are half behind the main one, like this:

It looks like the example PrefetchImageDemo almost do this effect, but the items are not really behind the main one. I also tried based on MultipleItemDemo example, but it doesn't work, because we swipe 2 items at the same time, while I would swipe one by one.

Also, when I try to use it with AspectRatio, the items are no longer side by side.

This is what I have for now:

And here is my current code:

class CardCarousel extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final List<String> items = [
      'https://images.unsplash.com/photo-1586882829491-b81178aa622e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2850&q=80',
      'https://images.unsplash.com/photo-1586871608370-4adee64d1794?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2862&q=80',
      'https://images.unsplash.com/photo-1586901533048-0e856dff2c0d?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1650&q=80',
      'https://images.unsplash.com/photo-1586902279476-3244d8d18285?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2850&q=80',
      'https://images.unsplash.com/photo-1586943101559-4cdcf86a6f87?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1556&q=80',
      'https://images.unsplash.com/photo-1586951144438-26d4e072b891?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1650&q=80',
      'https://images.unsplash.com/photo-1586953983027-d7508a64f4bb?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1650&q=80',
    ];
    return CarouselSlider.builder(
      options: CarouselOptions(
        height: 290.0,
        aspectRatio: 63.5 / 88.9,
        enlargeCenterPage: true,
        enableInfiniteScroll: false,
      ),
      itemCount: items.length,
      itemBuilder: (context, index, realIndex) {
        return Container(
          child: AspectRatio(
            aspectRatio: 63.5 / 88.9,
            child: Image.network(
              items[index],
              fit: BoxFit.cover,
              width: 1000,
            ),
          ),
        );
      },
    );
  }
}

Thank you for your help!

[yogithesymbian]

same, i am looking for it

I'm new with this plugin, and I'm trying to display a list of images closer, where the two others are half behind the main one, like this:

It looks like the example PrefetchImageDemo almost do this effect, but the items are not really behind the main one. I also tried based on MultipleItemDemo example, but it doesn't work, because we swipe 2 items at the same time, while I would swipe one by one.

Also, when I try to use it with AspectRatio, the items are no longer side by side.

This is what I have for now:

And here is my current code:

class CardCarousel extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final List<String> items = [
      'https://images.unsplash.com/photo-1586882829491-b81178aa622e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2850&q=80',
      'https://images.unsplash.com/photo-1586871608370-4adee64d1794?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2862&q=80',
      'https://images.unsplash.com/photo-1586901533048-0e856dff2c0d?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1650&q=80',
      'https://images.unsplash.com/photo-1586902279476-3244d8d18285?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2850&q=80',
      'https://images.unsplash.com/photo-1586943101559-4cdcf86a6f87?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1556&q=80',
      'https://images.unsplash.com/photo-1586951144438-26d4e072b891?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1650&q=80',
      'https://images.unsplash.com/photo-1586953983027-d7508a64f4bb?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1650&q=80',
    ];
    return CarouselSlider.builder(
      options: CarouselOptions(
        height: 290.0,
        aspectRatio: 63.5 / 88.9,
        enlargeCenterPage: true,
        enableInfiniteScroll: false,
      ),
      itemCount: items.length,
      itemBuilder: (context, index, realIndex) {
        return Container(
          child: AspectRatio(
            aspectRatio: 63.5 / 88.9,
            child: Image.network(
              items[index],
              fit: BoxFit.cover,
              width: 1000,
            ),
          ),
        );
      },
    );
  }
}

Thank you for your help!

[dimzeta]

I'm still looking for a solution...