OverlayPortal Widegt and Attributes
"Hello World, I'm Vinit Mepani, a coding virtuoso driven by passion, fueled by curiosity, and always poised to conquer challenges. Picture me as a digital explorer, navigating through the vast realms of code, forever in pursuit of innovation.
In the enchanting kingdom of algorithms and syntax, I wield my keyboard as a magical wand, casting spells of logic and crafting solutions to digital enigmas. With each line of code, I embark on an odyssey of learning, embracing the ever-evolving landscape of technology.
Eager to decode the secrets of the programming universe, I see challenges not as obstacles but as thrilling quests, opportunities to push boundaries and uncover new dimensions in the realm of possibilities.
In this symphony of zeros and ones, I am Vinit Mepani, a coder by passion, an adventurer in the digital wilderness, and a seeker of knowledge in the enchanting world of code. Join me on this quest, and let's create digital wonders together!"
The OverlayPortal widget is used to render its overlay child on an Overlay. It provides a convenient way to programmatically manage the visibility of the overlay. You can show or hide the overlay based on your application logic.
To use the OverlayPortal widget, you need to call its constructor:
Dart
OverlayPortal({
Key? key,
required OverlayPortalController controller,
required Widget Function(BuildContext) overlayChildBuilder,
Widget? child,
})
controller: Pass an instance of OverlayPortalController. This controller allows you to programmatically show or hide the overlay and check whether it’s currently visible.
overlayChildBuilder: Provide a function that returns a widget to be displayed as the overlay. You can customize this widget as needed.
child: Optionally, you can pass a child widget to be set as the child of the OverlayPortal’s parent.
Example Usage
Let’s create a simple example where we toggle the visibility of an overlay using a button. We’ll display the overlay with the text “This is overlay” when the button is pressed.
- First, create an instance of the controller:
Dart
final OverlayPortalController _overlayPortalController = OverlayPortalController();
- Next, create the OverlayPortal widget and pass the controller and overlay builder:
Dart
ElevatedButton(
onPressed: () {
_overlayPortalController.isShowing
? _overlayPortalController.hide()
: _overlayPortalController.show();
},
child: OverlayPortal(
controller: _overlayPortalController,
overlayChildBuilder: (BuildContext context) {
return const Text(
'This is overlay',
style: TextStyle(color: Colors.black),
);
},
child: const Text('Show/Hide Overlay'),
),
)
In this example:
We create an elevated button that toggles the overlay’s visibility.
The overlay child displays the text “This is overlay” in black.
