Class yii\bootstrap4\NavBar
Inheritance | yii\bootstrap4\NavBar » yii\bootstrap4\Widget » yii\base\Widget |
---|---|
Uses Traits | yii\bootstrap4\BootstrapWidgetTrait |
Source Code | https://github.com/yiisoft/yii2-bootstrap4/blob/master/src/NavBar.php |
NavBar renders a navbar HTML component.
Any content enclosed between the begin() and end() calls of NavBar is treated as the content of the navbar. You may use widgets such as yii\bootstrap4\Nav or \yii\widgets\Menu to build up such content. For example,
use yii\bootstrap4\NavBar;
use yii\bootstrap4\Nav;
NavBar::begin(['brandLabel' => 'NavBar Test']);
echo Nav::widget([
'items' => [
['label' => 'Home', 'url' => ['/site/index']],
['label' => 'About', 'url' => ['/site/about']],
],
'options' => ['class' => 'navbar-nav'],
]);
NavBar::end();
See also https://getbootstrap.com/docs/4.5/components/navbar/.
Public Properties
Property | Type | Description | Defined By |
---|---|---|---|
$brandImage | string|boolean | Src of the brand image or false if it's not used. | yii\bootstrap4\NavBar |
$brandLabel | string|boolean | The text of the brand or false if it's not used. | yii\bootstrap4\NavBar |
$brandOptions | array | The HTML attributes of the brand link. | yii\bootstrap4\NavBar |
$brandUrl | array|string|boolean | The URL for the brand's hyperlink tag. | yii\bootstrap4\NavBar |
$clientEvents | array | The event handlers for the underlying Bootstrap JS plugin. | yii\bootstrap4\BootstrapWidgetTrait |
$clientOptions | array | The options for the underlying Bootstrap JS plugin. | yii\bootstrap4\NavBar |
$collapseOptions | array | The HTML attributes for the container tag. | yii\bootstrap4\NavBar |
$innerContainerOptions | array | The HTML attributes of the inner container. | yii\bootstrap4\NavBar |
$options | array | The HTML attributes for the widget container tag. | yii\bootstrap4\NavBar |
$renderInnerContainer | boolean | Whether the navbar content should be included in an inner div container which by default adds left and right padding. | yii\bootstrap4\NavBar |
$screenReaderToggleText | string | Text to show for screen readers for the button to toggle the navbar. | yii\bootstrap4\NavBar |
$togglerContent | string | The toggle button content. | yii\bootstrap4\NavBar |
$togglerOptions | array | The HTML attributes of the navbar toggler button. | yii\bootstrap4\NavBar |
Public Methods
Method | Description | Defined By |
---|---|---|
getView() | yii\bootstrap4\BootstrapWidgetTrait | |
init() | Initializes the widget. | yii\bootstrap4\NavBar |
run() | Renders the widget. | yii\bootstrap4\NavBar |
setContainerOptions() | Container options setter for backwards compatibility | yii\bootstrap4\NavBar |
Protected Methods
Method | Description | Defined By |
---|---|---|
registerClientEvents() | Registers JS event handlers that are listed in $clientEvents. | yii\bootstrap4\BootstrapWidgetTrait |
registerPlugin() | Registers a specific Bootstrap plugin and the related events | yii\bootstrap4\BootstrapWidgetTrait |
renderToggleButton() | Renders collapsible toggle button. | yii\bootstrap4\NavBar |
Property Details
Src of the brand image or false if it's not used. Note that this param will override $this->brandLabel
param.
See also https://getbootstrap.com/docs/4.5/components/navbar/.
The text of the brand or false if it's not used. Note that this is not HTML-encoded.
See also https://getbootstrap.com/docs/4.5/components/navbar/.
The HTML attributes of the brand link.
See also \yii\helpers\Html::renderTagAttributes() for details on how attributes are being rendered.
The URL for the brand's hyperlink tag. This parameter will be processed by \yii\helpers\Url::to()
and will be used for the "href" attribute of the brand link. Default value is false that means
\yii\web\Application::homeUrl will be used.
You may set it to null
if you want to have no link at all.
The options for the underlying Bootstrap JS plugin. Please refer to the corresponding Bootstrap plugin Web page for possible options. For example, this page shows how to use the "Modal" plugin and the supported options (e.g. "remote").
The HTML attributes for the container tag. The following special options are recognized:
- tag: string, defaults to "div", the name of the container tag.
See also \yii\helpers\Html::renderTagAttributes() for details on how attributes are being rendered.
The HTML attributes of the inner container.
See also \yii\helpers\Html::renderTagAttributes() for details on how attributes are being rendered.
The HTML attributes for the widget container tag. The following special options are recognized:
- tag: string, defaults to "nav", the name of the container tag.
See also \yii\helpers\Html::renderTagAttributes() for details on how attributes are being rendered.
Whether the navbar content should be included in an inner div container which by default adds left and right padding. Set this to false for a 100% width navbar.
Text to show for screen readers for the button to toggle the navbar.
The toggle button content. Defaults to bootstrap 4 default <span class="navbar-toggler-icon"></span>
The HTML attributes of the navbar toggler button.
See also \yii\helpers\Html::renderTagAttributes() for details on how attributes are being rendered.
Method Details
public abstract \yii\web\View getView ( ) | ||
return | \yii\web\View |
The view object that can be used to render views or view files. |
---|
abstract function getView();
Initializes the widget.
public void init ( ) |
public function init()
{
parent::init();
if (!isset($this->options['class']) || empty($this->options['class'])) {
Html::addCssClass($this->options, [
'widget' => 'navbar',
'toggle' => 'navbar-expand-lg',
'navbar-light',
'bg-light'
]);
} else {
Html::addCssClass($this->options, ['widget' => 'navbar']);
}
$navOptions = $this->options;
$navTag = ArrayHelper::remove($navOptions, 'tag', 'nav');
$brand = '';
if (!isset($this->innerContainerOptions['class'])) {
Html::addCssClass($this->innerContainerOptions, ['panel' => 'container']);
}
if (!isset($this->collapseOptions['id'])) {
$this->collapseOptions['id'] = "{$this->options['id']}-collapse";
}
if ($this->brandImage !== false) {
$this->brandLabel = Html::img($this->brandImage);
}
if ($this->brandLabel !== false) {
Html::addCssClass($this->brandOptions, ['widget' => 'navbar-brand']);
if ($this->brandUrl === null) {
$brand = Html::tag('span', $this->brandLabel, $this->brandOptions);
} else {
$brand = Html::a(
$this->brandLabel,
$this->brandUrl === false ? Yii::$app->homeUrl : $this->brandUrl,
$this->brandOptions
);
}
}
Html::addCssClass($this->collapseOptions, ['collapse' => 'collapse', 'widget' => 'navbar-collapse']);
$collapseOptions = $this->collapseOptions;
$collapseTag = ArrayHelper::remove($collapseOptions, 'tag', 'div');
echo Html::beginTag($navTag, $navOptions) . "\n";
if ($this->renderInnerContainer) {
echo Html::beginTag('div', $this->innerContainerOptions) . "\n";
}
echo $brand . "\n";
echo $this->renderToggleButton() . "\n";
echo Html::beginTag($collapseTag, $collapseOptions) . "\n";
}
Defined in: yii\bootstrap4\BootstrapWidgetTrait::registerClientEvents()
Registers JS event handlers that are listed in $clientEvents.
protected void registerClientEvents ( ) |
protected function registerClientEvents()
{
if (!empty($this->clientEvents)) {
$id = $this->options['id'];
$js = [];
foreach ($this->clientEvents as $event => $handler) {
$js[] = "jQuery('#$id').on('$event', $handler);";
}
$this->getView()->registerJs(implode("\n", $js));
}
}
Defined in: yii\bootstrap4\BootstrapWidgetTrait::registerPlugin()
Registers a specific Bootstrap plugin and the related events
protected void registerPlugin ( $name ) | ||
$name | string |
The name of the Bootstrap plugin |
protected function registerPlugin($name)
{
$view = $this->getView();
BootstrapPluginAsset::register($view);
$id = $this->options['id'];
if ($this->clientOptions !== false) {
$options = empty($this->clientOptions) ? '' : Json::htmlEncode($this->clientOptions);
$js = "jQuery('#$id').$name($options);";
$view->registerJs($js);
}
$this->registerClientEvents();
}
Renders collapsible toggle button.
protected string renderToggleButton ( ) | ||
return | string |
The rendering toggle button. |
---|
protected function renderToggleButton()
{
$options = $this->togglerOptions;
Html::addCssClass($options, ['widget' => 'navbar-toggler']);
return Html::button(
$this->togglerContent,
ArrayHelper::merge($options, [
'type' => 'button',
'data' => [
'toggle' => 'collapse',
'target' => '#' . $this->collapseOptions['id'],
],
'aria-controls' => $this->collapseOptions['id'],
'aria-expanded' => 'false',
'aria-label' => $this->screenReaderToggleText,
])
);
}
Renders the widget.
public void run ( ) |
public function run()
{
$tag = ArrayHelper::remove($this->collapseOptions, 'tag', 'div');
echo Html::endTag($tag) . "\n";
if ($this->renderInnerContainer) {
echo Html::endTag('div') . "\n";
}
$tag = ArrayHelper::remove($this->options, 'tag', 'nav');
echo Html::endTag($tag);
BootstrapPluginAsset::register($this->getView());
}
Container options setter for backwards compatibility
public void setContainerOptions ( $collapseOptions ) | ||
$collapseOptions | array |
public function setContainerOptions($collapseOptions)
{
$this->collapseOptions = $collapseOptions;
}