title: How to make a horizontal ListView with two row in Flutter?
body: <p>i am trying to show the catalog list in two row within horizontal GridView  or ListView<br />
  instead of  single row  the list data comes from server
  The horizontal ListView  working fine with one row
  How can I achieve this as the GIF bellow ?</p>
  <p>bellow image  what  i have</p>
  <p>bellow  gif   what i need</p>
  <p><a href="https://i.stack.imgur.com/8gGJo.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/8gGJo.jpg" alt="enter image description here" /></a>
  [<img src="https://i.stack.imgur.com/Bat8k.gif" alt="the ListView as needed1" /></p>
  <p>below full code The horizontal ListView  which is working fine with one row and i need to convert it to GridView so it can show two row and horizontal  scrollable</p>
  <pre><code>_catList() {
  return Container(
    height: 150,
    child: ListView.builder(
      itemCount: catList.length &lt; 10 ? catList.length : 10,
      scrollDirection: Axis.horizontal,
      shrinkWrap: true,
      physics: AlwaysScrollableScrollPhysics(),
      itemBuilder: (context, index) {
        return Padding(
          padding: const EdgeInsetsDirectional.only(end: 10),
          child: GestureDetector(
            onTap: () async {
              if (catList[index].subList == null ||
                  catList[index].subList.length == 0) {
                await Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) =&gt; ProductList(
                          name: catList[index].name,
                          id: catList[index].id,
                          tag: false,
                          updateHome: widget.updateHome),
                    ));
                if (mounted) setState(() {});
              } else {
                await Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) =&gt; SubCat(
                          title: catList[index].name,
                          subList: catList[index].subList,
                          updateHome: widget.updateHome),
                    ));
                if (mounted) setState(() {});
              }
            },
            child: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              mainAxisSize: MainAxisSize.min,
              children: &lt;Widget&gt;[
                Padding(
                  padding: const EdgeInsetsDirectional.only(bottom: 5.0),
                  child: new ClipRRect(
                    borderRadius: BorderRadius.circular(25.0),
                    child: new FadeInImage(
                      fadeInDuration: Duration(milliseconds: 50),
                      image: NetworkImage(
                        catList[index].image,
                      ),
                      height: 100.0,
                      width: 100.0,
                      fit: BoxFit.cover,
                      imageErrorBuilder: (context, error, stackTrace) =&gt;
                          erroWidget(100),
  
                      //  errorWidget: (context, url, e) =&gt; placeHolder(50),
                      placeholder: placeHolder(100),
                    ),
                  ),
                ),
                Container(
                  child: Text(
                    catList[index].name,
                    style: Theme.of(context).textTheme.caption.copyWith(
                        color: colors.fontColor,
                        fontWeight: FontWeight.w600,
                        fontSize: 15),
                    overflow: TextOverflow.ellipsis,
                    textAlign: TextAlign.center,
                  ),
                  width: 100,
                ),
              ],
            ),
          ),
        );
      },
    ),
  );
  </code></pre>
  <p>}</p>