Agile UI
latest
  • Overview of Agile UI
  • Quickstart
  • Core Concepts
  • File structure example & first app
  • Components
    • Core Components
    • Simple components
    • Interactive components
      • Console
      • ProgressBar
      • Popup
      • Wizard
      • Right Panel
      • Data Action Executor
    • Composite components
  • JavaScript Mapping
  • Advanced Topics
Agile UI
  • Docs »
  • Components »
  • Popup
  • Edit on GitHub

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

Next Previous

© Copyright 2016-2019, Agile Toolkit Revision c6b9ed73.

Built with Sphinx using a theme provided by Read the Docs.
Read the Docs v: latest
Versions
latest
stable
feature-upload-field
feature-upload-field_a
doc-spellcheck
Downloads
pdf
html
epub
On Read the Docs
Project Home
Builds

Free document hosting provided by Read the Docs.