Last active
June 11, 2024 14:51
-
-
Save asartalo/c5c8bd9f0fe9ee89692efd63b6988f44 to your computer and use it in GitHub Desktop.
Sizing problem in leading icon on ListTile
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import 'package:flutter/material.dart'; | |
void main() => runApp(const ListTileApp()); | |
class ListTileApp extends StatelessWidget { | |
const ListTileApp({super.key}); | |
@override | |
Widget build(BuildContext context) { | |
return MaterialApp( | |
home: const ListTileExample(), | |
); | |
} | |
} | |
class ListTileExample extends StatelessWidget { | |
const ListTileExample({super.key}); | |
@override | |
Widget build(BuildContext context) { | |
return Scaffold( | |
appBar: AppBar(title: const Text('ListTile Sample')), | |
body: ListView( | |
children: <Widget>[ | |
ListTile( | |
leading: DCheckbox( | |
value: false, | |
), | |
title: Text('Headline'), | |
subtitle: Text('Supporting text'), | |
), | |
Divider(height: 0), | |
ListTile( | |
leading: SizedBox( | |
width: 64.0, | |
height: 64.0, | |
child: DCheckbox( | |
value: false, | |
size: 48.0, | |
), | |
), | |
title: Text('Headline'), | |
subtitle: Text( | |
'Longer supporting text to demonstrate how the text wraps and how the leading and trailing widgets are centered vertically with the text.'), | |
), | |
Divider(height: 0), | |
ListTile( | |
leading: DCheckbox( | |
value: false, | |
size: 64.0, | |
), | |
title: Text( | |
'A Very Big Headline', | |
style: TextStyle( | |
fontSize: 48.0, | |
), | |
), | |
), | |
Divider(height: 0), | |
], | |
), | |
); | |
} | |
} | |
class DCheckbox extends StatefulWidget { | |
final bool value; | |
final double size; | |
const DCheckbox({ | |
super.key, | |
required this.value, | |
this.size = 24.0, | |
}); | |
@override | |
State<DCheckbox> createState() => _DCheckboxState(); | |
} | |
class _DCheckboxState extends State<DCheckbox> { | |
bool isChecked = false; | |
@override | |
void initState() { | |
isChecked = widget.value; | |
super.initState(); | |
} | |
@override | |
Widget build(BuildContext context) { | |
// return actualCheckbox(); | |
final containerSize = 40.0 * (widget.size / 24.0); | |
return SizedBox( | |
width: containerSize, | |
height: containerSize, | |
child: actualCheckbox(), | |
); | |
} | |
Widget actualCheckbox() { | |
return IconButton( | |
onPressed: () { | |
setState(() { | |
isChecked = !isChecked; | |
}); | |
}, | |
iconSize: widget.size, | |
icon: Icon( | |
isChecked ? Icons.check_rounded : Icons.circle_outlined, | |
), | |
); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment