Виджет Навигация по видам

В виджете Навигация по видам есть вкладки для конечных пользователей для доступа к видам в виджете Раздел. Если пользователи будут работать с видами в разделе, то будет обновляться только содержание раздела, а не содержание всей страницы, таким образом все приложение будет работать быстрее.

Пример

Используйте этот виджет для поддержки требований к разработке приложений, таких как:

  • Вы создаете несколько видов похожих ресурсов в виджете Раздел, чтобы избежать длительной прокрутки в вашем приложении. Включите виджет Навигация по видам, чтобы пользователи могли щелкать по вкладкам или использовать кнопки и бегунок для обновления содержания раздела и доступа к видам.

Примечания по использованию

У страницы должен быть виджет Раздел, с которым вы можете связать виджет Навигация по видам. Вы должны разместить этот виджет за пределами раздела, вы не можете вложить виджет Навигация по видам в соответствующий ему виджет Раздел. Например, можно разместить виджет над или под разделом (идеальный вариант для горизонтальных вкладок), либо слева или справа от раздела (для вертикальных вкладок).

При добавлении виджета Навигация по видам рядом с ним появляется окно Быстрый стиль, в котором можно выбрать различные стили, включая вкладки, символы, бегунок и кнопки навигации. (Чтобы получить доступ к этому окну снова, щелкните кнопку Быстрый стиль Быстрый стиль в панели инструментов виджета) Вы также можете настроить собственный дизайн, выбрав в расширенных настройках цвета и шрифты для различных состояний виджета.

Для стилей вкладок и символов можно включить все виды разделов или отдельные виды. Чтобы настроить последовательность видов, откройте панель конфигурации виджета Раздел и перетащите виды в том порядке, в котором они должны появляться в виджете Навигация по видам. Вы также можете изменить имена видов в настройках виджета Раздел.

Настройки

У виджета Навигация по видам есть следующие настройки:

  • Связать с – выберите виджет раздела на странице.

В зависимости от выбранного стиля вы можете настроить различные параметры.

Для стилей вкладок (по умолчанию, подчеркивание и знак) можно настроить следующие параметры:

  • Виды – укажите виды, которые должны быть показаны в виджете, выбрав одну из следующих опций:
    • Автоматический – включить вкладки для всех видов в разделе.
    • Пользовательский – включить вкладки для выбранных видов в разделе.
  • Направление – показать вкладки горизонтально или вертикально.
  • Расстояние - задает расстояние между вкладками в пикселах.
  • Выравнивание - определяет расположение текста вкладки. Например, если вы выбираете горизонтальный стиль, название вкладки будет выровнено с вкладкой: левый или правый край либо по центру.
  • Расширенный – измените тему вашего приложения, чтобы изменить цвет фона виджета и стиль трех состояний вкладок и дать пользователям знак, когда они могут задержать курсор или выбрать вкладку. Обычное – это состояние вкладки без взаимодействия с пользователем; Выбрано – это выбор пользователем вкладки, которая отображает соответствующий вид в связанном виджете Раздел; и Наведение – это состояние вкладки, когда пользователь указывает на нее.
    Подсказка:

    Чтобы поэкспериментировать с этими опциями, нажмите Реальный вид на панели инструментов конструктора.

    • Текст – измените размер шрифта (в пикселах) и цвет, а также стиль вкладки (полужирный, курсив, зачеркнутый или подчеркнутый).
    • Фон – выберите цвет заливки для вкладки.
    • Граница или Подчеркивание– выберите для вкладки цвет границы, стиль (штриховой или точками), а также толщину в пикселах. Для стиля Подчеркивание вкладки вы можете только выбрать цвет и толщину линии.
    • Радиус границы – измените размер радиуса (в пикселах или процентах), чтобы настроить форму углов вкладки.

Для стиля Символ вы можете настроить следующее:

  • Виды – укажите виды, которые должны быть показаны в виджете, выбрав одну из следующих опций:
    • Авто – включить символы для всех видов в разделе.
    • Пользовательский – включить символы для выбранных видов в разделе.
  • Направление – показать символы горизонтально или вертикально.
  • Расстояние - задает расстояние между символами в пикселах.
  • Выравнивание - определяет расположение символов в виджете. Например, если вы выбираете вертикальное направление, символы выравниваются по контейнеру виджета: по левому или по правому краю или по центру.
  • Подсказка инструмента – показать текст подсказки, которая отображает имя вида.
  • Символ – выбрать значки для текущего вида или видов.
  • Расширенный – измените тему вашего приложения и выберите цвет фона виджета, размер значков (в пикселах) и цвет для трех состояний символа навигации по видам: Обычный, Выбрано и Наведение.

Для стиля Бегунок вы можете настроить следующее:

  • Маркер – включить маркер (указатель) на бегунке, чтобы отобразить продвижение вдоль дорожки.
  • Расширенный – измените тему вашего приложения, чтобы изменить цвет фона виджета и цвет трех состояний бегунка:
    • Активный – пройденная часть дорожки бегунка.
    • Маркер – указатель-маркер на дорожке бегунка. Вы можете выбрать цвета заливки и границ для маркера.
    • Неактивный – не пройденная часть дорожки бегунка.

Для стиля стрелки вы можете настроить следующее:

  • Направление – отображение кнопок навигации и текста горизонтально или вертикально.
  • Шаг – определите, насколько раздел перемещается вперед и назад при каждом нажатии кнопок навигации. Значением по умолчанию является 1, допускаются входные значения в диапазоне от 0 до 1. Чтобы увидеть эффект, настройте анимацию перехода для соответствующего виджета Раздел.
  • Предыдущий и следующий – введите текст и выберите значок для кнопок навигации.
  • Расширенный – измените тему вашего приложения, чтобы выбрать цвет фона виджета и стиль трех состояний кнопки навигации: Обычный – это состояние кнопки без взаимодействия с пользователем; Наведение – это состояние кнопки, когда пользователь указывает на нее; и Отключено – это состояние кнопки, когда она не доступна, если нет следующего или предыдущего вида.
    • Текст – выберите размер шрифта (в пикселах), цвет и стиль текста кнопки навигации.
    • Значок – измените размер (в пикселах) и цвет кнопок навигации.
    • Фон – выберите цвет заливки кнопок навигации.
    • Граница – выберите цвет, стиль и ширину (в пикселах) для границ кнопок.
    • Радиус границ – измените размер радиуса (в пикселах или процентах), чтобы настроить углы кнопок навигации.