如何去除 Flutter 中 TextButton 的边距？

Question

I have a list of TextButtons and I need to remove the margin from around this buttons? The gray border around text is the background of this textButtons but I need to remove space around this buttons

TextButton(
          style: const ButtonStyle(alignment: AlignmentDirectional.centerStart),
          onPressed: () {
            AutoRouter.of(context).navigate(route);
          },
          child: Text(
            title,
            style: getCurrentStyle(),
          ));

Answer 1

Material Design have some rules and force standart clickable components to have a minimum area. So that users can click easily. For example IconButton also have a minimum render size.

Because of this limitations even if you apply a zero padding there will be some minimum width or height. You can see and inspect this effect using Dev Tools (Flutter Inspector)

What you can do is just wrapping your Text Widget with GestureDetector or InkWell.

GestureDetector(
      onTap: () {
        AutoRouter.of(context).navigate(route);
      },
      child: Text(
        title,
        style: getCurrentStyle(),
      ));