CODEWITHSUNDEEP
androidioslistviewdartflutter
Rahul Devanavar
Rahul Devanavar

Reputation: 4165

Add dynamic height horizontal list-view inside vertical list in Flutter

I am adding horizontal listview inside the vertical list.its not showing any content

 @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: new ListView.builder(
            itemCount: 3,
            scrollDirection: Axis.vertical,
            itemBuilder: (context, position) {
              if (position == 0) {
                return Container(
                  child: Text("First rwo"),
                );
              } else if (position == 1) {
                return Container(
                  child: Text("second  rwo"),
                );
              } else if (position == 2) {
                return Container(
                    child: ListView.builder(
                        scrollDirection: Axis.horizontal,
                        itemCount: 4,
                        shrinkWrap: true,
                        itemBuilder: (context, pos) {
                          return Text("List ");
                        }));
              }
            }));
  }

when I add the height attribute to position 2 container it works. but I want dynamic height.

SingleChildScrollView is another option but it won't be suitable for an infinite list.

Upvotes: 9

Views: 6016

Answers (1)

Jordan Davies
Jordan Davies

Reputation: 10861

Switch to a Row inside a SingleChildScrollview:

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: new ListView.builder(
        itemCount: 3,
        scrollDirection: Axis.vertical,
        itemBuilder: (context, position) {
          if (position == 0) {
            return Container(
              child: Text("First rwo"),
            );
          } else if (position == 1) {
            return Container(
              child: Text("second  rwo"),
            );
          } else if (position == 2) {
            return SingleChildScrollView(
              scrollDirection: Axis.horizontal,
              child: Row(
                children: [Text("List"), Text("List"), Text("List"), Text("List")],
              ),
            );
          }
        },
      ),
    );
  }

Upvotes: 8

Related Questions