How to remove padding from TextButton and place it under widget Flutter

Issue

Need help. I want to put the text Want to get your money? and TextButton Redeem under button 611 (screenshot below) removing all padding. I have already tried many methods, but in the end it did not work out to place the widget under the button itself. Through the Flutter Inspector, you can see that there is still a distance at the top, but I don’t understand how to put it there. I will be grateful for help.

body

Padding(
        padding: const EdgeInsets.symmetric(horizontal: 24),
        child: Column(
          children: [
            const SizedBox(height: 24),
            const TotalCoinsWidget(
              coins: '611',
            ),
            const RedeemButton(
                textStyle: constants.Styles.smallBookTextStyleWhite,
                buttonStyle: constants.Styles.smallMediumTextStyleWhite),
            Padding(
              padding: EdgeInsets.only(bottom: 50),
              child: Text('Hello'),
            )
          ],
        ),
      );

textbutton

Widget build(BuildContext context) => Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Text('Want to get your money?', style: textStyle),
          TextButton(
            style: TextButton.styleFrom(
              padding: EdgeInsets.zero,
              minimumSize: Size.zero,
            ),
            onPressed: () {},
            child: Text(
              'Redeem',
              style: buttonStyle,
            ),
          ),
        ],
      );

TotalCoinsWidget

Widget build(BuildContext context) => Container(
        alignment: Alignment.center,
        width: _width,
        height: _height,
        decoration: BoxDecoration(
          color: color,
          borderRadius: BorderRadius.circular(25),
          boxShadow: [
            BoxShadow(
                color: color.withOpacity(0.5),
                blurRadius: _blurRadius,
                offset: Offset(_xOffset, _yOffset)),
          ],
        ),
        child: Text(
          coins,
          style: textStyle,
        ),
      );

Solution

you are using TextButton widget, and if you check out the property style: TextButton.styleFrom(), you will find a property called tapTargetSize, by default tapTargetSize property uses MaterialTapTargetSize.padded, and to fix your problem you must assign tapTargetSize property to MaterialTapTargetSize.shrinkWrap to shrinks the tap target size to the minimum size.

Answered By - KreatorDev