Flutter/UI/ListTile
提供: 初心者エンジニアの簡易メモ
ListTileとは
ListViewの1行を表す。
サンプル
ListTile(
title: Text("リスト1",
style: TextStyle(
locale: Locale("ja", "JP"),
)
),
trailing: Icon(Icons.keyboard_arrow_right),
onTap: () {
// tap時の挙動
},
);
上下にボーダーのあるListTail
Container(
padding: const EdgeInsets.all(0.0),
decoration: BoxDecoration(
border: Border(
top: BorderSide(
color: Colors.black45,
width: 1.0,
),
bottom: BorderSide(
color: Colors.black45,
width: 1.0,
),
),
),
child: ListTile(
title: Text("リスト1",
style: TextStyle(
locale: Locale("ja", "JP"),
)
),
trailing: Icon(Icons.keyboard_arrow_right),
onTap: () {
_navigatorResetPage();
}, //
),
),
小技
heightで高さ幅を小さくできる。
new Container(
height: 56.0,
color: Colors.white,
child: Row(
children: <Widget>[
Expanded(
child: new ListTile(
leading: new CircleAvatar(
backgroundColor: StaticFunction.toColorByStr(
listdatas[index].color),
child: new Text(listdatas[index].thumbtitle,),
foregroundColor: Colors.white,
),
title: new Text(listdatas[index].title,
style: TextStyle(
locale: Locale("ja", "JP")
),
),
subtitle: new Text(
listdatas[index].subtitle,
style: TextStyle(
locale: Locale("ja", "JP"),
fontSize: 10,
),
),
),
),
],
),
),
