Что использовать для построения меню?

[girmate]

Я что-то совсем потерялся в разнообразии способов построения меню в yii2.
Ведь есть:

• yii\widgets\Menu

• yii\bootstrap\Nav

• yii\jui\Menu

А может еще что-то есть (базовый класс в расчет не беру).
Не совсем понимаю чем это все отличается друг от друга.

Прошу посмотреть на вот эту демку:


Сам сайт расположен на странице: http://g-axon.com/mouldifi4.3/light/index.html

Объясните, с помощью чего нужно делать левое вертикальное меню? Если нетрудно, загляните в исходный код страницы.
Шаблон на базе bootstrap 3. Вроде как есть и jQuery UI, но не совсем ясно используется ли он именно в меню.

[ElisDN]

Это похоже на Admin LTE, так что можно взять меню с иконками оттуда.

[za4me]

Загуглите по запросу "bootstrap admin template" найдёте массу шаблонов которые похожи на тот который вы привели. Ну и как выше уже написал Дмитрий, обратите внимание на adminlte.

[girmate]

Дмитрий спасибо, это понятно. Но хочу просто понять какой инструмент из этого списка ближе для решения моей задачи? Шаблонов у меня уже 3, которые я купил (я писал вам тогда еще в личку). Но не могу понять какой из классов нужно использовать для построения такого меню (из того списка, что я привел вначале топика). Или на чистом не получится, нужно будет отнаследоваться?

[Nerf]

Подойдет любое, кроме последнего. <strike>С учетом того, что в теме bootstrap 3, то yii\bootstrap\Nav подойдет больше, скорее всего. Вероятно, что все сведется к конфигурированию виджета.</strike> Там простой <ul>.../ul> + нужно картинки добавить на первый взгляд. Так что придется переопределять. Так как Menu по коду проще, то лучше из него лепить.

[girmate]

Я тоже склонялся Menu, и с первого взгляда код просто, но есть одно но, которое меня смущает:

Код: Выделить всё

<li class="has-sub"><a href="mail-inbox.html"><i class="icon-mail"></i><span class="title">Mailbox</span></a>
	<ul class="nav collapse">
		<li><a href="mail-inbox.html"><span class="title">Inbox</span></a></li>
		<li><a href="mail-compose.html"><span class="title">Compose Mail</span></a></li>
		<li><a href="mail-read.html"><span class="title">View Mail</span></a></li>
	</ul>
</li>
<li><a href="maps-vector.html"><i class="icon-location"></i><span class="title">Vector Map</span> <span class="label label-secondary pull-right">NEW</span></a></li>
<li class="has-sub active"><a href="login.html"><i class="icon-google-circles"></i><span class="title">Various Screens</span></a>
	<ul class="nav">
		<li><a href="register.html"><span class="title">Register</span></a></li>
		<li><a href="forgot-password.html"><span class="title">Forgot password</span></a></li>
		<li><a href="lockscreen.html"><span class="title">Lockscreen</span></a></li>
		<li><a href="error-404.html"><span class="title">404 Page</span></a></li>
		<li class="active"><a href="blank-page.html"><span class="title">Blank Page</span></a></li>
		<li><a href="comments.html"><span class="title">Comments</span></a></li>			
	</ul>
</li>

Если выбран какой-то пункт меню (например, Blank Page) - вот эта строка:

Код: Выделить всё

<li class="active"><a href="blank-page.html"><span class="title">Blank Page</span></a></li>

То обворачивающий <ul class="nav">, в то время как не активные (соседние), обворачиваются в <ul class="nav collapse">. И если для пунктов меню можно настроить классы, то как повлиять на их обертку?

И вроде как меню yii2 есть метод isItemActive(), protected, возвращающий активен или нет пункт меню, который можно было использовать для установки шаблона обертки <ul> но я не пойму как им пользоваться (можно ли его использовать как-то внутри при настройке item), если я думаю в том направлении.

[Nerf]

collapse добавляется всегда, когда есть вложенные пункты, кишки скрыты. in добавляется, когда нужно эти кишки показать. Если вы хотите, чтобы активная ветка отображалась открытой (что логично), то нужно везде к collapse добавить in.
https://github.com/yiisoft/yii2/blob/ma ... u.php#L128 в true.
Т.е. по сути вам не нужно заморачиваться с активностью родителей, в normalizeItems() уже все написано.
Что-то вроде:

Код: Выделить всё

if ($item['active']) {
	$submenuTemplate = "\n<ul class=\"collapse in\">\n{items}\n</ul>\n";
} else {
	$submenuTemplate = "\n<ul class=\"collapse\">\n{items}\n</ul>\n";
}

вместо https://github.com/yiisoft/yii2/blob/ma ... u.php#L221

ПС: в yii\bootstrap\Nav аналогично, но больше настроек через конфигурацию. Возможно стоит посмотреть и его.

[Йож]

Посмотрите, как тут сделано:
https://github.com/trntv/yii2-starter-k ... n.php#L125

Админка Admin LTE.

[girmate]

collapse добавляется всегда, когда есть вложенные пункты, кишки скрыты. in добавляется, когда нужно эти кишки показать. Если вы хотите, чтобы активная ветка отображалась открытой (что логично), то нужно везде к collapse добавить in.
https://github.com/yiisoft/yii2/blob/ma ... u.php#L128 в true.
Т.е. по сути вам не нужно заморачиваться с активностью родителей, в normalizeItems() уже все написано.
Что-то вроде:

Код: Выделить всё

if ($item['active']) {
	$submenuTemplate = "\n<ul class=\"collapse in\">\n{items}\n</ul>\n";
} else {
	$submenuTemplate = "\n<ul class=\"collapse\">\n{items}\n</ul>\n";
}

вместо https://github.com/yiisoft/yii2/blob/ma ... u.php#L221

ПС: в yii\bootstrap\Nav аналогично, но больше настроек через конфигурацию. Возможно стоит посмотреть и его.

Спасибо, Nerf! Даже ваш пример не пришлось допиливать (только названия классов поменял на свои)! Вставил как вы написали и все сразу заработало. Как вам это удается?