Zoom óptico e redimensionamento

Este artigo descreve o zoom e o redimensionamento de elementos do Windows e fornece diretrizes de experiência do usuário para usar esses mecanismos de interação em seus aplicativos.

APIs importantes: Windows.UI.Input, Entrada (XAML)

O zoom óptico permite que os usuários ampliem sua exibição do conteúdo dentro de uma área de conteúdo (ele é executado na própria área de conteúdo), enquanto o redimensionamento permite que os usuários alterem o tamanho relativo de um ou mais objetos sem alterar a exibição da área de conteúdo (ela é executada nos objetos dentro da área de conteúdo).

As interações de zoom óptico e redimensionamento são executadas por meio dos gestos de pinçagem e alongamento (mover os dedos mais distantes aproxima e movê-los mais próximos afasta), ou mantendo pressionada a tecla Ctrl enquanto rola a roda de rolagem do mouse, ou pressionando a tecla Ctrl (junto com a tecla Shift, se nenhum teclado numérico estiver disponível) e pressionando a tecla mais (+) ou menos (-).

Os diagramas a seguir demonstram as diferenças entre redimensionamento e zoom óptico.

Zoom óptico: o usuário seleciona uma área e, em seguida, amplia toda a área.

Redimensionar: o usuário seleciona um objeto dentro de uma área e redimensiona esse objeto.

Nota O zoom óptico não deve ser confundido com o Zoom Semântico. Embora os mesmos gestos sejam usados para ambas as interações, o zoom semântico refere-se à apresentação e à navegação do conteúdo organizado em um único modo de exibição (como a estrutura de pastas de um computador, uma biblioteca de documentos ou um álbum de fotos).

 

O que fazer e o que não fazer

Use as seguintes diretrizes para aplicativos que dão suporte ao redimensionamento ou ao zoom óptico:

• Se restrições de tamanho máximo e mínimo ou limites forem definidos, use comentários visuais para demonstrar quando o usuário atingir ou exceder esses limites.

• Use pontos de ajuste para influenciar o comportamento de zoom e redimensionamento, fornecendo pontos lógicos onde se deve parar a manipulação e assegurar que um subconjunto específico de conteúdo seja exibido na janela de visualização. Forneça pontos de ajuste para níveis de zoom comuns ou exibições lógicas para facilitar a seleção desses níveis por um usuário. Por exemplo, os aplicativos de fotos podem fornecer um ponto de ajuste de redimensionamento em 100% ou, no caso de aplicativos de mapeamento, os pontos de ajuste podem ser úteis nas exibições de cidade, estado e país/região.

  Os pontos de ajuste permitem que os usuários sejam imprecisos e ainda atinjam suas metas. Se você estiver usando XAML, consulte as propriedades de pontos de encaixe do ScrollViewer.

  Há dois tipos de snap-points:

  • Proximidade – Depois que o contato é levantado, um ponto de ajuste é selecionado se a inércia parar dentro de um limite de distância do ponto de ajuste. Os pontos de encaixe de proximidade ainda permitem que um zoom ou redimensionamento termine entre pontos de encaixe.
  • Obrigatório - O ponto de encaixe selecionado é aquele que precede ou sucede imediatamente o último ponto de encaixe cruzado antes que o contato seja levantado (dependendo da direção e da velocidade do gesto). Uma manipulação deve terminar em um ponto de ajuste obrigatório.

• Use física de inércia. Estes incluem o seguinte:

  • Desaceleração: ocorre quando o usuário para de pinçar ou alongar. Isso é semelhante a deslizar e parar em uma superfície escorregadia.
  • Salto: um leve efeito de recuperação ocorre quando uma restrição de tamanho ou limite é passado.

• Controles espaciais de acordo com as Diretrizes de direcionamento.

• Forneça alças de dimensionamento para redimensionamento controlado. O redimensionamento isométrico, ou proporcional, será o padrão se as alças não forem especificadas.

• Não use zoom para navegar na interface do usuário ou expor controles adicionais em seu aplicativo, use uma região de movimento panorâmico. Para obter mais informações sobre panning, consulte Diretrizes para panning.

• Não coloque objetos redimensionáveis em uma área de conteúdo redimensionável. As exceções a isso incluem:

  • Aplicativos de desenho em que itens redimensionáveis podem aparecer em uma tela redimensionável ou placa de arte.
  • Páginas da Web com um objeto inserido, como um mapa.

  Nota Em todos os casos, a área de conteúdo é redimensionada, a menos que todos os pontos de toque estejam dentro do objeto redimensionável.

Artigos relacionados

Samples

• Exemplo básico de entrada
• Exemplo de entrada de baixa latência
• Exemplo de modo de interação do usuário
• Exemplo de elementos visuais de foco

Amostras de arquivo

• Entrada: exemplo de eventos de entrada do usuário XAML
• Entrada: exemplo de funcionalidades do dispositivo
• Entrada: exemplo de teste de clique por toque
• Amostra de aplicação de rolagem, movimento panorâmico e zoom em XAML
• Entrada: amostra de tinta simplificada
• Entrada: exemplo de manipulações e gestos
• Exemplo de entrada por toque do DirectX