Karel Debedts
Karel Debedts

Reputation: 5768

Flutter : make two listviews scrollable as one

I'm trying to make a screen that's scrollable (like the whole screen scrollable).

This is what I got know:

Column(
          children: <Widget>[

                 Expanded(
                    child: ListView(
                        scrollDirection: Axis.horizontal, children: posts2b)),

            Expanded(child: ListView(children: posts2a)),
          ],
        );

It all works, but I want those listviews scrollable as one. So if you scroll down, the horizontal listview 'disappears'.

Is that possible?

Thank you!

Upvotes: 7

Views: 11212

Answers (3)

dongwoo
dongwoo

Reputation: 49

Use SizedBox() and give the option, shrinkWrap: true.

SizedBox(
              child: ListView(
                physics: NeverScrollableScrollPhysics(),
                shrinkWrap: true,
...
),
SizedBox(
              child: ListView(
                physics: NeverScrollableScrollPhysics(),
                shrinkWrap: true,
...
),

Upvotes: 4

Gk Mohammad Emon
Gk Mohammad Emon

Reputation: 6938

I fixed this problem by this approach -

SingleChildScrollView(
                      child: Column(
                        children: [
                        ListView(
                          physics: const NeverScrollableScrollPhysics(),
                          shrinkWrap: true,
                          .
                          .
                          .
                        ),
                          ListView(
                          physics: const NeverScrollableScrollPhysics(),
                          shrinkWrap: true,
                          .
                          .
                          .
                          .
                        ),
                      ]),
                    );

Upvotes: 2

janstol
janstol

Reputation: 3157

Something like this?

SingleChildScrollView(
  child: Column(
    mainAxisSize: MainAxisSize.min,
    children: <Widget>[
      SizedBox(
        height: 200,
        child: ListView(
          scrollDirection: Axis.horizontal,
          children: posts2b,
        ),
      ),
      Flexible(
        child: ListView(
          physics: NeverScrollableScrollPhysics(),
          shrinkWrap: true,
          children: posts2a,
        ),
      ),
    ],
  ),
)

Wrap Column with SingleChildScrollView, set height for horizontal list and disable scrolling for vertical list by adding physics: NeverScrollableScrollPhysics() ...

Upvotes: 14

Related Questions