Como criar ListView horizontal em Flutter

Um ListView horizontal é um componente de UI que exibe uma coleção de itens em uma organização horizontal e rolável. É como uma lista vertical, mas em vez de rolar para cima e para baixo, você rola para a esquerda e para a direita. Este layout é ideal para apresentar itens que se beneficiam de comparação visual ou onde é preferida uma visão mais ampla.

Neste tutorial, aprenderemos como criar uma visualização de rolagem horizontal ou visualização de lista no aplicativo Flutter. Definiremos a direção de rolagem como Horizontal nos widgets ListView ou SingleChildScrollView() para criar uma visualização de rolagem horizontal.

Como alterar a direção de rolagem do ListView

ListView(
  scrollDirection: Axis.horizontal,
  children:[]
)

Por padrão, a direção de rolagem do ListView é vertical, você pode usar a propriedade scrollDirection para alterar a direção de rolagem para Horizontal. Você deve passar o valor do eixo nesta propriedade. 

Agora, usaremos esta propriedade para fazer o ListView Horizontal:

Como adicionar ListView com rolagem horizontal

List<String> countries = ["Iphone", "Samsung", "OPPO", "Xiaomi", "Vivo", "Realme"];

ListView(
  scrollDirection: Axis.horizontal,
  children: countries.map((country){
        return Container(
           color: Colors.orangeAccent,
           height: 100, width:150,
           alignment: Alignment.center
           child: Text(country)
        );
  }).toList(),
)

Aqui, criamos uma lista de marcas de telefones no ListView e definimos a direção de rolagem como Horizontal. Podemos conseguir esse recurso usando widgets SingleChildScrollView() e Row() também. 

List<String> countries = ["Iphone", "Samsung", "OPPO", "Xiaomi", "Vivo", "Realme"];

SingleChildScrollView(
    scrollDirection: Axis.horizontal,
    child:Row(
    children: countries.map((country){
        return Container(
           color: Colors.orangeAccent,
           height: 100, width:150,
           alignment: Alignment.center
           child: Text(country)
        );
    }).toList(),
  )
)

Aqui, envolvemos Row() infinita com SingleChildScrollView() para adicionar rolagem na largura da linha transbordada. E mudamos a direção de rolagem para Horizontal.

Desta forma, você pode fazer a visualização de rolagem horizontal usando os widgets ListView() e SingleChildScrollView() no Flutter.