We all know the ListView Widget is one of the important Flutter widget that can be used any Flutter app project. The Flutter introduce the ListView Widget with a purpose to reduce the overload on different layouts performing the similar tasks in application.
. In this article, we will go through how to display two ListViews on One Screen in a flutter?

How to Display two ListViews on a One Screen In a Flutter?

The following code snippet shows two listview vertical directions on a single page, both ListView Data are from APIs.

return Scaffold(
        appBar: AppBar(
          title: const Text("Two List View One Screen"),
        ),
        body: Row(
          children: [
            Flexible(
              child: Container(
                color: Colors.blueGrey,
                child: ListView.builder(
                  itemCount: 30,
                  itemBuilder: (_, i) => ListTile(title: Text("List1: $i")),
                ),
              ),
            ),
            Flexible(
              child: Container(
                color: Colors.lightGreen,
                child: ListView.builder(
                  itemCount: 30,
                  itemBuilder: (_, i) => ListTile(title: Text("List2: $i")),
                ),
              ),
            ),
          ],
        ));

The following code snippet shows two listview horizontal directions on a single page:

return Scaffold(
        appBar: AppBar(
          title: const Text("Two List View One Screen"),
        ),
        body: Column(
          children: [
            Flexible(
              child: Container(
                color: Colors.blueGrey,
                child: ListView.builder(
                  itemCount: 30,
                  itemBuilder: (_, i) => ListTile(title: Text("List1: $i")),
                ),
              ),
            ),
            Flexible(
              child: Container(
                color: Colors.lightGreen,
                child: ListView.builder(
                  itemCount: 30,
                  itemBuilder: (_, i) => ListTile(title: Text("List2: $i")),
                ),
              ),
            ),
          ],
        ));

Output

Conclusion:

Thanks for Reading !!!

Kindly drop your suggestion/feedback to serve you much better.

One of the leading Flutter development company Flutter Agency is our portal Platform dedicated to Flutter Technology and Flutter Developers. The portal is full of cool resources from Flutter like Flutter Widget Guide, Flutter Projects, Code libs and etc.