Tree Chevrone
Данный вид дерева используется, когда группирующие страницы имеют свою личную страницу (URL).
Last updated
Was this helpful?
Данный вид дерева используется, когда группирующие страницы имеют свою личную страницу (URL).
Last updated
Was this helpful?
Элемент структуры (Страница, папка, группа, ссылка и т.д.)
Шеврон. Разворачивает или сворачивает элементы структуры
Вспомогательная иконка (опционально). Она может помочь пользователю быстро определять различные типы контента.
Разворачивание и сворачивание страниц происходит по клику на кнопку-иконку шеврон, при этом страница не выбирается:
Чтобы выбрать страницу, пользователь может нажать в любом месте элемента, за исключением области кнопки-иконки шеврона:
Для выбора страницы последнего уровня, пользователь может нажать в любом месте контейнера.
Если дочерняя страница, выбранная пользователем, сворачивается, родительская страница должна наследовать выбранное состояние (без маркера), чтобы пользователь не терял контекст того, что выбрано, даже если это скрыто от глаз.
Если наименование страницы слишком длинное и не помещается в одну строчку, текст уходит в многоточие (…)и при наведении показывается всплывающая подсказка (хинт), чтобы отобразить весь текст.
При добавлении иконок к страницам в древовидном представлении важно, чтобы иконка была у каждой страницы. Отсутствие иконки у каждой страницы может привести к несоответствию выравнивания и затруднить восприятие иерархии групп страниц.
Для множественного выбора используйте чекбоксы:
Дерево имеет динамическую высоту и ширину, в зависимости от входящих в неё количества элементов и контейнера, в который оно встроено. Минимальная рекомендуемая ширина - 360 рх.
Высота элемента (страницы) - 32 рх
Элементы дерева имеют 5 состояний:
Default. Состояние по умолчанию
Hover. При наведении
Active. Выбранная страница
Active (parent). Скрытая дочерняя выбранная страница
Disabled. Страница, заблокированная для выбора
Фокус
Так же существует состояние Focus. Он появляется в момент выбора страницы с помощью клавиатуры или при клике в выбранный элемент, и может быть совмещен с любым другим состоянием. Невозможен в состоянии Disabled.
Состояние Focus отсутствует в компонентах для выбора и используется исключительно для разработки.
