I want to align the ListTile
vertically in the middle of the container. Horizontally, it should stay aligned to the left.
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Expanded Column Sample'),
),
body: Center(
child: Column(
children: <Widget>[
Padding(
padding: const EdgeInsets.symmetric(horizontal: 25, vertical: 15),
child: InkWell(
onTap: () {
},
child: Container(
height: 35,
width: double.infinity,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8.0),
gradient: const LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [Color(0xFFfe4a32), Color(0xFFcf1502)],),
),
child: ListTile(
title: const Text(
"Some text",
style: TextStyle(
fontSize: 15.0,
color: Color(0xFFfe4a32),
fontWeight: FontWeight.w500),
),
trailing:
const Icon(
Icons.arrow_drop_down_outlined,
color: Color(0xFFfe4a32),
size: 35,
),
)),
),
),
],
),
),
);
}
}
2
Answers
I fixed it like so:
Only remove the
height
of the container. It’ll do the work for you.But if you also want to decrease the height of the current
Container
,Put
dense:true
andcontentPadding: EdgeInsets.zero
inside theListTile
along with removing theheight
of theContainer
.Or, if you aren’t satisfied with the above outputs, you should try using
Row
andColumn
for creatingListTile
like widget.