Popup¶
-
class
Atk4\Ui\
Popup
¶
Implements a popup:
$button = Button::addTo($app, ['Click me']);
HelloWorld::addTo(Popup::addTo($app, [$button]));
-
Atk4\Ui\Popup::
set
($callback)¶
Popup can also operate with dynamic content:
$button = Button::addTo($app, ['Click me']);
Popup::addTo($app, [$button])
->set('hello world with rand=' . rand(1, 100));
Pop-up should be added into a viewport which will define boundaries of a pop-up, but it will be positioned relative to the $button. Popup remains invisible until it’s triggered by event of $button.
If second argument in the Seed is of class Button
, Menu
,
MenuItem
or Dropdown
(note - NOT FormControl!), pop-up will also bind itself
to that element. The above example will automatically bind “click” event of a button to open a pop-up.
When added into a menu, pop-up will appear on hover:
$menu = Menu::addTo($app);
$item = $menu->addItem('HoverMe')
Text::addTo(Popup::addTo($app, [$item]))->set('Appears when you hover a menu item');
Like many other Views of ATK, popup is an interractive element. It can load it’s contents when opened:
$menu = Menu::addTo($app);
$item = $menu->addItem('HoverMe');
Popup::addTo($app, [$item])->set(function (View $p) {
Text::addTo($p)->set('Appears when you hover a menu item');
Label::addTo($p, ['Random value', 'detail' => rand(1, 100)]);
});
Demo: https://ui.agiletoolkit.org/demos/popup.php
Fomantic-UI: https://fomantic-ui.com/modules/popup.html