Flutter: CarouselSlider/ExpandablePageView scrollable items with width larger than then phone screen width?

Question

I want to use a widget like Carousel Slider or Expandable Page View (or any PageView builder working implementation) that has items/pages with width larger than the screen width. I want to be able to scroll left and right freely and switch page only when I reach the end of the item/page (left/right so previous/next). Also I want them to be vertically scrollable too.

The problem doesn't seem so much the vertical scroll but the horizontal one, since I tried and whenever I create an item with width > than the screen size, all the other pages disappear and I can only scroll inside that one.

You should add the code snippet as a part of the question instead of an answer. I'm not the downvoter btw :) — Ahmad F, Jun 12 '23 at 22:15

Rahul Kushwaha · Answer 1 · 2023-06-14T05:14:12.503

This code may help to resolve the issues.

 SingleChildScrollView(
  scrollDirection: Axis.vertical,
  child: Column(
    children: [
      SizedBox(
        height: 300,
        child:  CarouselSlider.builder(
          scrollDirection: Axis.vertical,
          itemCount: 6,
          itemBuilder: (context, index, realIndex) {
            return SingleChildScrollView(
              scrollDirection: Axis.horizontal,
              child: Container(
                color:
                index % 2 == 0 ? Colors.red : Colors.blue,
                width: MediaQuery.of(context).size.width + 400,
                child: Text(
                  index.toString(),
                ),
              ),
            );
          },
          options: CarouselOptions(viewportFraction: 1.0),
        ),
      )
     
      ...
      AnotherWidget(),    
    ],
    
  ),
)

1: carousel slider does not have scrollDirection modifier 2: by removing it I get "Incorrect use of ParentData Widget" — GianlucaA, Jun 13 '23 at 16:19

Flutter: CarouselSlider/ExpandablePageView scrollable items with width larger than then phone screen width?

1 Answers1