使用 Overlay .of 于 Flutter :指南和示例

Overlay.of 是一个静态方法 Flutter,用于检索 OverlayState 最近的祖先 Overlay 小部件。

Overlay 部件用于创建小部件堆栈,这些小部件可以显示在 Flutter 应用程序中其他小部件的顶部。 该 Overlay.of 方法允许您访问 OverlayState 与特定的 BuildContext.

以下是您如何 Overlay.of 访问的示例 OverlayState

import 'package:flutter/material.dart';  
  
void main() {  
  runApp(MyApp());  
}  
  
class MyApp extends StatelessWidget {  
  @override  
  Widget build(BuildContext context) {  
    return MaterialApp(  
      home: MyHomePage(),  
   );  
  }  
}  
  
class MyHomePage extends StatelessWidget {  
  @override  
  Widget build(BuildContext context) {  
    return Scaffold(  
      appBar: AppBar(  
        title: Text('Overlay.of Example'),  
     ),  
      body: Center(  
        child: ElevatedButton(  
          onPressed:() {  
            OverlayState overlayState = Overlay.of(context);  
            OverlayEntry overlayEntry = OverlayEntry(  
              builder:(BuildContext context) {  
                return Positioned(  
                  top: 100,  
                  left: 50,  
                  child: Container(  
                    width: 100,  
                    height: 100,  
                    color: Colors.blue,  
                 ),  
               );  
              },  
           );  
            overlayState.insert(overlayEntry);  
          },  
          child: Text('Show Overlay'),  
       ),  
     ),  
   );  
  }  
}  

在此示例中,当按下按钮时,该 Overlay.of 方法用于检索 OverlayState 与当前 BuildContext. 然后使用 的方法 创建 OverlayEntry 并添加到 。 这会在其他小部件顶部的特定位置显示一个蓝色容器。 overlay insert OverlayState

请注意,使用 overlay 需要仔细管理,通常应该在 overlay 不再需要条目时将其删除,以避免内存泄漏。

Overlay.of 如果上次更新后 有任何更新或更改,我建议检查 Flutter 文档以获取最新信息。