Button¶
-
class
phpctrl\ui\
Button
¶
Implements a clickable button:
$button = $app->add(['Button', 'Click me']);
The Button will typically inherit all same properties of a View
. The base class “View”
implements many useful methods already, such as:
$button->addClass('big red');
Alternatvie syntax if you wish to initialize object yourself:
$button = new Button('Click me');
$button->addClass('big red');
$app->add($button);
You can refer to the Semantic UI documentation for Button to find out more about available classes: http://semantic-ui.com/elements/button.html.
Demo: http://demo.phpcontrols.com/ui/button.php
Button Icon¶
-
property
phpctrl\ui\Button::$
icon
¶
Property $icon will place icon on your button and can be specified in one of the following two ways:
$button = $app->add(['Button', 'Like', 'blue', 'icon'=>'thumbs up']);
// or
$button = $app->add(['Button', 'Like', 'blue', 'icon'=>new Icon('thumbs up')]);
or if you prefer initializing objects:
$button = new Button('Like');
$button->addClass('blue');
$button->icon = new Icon('thumbs u');
$app->add($button);
-
property
phpctrl\ui\Button::$
iconRight
¶
Setting this will display icon on the right of the button:
$button = $app->add(['Button', 'Next', 'iconRight'=>'right arrow']);
Apart from being on the right, the same rules apply as Button::$icon
. Both
icons cannot be specified simultaniously.
Button Bar¶
Buttons can be aranged into a bar. You would need to create a View
component
with property ui='buttons'
and add your other buttons inside:
$bar = $app->add(['ui'=>'vertical buttons']);
$bar->add(['Button', 'Play', 'icon'=>'play']);
$bar->add(['Button', 'Pause', 'icon'=>'pause']);
$bar->add(['Button', 'Shuffle', 'icon'=>'shuffle']);
At this point using alternative syntax where you initialize objects yourself becomes a bit too complex and lengthy:
$bar = new View();
$bar->ui = 'buttons';
$bar->addClass('vertical');
$button = new Button('Play');
$button->icon = 'play';
$bar->add($button);
$button = new Button('Pause');
$button->icon = 'pause';
$bar->add($button);
$button = new Button('Shuffle');
$button->icon = 'shuffle';
$bar->add($button);
$app->add($bar);
Linking¶
-
phpctrl\ui\Button::
link
()¶
Will link button to a destination URL or page:
$button->link('http://google.com/');
// or
$button->link(['details', 'id'=>123]);
If array is used, it’s routed to App::url
For other JavaScript actions you can use JavaScript Mapping:
$button->js('click', new jsExpression('document.location.reload()'));
Complex Buttons¶
Knowledge of the Semantic UI button (http://semantic-ui.com/elements/button.html) can help you in creating more complex buttons:
$forks = new Button(['labeled'=> true]); // Button, not Buttons!
$forks->add(new Button(['Forks', 'blue']))->add(new Icon('fork'));
$forks->add(new Label(['1,048', 'basic blue left pointing']));
$layout->add($forks);