Эскизы

В этом руководстве описано, как использовать эскизы для предоставления пользователям возможности предварительного просмотра файлов во время просмотра содержимого папок в приложении UWP.

Важные API

Следует ли включить эскизы в приложение?

Если приложение позволяет пользователям просматривать файлы, можно отобразить эскизы, чтобы предоставить возможность быстрого предварительного просмотра этих файлов.

Используйте эскизы:

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

    video gallery

  • Для предоставления предварительного просмотра отдельного элемента в списке (например, файла). Например, пользователю перед принятием решения об открытии файла может потребоваться просмотреть дополнительную информацию о файле, скажем, эскиз большего размера.

    video preview

Полезные советы

  • Укажите режим эскизов (PicturesView, VideosView, DocumentsView, MusicView, ListView или SingleItem) при извлечении эскизов. Это гарантирует оптимизацию эскизов для отображения нужного пользователям типа файлов.

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

    Заполнители должны:

    • Быть характерными для типа элемента, для которых они предназначены. Например, папки, изображения и видео должны иметь свои особые заполнители.
    • Быть того же размера и пропорций, что и эскизы, для которых они предназначены.
    • Отображаться до тех пор, пока не загрузится эскиз.
  • Используйте заполнители с текстовыми метками для представления папок и групп файлов, чтобы отделить их от отдельных файлов.

  • Если получить эскиз невозможно, отобразите заполнитель.

  • Отображайте дополнительные сведения о файле, предоставляя элементы предварительного просмотра для документов и музыкальных файлов. Пользователи могут идентифицировать ключевую информацию о файле, которая может отсутствовать в эскизе. Например, в случае музыкального файла можно отображать имя исполнителя наряду с эскизом обложки альбома.

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

Дополнительные рекомендации по использованию

Рекомендуемые режимы эскизов и их функции:

Предварительный просмотр Режимы эскизов Функции извлеченных эскизов изображений
Изображения
Видео
PicturesView
ВидеоView
Размер: средний, желательно по крайней мере 190 (если размер изображения равен 190x130)
Пропорции: равномерное, широкое соотношение пропорций около 7 (190x130, если размер равен 190)
Обрезано для предварительного просмотра.
Обеспечивает выравнивание изображений в сетке благодаря одинаковым пропорциям.
документы.
Музыка
DocumentsView
MusicView
ListView
Размер: небольшой, желательно по крайней мере 40 x 40 пикселей
Пропорции: равномерное, квадратная пропорция
Хорошо подходит для предварительного просмотра обложек альбомов благодаря квадратным пропорциям.
Документы выглядят так же, как в окне средства выбора файлов (в нем используются те же значки).
Любой отдельный элемент (независимо от типа файла) SingleItem Размер: небольшой, желательно по крайней мере 40 x 40 пикселей
Пропорции: равномерное, квадратная пропорция
Хорошо подходит для предварительного просмотра обложек альбомов благодаря квадратным пропорциям.
Документы выглядят так же, как в окне средства выбора файлов (в нем используются те же значки).

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

Тип элемента При извлечении с помощью:
  • PicturesView
  • VideosView
При извлечении с помощью:
  • DocumentsView
  • MusicView
  • ListView
При извлечении с помощью:
  • SingleItem
Рисунок Для эскиза изображения используются однородные прямоугольные пропорции, примерно равные 0,7 (190 x 130, если предпочтительный размер составляет 190 пикселей).
Picture thumbnail in picture or video mode
Эскиз был обрезан до квадрата.
Picture thumbnail in documents, music, or list modes
Для изображения эскиза используются пропорции исходного файла.
Picture thumbnail in single mode
Видео У эскиза есть значок, отличающий его от изображений.
Video thumbnail in picture or video mode
Эскиз был обрезан до квадрата.
Video thumbnail in documents, music, or list mode
Для изображения эскиза используются пропорции исходного файла.
Video thumbnail in single mode
Музыка Эскиз — это значок на фоне соответствующего размера. Цвет фона определяется цветом фона плитки приложения.
Music thumbnail in picture or video mode
Если у файла есть обложка альбома, то эскизом будет обложка альбома.
Music thumbnail in documents, music, or list mode
В противном случае эскиз — это значок на фоне соответствующего размера.
Если у файла есть обложка альбома, то эскизом будет обложка альбома, для которого будут использоваться исходные пропорции файла.
Music thumbnail in single mode
В противном случае эскиз — это значок.
Документ Эскиз — это значок на фоне соответствующего размера. Цвет фона определяется цветом фона плитки приложения.
Document thumbnail in picture or video mode
Эскиз — это значок на фоне соответствующего размера. Цвет фона определяется цветом фона плитки приложения.
Document thumbnail in documents, music, or list mode
Эскиз документа, если таковой существует.
Document thumbnail in single mode
В противном случае эскиз — это значок.
Document thumbnail icon in single mode
Папка Если есть файл изображения в папке, используется эскиз изображения.
Folder thumbnail in picture or video mode
В противном случае эскиз не загружается.
Изображение эскиза не загружено. Эскиз представляет собой значок папки.
Folder icon thumbnail in single mode
файловая группа; Если есть файл изображения в папке, используется эскиз изображения.
File group thumbnail in picture or video mode.
В противном случае эскиз не загружается.
Если среди файлов в группе есть файл, у которого есть обложка альбома, то в качестве эскиза используется обложка альбома.
File group thumbnail in documents, music or list mode
В противном случае эскиз не загружается.
Если среди файлов в группе есть файл, у которого есть обложка альбома, то в качестве эскиза используется обложка альбома, для которого используются исходные пропорции файла.
File group thumbnail in documents, music or list mode using the original aspect ratio of the file.
В противном случае эскиз — это значок, представляющий группу файлов.
File group icon in single mode