如何在flatter中创建信息弹出窗口?

截图:

你可以玩弄这些价值观。我只是给你一个想法,你怎么能做到这一点。

完整代码:

class HomePage extends StatelessWidget {
  final GlobalKey _key = GlobalKey();

  void _showOverlay(context) async {
    final box = _key.currentContext.findRenderObject() as RenderBox;
    final offset = box.localToGlobal(Offset.zero);
    final entry = OverlayEntry(
      builder: (_) => Positioned(
        top: offset.dy - 40,
        left: offset.dx - 120,
        child: _buildInfo(),
      ),
    );

    Overlay.of(context).insert(entry);
    await Future.delayed(Duration(seconds: 4));
    entry.remove();
  }

  Widget _buildInfo() {
    return Material(
      child: Container(
        color: Colors.red[200],
        padding: EdgeInsets.all(12),
        child: Text('This is an info button'),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text('What is this'),
            IconButton(
              key: _key,
              icon: Icon(Icons.info),
              onPressed: () => _showOverlay(context),
            ),
          ],
        ),
      ),
    );
  }
}