[Flutter]横向きのListViewをColumn内で使うには？

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

横向きのListViewをColumn内で使う方法を紹介します。

方法

ListViewをColumn内で使う方法は、２つあります。

Expanded

１つは、Expandedウェジェットを使う方法です。

具体的には、横向きのListViewをExpandedのchildに指定します。

Column(
  children: [
    Expanded(
      child: ListView(
        scrollDirection: Axis.horizontal,
        children: [
          ・・・
        ],
      ),
    )
  ],
),

SizedBox

もう１つは、SizedBoxもしくはCotainerウェジェットを使う方法です。

SizedBoxもしくはCotainerのchildに、ListViewを指定します。

そして、SizedBoxもしくはCotainerのサイズを設定します。

body: Column(
  children: [
    SizedBox(
      height: /*高さ*/,
      width : /*横幅*/,
      child: ListView(
        scrollDirection: Axis.horizontal,
        children: [
          ・・・
        ],
      ),
    )
  ],
),

まとめ

横向きのListViewをColumn内で使うには、ExpandedもしくはSizedBoxを使います。