[Flutter]ListView.builderを横スクロール(horizontal)にするには？

どうも、ちょげ(@chogetarou)です。

ListView.builderを横スクロールにする方法を紹介します。

方法

ListView.builderを横スクロールにするには、引数「scrollDirection」に「Axis.horizontal」を指定します。

ListView.builder(
  scrollDirection: Axis.horizontal,
  itemCount: /*count*/,
  itemBuilder: (context, index) {
    return /*Item*/;
  },
),

以下は、使用例です。

ListView.builder(
  scrollDirection: Axis.horizontal,
  itemCount: 20,
  itemBuilder: (context, index) {
    return Padding(
      padding: const EdgeInsets.all(8.0),
      child: Container(
        width: 100,
        color: Colors.blue,
        child: Text('$index'),
      ),
    );
  },
),