Flutter AbsorbPointer vs IgnorePointer difference

The difference is when we have two widgets overlapping each other, that can both receive clicks.

Consider a red and blue square, both clickable, where the blue square is smaller and on the top of the red square:

Stack(
  alignment: Alignment.center,
  children: [
     Container(color: Colors.red),
     Container(width: 42, height: 42, color: Colors.blue),
  ],
)

By default, without IgnorePointer/AbsorbPointer, tapping the blue square will send a click event on blue and red gets nothing.

In that situation, wrapping blue square into an AbsorbPointer means that when tapping the blue square, neither the blue square nor the red one gets the click event.

If we instead used an IgnorePointer, the red square would receive click events when tapping the blue square.