What's the big green right arrow (-->) mean in DevTools with Flutter?

Question

What's the big green right arrow (-->) mean in DevTools with Flutter?

I guess it's related to the interactable area, but I'm not sure.

The code is the same as in Flutter, Page two can't click when it's on Page 1. Here is the simplified code:

PageController _controller = PageController(initialPage: 0, viewportFraction: 0.5);

@override
  Widget build(BuildContext context) {
    return Container(
      color: Colors.yellow,
      child: PageView(
        controller: _controller,
        children: <Widget>[
          Center(
            child: FlatButton(
              onPressed: () {},
              color: Colors.red,
              child: Text('First Tab'),
            ),
          ),
          Center(
            child: FlatButton(
              onPressed: () {},
              color: Colors.blue,
              child: Text('Second Tab'),
            ),
          ),
          Center(
            child: FlatButton(
              onPressed: () {},
              color: Colors.green,
              child: Text('Third Tab'),
            ),
          ),
        ],
      ),
    );
}

Answer 1

These green arrows in the so-called "Debug Paint" indicate scroll views.

The direction of the arrows shows which way the scroll view extends, i.e. the arrows will either point to the right or down.
This will appear for e.g. ListView, SingleChildScrollView etc.

Learn more about visual debugging in Flutter.