Imagens em miniatura

Essas diretrizes descrevem como usar imagens em miniatura para ajudar os usuários a visualizar arquivos enquanto navegam em seu aplicativo WinUI.

APIs importantes

Meu aplicativo deve incluir miniaturas?

Se o aplicativo permitir que os usuários procurem arquivos, você poderá exibir imagens em miniatura para ajudar os usuários a visualizar rapidamente esses arquivos.

Use miniaturas quando:

  • Exibindo visualizações para muitos itens em uma coleção de galerias (como arquivos e pastas). Por exemplo, uma galeria de fotos deve usar miniaturas para dar aos usuários uma pequena exibição de cada imagem enquanto navegam pelos arquivos de fotos.

    galeria de vídeos

  • Exibindo uma visualização de um item individual em uma lista (como um arquivo específico). Por exemplo, talvez o usuário queira ver mais informações sobre um arquivo, incluindo uma miniatura maior para uma melhor visualização, antes de decidir se deseja abrir o arquivo.

    visualização de vídeo

O que fazer e o que não fazer

  • Especifique o modo de miniatura (PicturesView, VideosView, DocumentsView, MusicView, ListView ou SingleItem) quando recuperar miniaturas. Isso garante que as imagens em miniatura sejam otimizadas para exibir o tipo de arquivos que os usuários desejam ver.

    • Use o modo SingleItem para recuperar uma miniatura para um único item, independentemente do tipo de arquivo. Os outros modos de miniatura são destinados a exibir visualizações de vários arquivos.
  • Exiba imagens de espaço reservado genéricas em vez de miniaturas enquanto as miniaturas são carregadas. Usar espaços reservados ajuda seu aplicativo a parecer mais responsivo porque os usuários podem interagir com pré-visualizações antes do carregamento da miniatura.

    As imagens de espaço reservado devem ser:

    • Específicas ao tipo de item que elas representam. Por exemplo, pastas, imagens e vídeos devem ter seus próprios espaços reservados especializados.
    • Do mesmo tamanho e taxa de proporção da imagem em miniatura que elas representam.
    • Exibido até que a imagem em miniatura seja carregada.
  • Use imagens de espaço reservado com rótulos de texto para representar pastas e grupos de arquivos para diferenciar arquivos individuais.

  • Se você não conseguir recuperar uma miniatura, exiba uma imagem de espaço reservado.

  • Exiba informações adicionais de arquivo ao fornecer visualizações para arquivos de documentos e músicas. Os usuários podem identificar informações importantes sobre um arquivo que pode não estar prontamente disponível apenas em uma imagem em miniatura. Por exemplo, para um arquivo de música, você pode exibir o nome do artista junto com a miniatura da arte do álbum.

  • Não exiba informações adicionais de arquivo para arquivos de imagem e vídeo. Na maioria dos casos, uma imagem em miniatura é suficiente para usuários que navegam por imagens e vídeos.

Diretrizes de uso adicionais

Modos de miniatura recomendados e seus recursos:

Exibir visualizações para Modos de miniatura Recursos das imagens em miniatura recuperadas
Fotos
Vídeos
PicturesView
Visualização de Vídeos
Tamanho: médio, preferencialmente pelo menos 190 (se o tamanho da imagem for 190x130)
Proporção: proporção uniforme e ampla de cerca de 0,7 (190 x 130 se o tamanho for 190)
Cortado para pré-visualizações.
Ideal para alinhar imagens em uma grade devido à taxa de proporção uniforme.
Documentos
Música
VisualizaçãoDeDocumentos
MusicView
ListView
Tamanho: pequeno, preferencialmente, pelo menos 40 x 40 pixels
Relação de aspecto: Relação de aspecto uniforme e quadrada
Ideal para visualização da capa do álbum devido à taxa de proporção quadrada.
Os documentos têm a mesma aparência que parecem em uma janela do seletor de arquivos (ele usa os mesmos ícones).
Qualquer item único (independentemente do tipo de arquivo) ItemÚnico Tamanho: pequeno, preferencialmente, pelo menos 40 x 40 pixels
Relação de aspecto: Relação de aspecto uniforme e quadrada
Ideal para visualização da capa do álbum devido à taxa de proporção quadrada.
Os documentos têm a mesma aparência que parecem em uma janela do seletor de arquivos (ele usa os mesmos ícones).

Aqui estão exemplos que mostram como as imagens em miniatura recuperadas diferem dependendo do tipo de arquivo e do modo de miniatura:

Tipo de item Quando recuperado usando:
  • PicturesView
  • Visualização de Vídeos
Quando recuperado usando:
  • VisualizaçãoDeDocumentos
  • MusicView
  • ListView
Quando recuperado usando:
  • Item Único
Picture A imagem em miniatura usa uma proporção uniforme e ampla de cerca de 0,7 (190 x 130 se o tamanho preferencial for 190).
Miniatura de foto nos modos de foto ou vídeo
A miniatura é recortada de acordo com uma taxa de proporção quadrada.
Miniatura de imagem em documentos, música ou modos de lista
A imagem em miniatura usa a proporção original do arquivo.
Miniatura de imagem em modo único
Vídeo A miniatura tem um ícone que a diferencia das imagens.
Miniatura de vídeo em modo de imagem ou de vídeo
A miniatura é recortada de acordo com uma taxa de proporção quadrada.
Miniatura de vídeo em modo de documentos, de música ou de lista
A imagem em miniatura usa a proporção original do arquivo.
Miniatura de vídeo em modo único
Música A miniatura é um ícone em uma tela de fundo de tamanho apropriado. A cor da tela de fundo é determinada pela cor da tela de fundo do bloco do aplicativo.
Miniatura de música em modo de imagem ou de vídeo
Se o arquivo tem arte do álbum, então a miniatura é a arte do álbum.
Miniatura de música em documentos, música ou modo de lista
Caso contrário, a miniatura será um ícone em uma tela de fundo de tamanho apropriado.
Se o arquivo contiver a capa do álbum, a miniatura será a capa do álbum com a taxa de proporção original do arquivo.
Miniatura de música em modo único
Caso contrário, a miniatura é um ícone.
Documento A miniatura é um ícone em uma tela de fundo de tamanho apropriado. A cor da tela de fundo é determinada pela cor da tela de fundo do bloco do aplicativo.
Miniatura do documento no modo de imagem ou vídeo
A miniatura é um ícone em uma tela de fundo de tamanho apropriado. A cor da tela de fundo é determinada pela cor da tela de fundo do bloco do aplicativo.
Miniatura de documento em modo de documentos, de música ou de lista
A miniatura do documento, se existir.
Miniatura de documento em modo único
Caso contrário, a miniatura é um ícone.
Ícone da miniatura de documento em modo único
Pasta Se houver um arquivo de imagem na pasta, a miniatura da imagem será usada.
Miniatura de pasta em modo de imagem ou de vídeo
Caso contrário, nenhuma miniatura será recuperada.
Nenhuma imagem em miniatura é recuperada. A miniatura é o ícone da pasta.
Miniatura do ícone da pasta em modo único
Grupo de arquivos Se houver um arquivo de imagem na pasta, a miniatura da imagem será usada.
Miniatura do grupo de arquivo em modo de imagem ou de vídeo.
Caso contrário, nenhuma miniatura será recuperada.
Se houver um arquivo que tenha arte de álbum entre os arquivos do grupo, a miniatura será a arte do álbum.
Miniatura do grupo de arquivos no modo de documentos, música ou lista
Caso contrário, nenhuma miniatura será recuperada.
Se houver um arquivo que contenha a arte do álbum entre os arquivos do grupo, a miniatura será a arte do álbum e usará a proporção original do arquivo.
Exibir miniaturas de grupo de arquivos no modo documentos, música ou lista usando a proporção de aspecto original do arquivo.
Caso contrário, a miniatura é um ícone que representa um grupo de arquivos.
Ícone do grupo de arquivos no modo único