How can I modify the size of my TextButton so that it is equal to it's child Text widget's-CodePudding

I am creating an App Login page using Flutter framework and I want the the TextButton as well as the "Forgot password?" text to be horizontally aligned in the screen, but the following code displays the button below the "Forgot Password?" text. I tried modifying the button's height and width parameters as well as modifying the spacing in the Wrap widget but I still didn't get the expected outcome. Wrapping the TextButton with SizedBox widget too didn't worked as it hid the button from the screen. Is there any other way to get the desired outcome?

CodePudding user response：

There is another approach to overcome this with RichText, TextSpan and TapGestureRecognizer.

To use TapGestureRecognizer, you will have to import 'package:flutter/gestures.dart'

RichText(
  text: TextSpan(
    text: "Forgot password? ",
    style: GoogleFonts.poppins(
      color: Colors.white,
      fontSize: 16.0,
    ),
    children: [
      TextSpan(
        text: "Click here",
        style: GoogleFonts.poppins(
          color: Colors.white,
          fontSize: 16.0,
          decoration: TextDecoration.underline,
        ),
        recognizer: TapGestureRecognizer()
          ..onTap = () => {},
      ),
    ],
  ),
)

You can use this instead of using a TextButton.

Result is as below.