How to make padding of container tap-able?

Question

I want to be able to click the padding around the GestureDetector widget and trigger onTap method of it. I dont want to change the size of the Icon itself. Here is the code so far.

class InfoButton extends StatelessWidget {
  final String text;
  final double padding;
  static const double defaultPadding = 5;

  const InfoButton({Key key, @required this.text, this.padding = defaultPadding}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.all(padding),
      decoration: BoxDecoration(border: Border.all()),
      child: GestureDetector(
        child: Icon(
          Icons.info_outline,
          color: Colors.blue,
          size: 20,
        ),
        onTap: () {
          print('clicked');
        },
      ),
    );
  }
}

How to I achieve this in flutter?

Answer 1

Just include Container as the child of GestureDetector instead of the Icon and set behavior property of GestureDetector to HitTestBehavior.opaque like this

   Widget build(BuildContext context) {
       return GestureDetector(
             behavior: HitTestBehavior.opaque,
                  onTap: () {
                    print('clicked');
                  },
              child : Container(
                padding: EdgeInsets.all(padding),
                decoration: BoxDecoration(border: Border.all()),
                  child: Icon(
                    Icons.info_outline,
                    color: Colors.blue,
                    size: 20,
                  )
                ),
              );
            }