<page xmlns="http://projectmallard.org/1.0/" xmlns:uix="http://projectmallard.org/experimental/ui/" xmlns:itst="http://itstool.org/extensions/" type="topic" id="lists" xml:lang="ru">

  <info>

    <link type="guide" xref="patterns#primary"/>

    <desc>Rows of information or content items.</desc>

    <credit type="author">

      <name>Алан Дэй (Allan Day)</name>

      <email>aday@gnome.org</email>

    </credit>

    <include xmlns="http://www.w3.org/2001/XInclude" href="legal.xml"/>

  </info>

<title>Списки</title>

Список это один из основных элементов пользовательского интерфейса, служащий для представления информации или элементов управления. В GNOME 3 существуют два основных типа списков: стандартные списки и таблицы.

<link xref="sidebar-lists">Боковые списки</link> -- это отдельный шаблон проектирования, который также использует список.

<section id="when-to-use">

<title>Когда использовать</title>

Список -это способ представления множественных элементов, где в качестве главного идентификатора используется имя представляемого элемента. Если информация имеет визуальную природу, например фотографии или видеоролики, попробуйте применить <link xref="grids">сетки</link> вместо списков.

В некоторых случаях для одних и тех же элементов можно использовать как списочное представление, так и сеточное. В этом случае списочное представление можно использовать для размещения информации о содержимом.

</section>

<section id="standard-lists">

<title>Стандартные списки</title>

Стандартные списки это наиболее распространённый тип списков. Старайтесь отдавать предпочтение стандартным спискам, а не таблицам.

In standard lists, each row is divided by separators, and changing the sort order is achieved by using a control outside the list itself.

<section id="styles">

<title>Стили</title>

У стандартных списков существует два стиля: растянутый и встроенный. Растянутые списки полностью заполняют свои контейнеры, вокруг встроенных списков существуют отступы.

Растянутые списки выглядят проще и аккуратнее. Придерживайтесь этого стиля списков везде, где это возможно. Но есть случаи, когда растянутые списки использовать невозможно. Примеры, когда лучше использовать встроенные списки:

<list>

<item>
Когда список используется в широком контейнер, и для сохранения читабельности столбцы с информацией должны располагаться близко друг к другу.
</item>

<item>
Когда в окне содержится несколько списков.
</item>

<item>
Когда необходимо выровнять список с другими управляющими элементами в окне.
</item>

</list>

<media type="image" mime="image/svg" src="figures/patterns/list-styles.svg"/>

</section>

<section id="editable-lists">

<title>Изменяемые списки</title>

Изменяемые списки позволяют пользователям добавлять и удалять элементы из списка. Изменяемыми могут быть как растянутые списки, так и встроенные.

Each row contains a remove button. If the number of items is short, the final list row should be used as an add button. Alternatively, if the list is long, the add button can be placed in a <link xref="header-bars">header bar</link> or <link xref="action-bars">action bar</link>.

<media type="image" mime="image/svg" src="figures/patterns/editable-lists.svg"/>

</section>

</section>

<section id="tables">

<title>Таблицы</title>

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

В качестве индикации порядка сортировки в заголовке используйте стрелки.

Порядок

Направление стрелок

Пример

Естественный

Вниз

Алфавитный, по возрастанию чисел, по возрастанию дат, по признаку включённости

Обратный

Вверх

Обратный алфавитный порядок, по убыванию чисел, по убыванию дат, по признаку выключенности

</section>

<section id="row-behavior">

<title>Поведение строк</title>

В зависимости от типа списка поведение строк может изменяться, когда пользователь нажимает на них. По этому аспекту списки можно разделить на три вида:

Тип списка

Поведение строки

Навигация

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

Выбор

Элемент списка выбирается при нажатии на нём. Этот поход часто используется, когда требуется выбрать несколько конфигурационных параметров. Если требуется выбрать только один параметр, то это можно реализовать с помощью <link xref="drop-down-lists">выпадающих списков</link>. Выбранная строка должна выделяться ф

Edit

Выбор строки превращает строку в поле ввода, позволяющее изменять элемент строки.

Навигационный стиль можно объединить с <link xref="selection-mode">режимом выделения</link>, это позволит открывать и изменять строки. Не используйте двойное нажатие для открытия элементов списка, это неочевидный способ и он несовместим с сенсорным вводом.

</section>

<section id="general-guidelines">

<title>Общие рекомендации</title>

<list>

<item>
Для разделения информации используйте различные выравнивания, <link xref="typography">цвет и насыщенность шрифта</link>. Выделяйте главную информацию, для второстепенной информации используйте меньшую насыщенность шрифта.
</item>

<item>
Не перегружайте списки столбцами и элементами, используйте списки для представления только необходимой информации.
</item>

<item>
Старайтесь не использовать несколько список в одном и том же окне, особенно в главных окнах.
</item>

<item>
Не используйте списки, когда количество элементов меньше пяти, только если количество элементов не может увеличиться в последствии. Для параметров вместо списков можно применить флаговые кнопки и кнопки-переключатели.
</item>

<item>
Упорядочивайте списки так, чтобы пользователю было удобно с ними работать. Например, списки недавних документов лучше всего упорядочивать по времени использования, а списки контактов, возможно, лучше упорядочивать по статусу.
</item>

<item>
Если в списках используются значки, то <link xref="icons-and-artwork">применяйте символические значки</link>, они проще для восприятия и не смещают на себя акцент.
</item>

<item>
Если список слишком длинный, добавьте возможность поиска, применив стандартный <link xref="search">шаблон поиска</link>.
</item>

</list>

</section>

<section id="api-reference">

<title>API reference</title>

<list>

<item>
<link href="https://developer.gnome.org/gtk3/stable/GtkListBox.html">GtkListBox</link>
</item>

<item>
<link href="https://developer.gnome.org/gtk3/stable/GtkTreeView.html">GtkTreeView</link>
</item>

</list>

</section>

</page>