Aplicativos do Windows
Recolher sumário
Expandir sumário

Como posicionar o submenu do bloco secundário (aplicativos estilo Metro que usam JavaScript e HTML)

[Esta documentação é preliminar e está sujeita a alterações.]

Este tópico mostra como posicionar a caixa de diálogo por meio da qual solicita-se que o usuário confirme se quer fixar um item na tela Inicial. A melhor prática consiste em exibir a caixa de diálogo perto do elemento clicado ou tocado para fixar o item.

O que você precisa saber

Tecnologias

  • Windows Runtime

Pré-requisitos

  • Um conhecimento prático dos termos e conceitos de bloco e notificação. Para saber mais, veja Notificações, Notificações e Blocos..
  • Experiência trabalhando com o Document Object Model (DOM).
  • Capacidade de criar um aplicativo estilo Metro básico com JavaScript usando o APIs Windows Runtime.

Instruções

Etapa 1: Inclua um elemento na página que fará pin para Submenu

Quando o botão Fixar em Iniciar for clicado e tocado, ela exibe a caixa de diálogo de confirmação. A decisão de fixar o conteúdo à tela inicial sempre fica com o usuário.



<button class="action" id="pinTileButton">

Etapa 2: Determine as coordenadas de associação do cliente daquele elemento

Como o submenu deve ficar perto do item que o invocou, você deve saber onde aquele item está.



var element = document.getElementById("pinTileButton"),
var selectionRect = element.getBoundingClientRect();

Etapa 3: Fixe no bloco secundário, passando o local do item que o invocou

Chame o método SecondaryTile.requestCreateAsync, que exibe a caixa de diálogo de confirmação usando as coordenadas fornecidas para exibir a caixa de diálogo perto do ponto de invocação. Quando o usuário confirmar, o método retorna e você pode continuar. Esta etapa assume que você já tenha criado um objeto SecondaryTile chamado "bloco". Para saber mais, veja Guia do início rápido: fixando em um bloco secundário.



tile.requestCreateAsync({ x: selectionRect.left, y: selectionRect.top }).then(function (isPinned) {{
    if (isPinned) {
        // Proceed.
    } else {
        // The user canceled the operation or an error occurred.
    }
});

Tópicos relacionados

Diretrizes e lista de verificação para blocos secundários
Visão geral dos blocos secundários

 

 

Mostrar:
© 2017 Microsoft