I have tried using the widget verticaldivider() in flutter, The code seems to work fine but i the divider is not visible on my app. where i want it to be. I want the divider to be between two images. The images are moved a little bit when i alter with the verticaldivider code but meaning it is present there but it cannot be seen why is that???
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
const SizedBox(width: 10),
GestureDetector(
onTap: () {
// Handle Google login
},
child: Image.asset(
'assets/images/google.png', // Replace with your Google icon asset path
width: 50,
height: 50,
),
),
const VerticalDivider(
color: Colors.grey,
width: 20,
thickness: 1, // Increase thickness
indent: 20,
endIndent: 0,
),
Container(
margin: const EdgeInsets.symmetric(vertical: 10),
color: Colors.grey.withOpacity(0.4),
width: 3,
),
GestureDetector(
onTap: () {
// Handle Facebook login
},
child: Image.asset(
'assets/images/facebook.png', // Replace with your Facebook icon asset path
width: 50,
height: 50,
),
),
const SizedBox(width: 10),
],
),
I even tried using a container trying to make my own divider but it was still not working. If you know what is going on here please help Thanks
I think you need to use IntrinsicHeight
. Wrap your Row
with it:
IntrinsicHeight(
child: Row(
// ...
),
),
Your current Divider
has a height of 0
and I guess you want it to match the height of the Row
. IntrinsicHeight
gives the Divider
a way to know the height of the Row
and allows it to match it.