ElevatedButton padding on all sides won't modify

Question

I have a ElevatedButton with the following attributes: I attached a photo here: https://i.sstatic.net/oH3pO.png

ElevatedButton(
               clipBehavior: Clip.none,
               style: ElevatedButton.styleFrom(
               padding: EdgeInsets.zero,
               minimumSize: Size(0, 0),
               elevation: 0,
               ),

I modified the padding around and it still has a minimum padding (_InputPadding) of 48px by 48px. How can I solve this?

Answer 1

These paddings are because of tapTargetSize property. To remove them add tapTargetSize: MaterialTapTargetSize.shrinkWrap, to the button style.

For example:

ElevatedButton(
  style: ElevatedButton.styleFrom(
    fixedSize: size,
    padding: const EdgeInsets.zero,
    tapTargetSize: MaterialTapTargetSize.shrinkWrap,
  ),

Additional info from the source code.

  /// MaterialTapTargetSize
  ///
  /// Expands the minimum tap target size to 48px by 48px.
  ///
  /// This is the default value of [ThemeData.materialTapTargetSize] and the
  /// recommended size to conform to Android accessibility scanner
  /// recommendations.
  padded,

  /// Shrinks the tap target size to the minimum provided by the Material
  /// specification.
  shrinkWrap,

Answer 2

This is how you can set 45 padding for your elevated button.

ElevatedButton(
      onPressed: () {},
      child: Text('hi'),
      style: ButtonStyle(
        padding: MaterialStateProperty.resolveWith<EdgeInsetsGeometry>(
          (Set<MaterialState> states) {
            return EdgeInsets.all(45);
          },
        ),
      ),
    );