Abrir conteúdo em várias janelas

O Microsoft Teams fornece vários métodos para abrir o conteúdo da sua aplicação em experiências de tela envolventes. O Stageview permite que os utilizadores adotem multitasking no Teams, por exemplo, pode abrir o conteúdo da sua aplicação numa nova janela do Teams com uma conversa específica no painel lateral. A Stageview foi concebida para:

• Facilitar a multitarefa no Teams.
• Suportar a colaboração em várias janelas do Teams.
• Concentre-se em tarefas específicas numa experiência modal de grande dimensão.

Tipos de Stageview

Com base na IU e na funcionalidade, o Stageview oferece três formas de abrir o conteúdo da sua aplicação:

• Descrição de Fase colaborativa
• Janela Múltipla da Descrição de Etapas
• Stageview Modal

Descrição de Fase colaborativa

O Collaborative Stageview permite cenários de multitasking para o conteúdo da sua aplicação no Teams. Os utilizadores podem abrir e ver os conteúdos da sua aplicação dentro de uma nova janela do Teams enquanto são acompanhados por uma conversação de painel lateral. Esta vista permite uma interação e colaboração de conteúdos relevantes a partir da mesma janela.

Melhor utilização: quando o conteúdo é aberto a partir de uma conversação, como chat, canal ou separador de canal.

Janela Múltipla da Descrição de Etapas

O Stageview Multi-window é útil para cenários que exigem que um utilizador faça várias tarefas no Teams sem a necessidade de colaboração. Esta vista abre o conteúdo da aplicação numa nova janela do Teams sem uma conversação de painel lateral que permita aos utilizadores concentrarem-se na respetiva tarefa.

Melhor utilização: quando o conteúdo é aberto a partir de uma superfície não profissional, como uma aplicação pessoal.

Stageview Modal

O Stageview Modal é um componente de IU de ecrã inteiro utilizado para compor os conteúdos da sua aplicação dentro da janela principal do Teams. Esta vista proporciona aos utilizadores uma experiência focada para interagir com o conteúdo da aplicação. O Stageview Modal é útil para apresentar conteúdo avançado que não exige que um utilizador faça várias tarefas. É a vista predefinida quando o Collaborative Stageview e o Stageview Multi-window não são suportados.

Invocar Visão de Fase

Pode invocar o Stageview no Teams através de um dos seguintes métodos e configurar a resposta esperada da Stageview. A tabela seguinte fornece a resposta predefinida e definida para cada método de invocação do Stageview:

Invocar a Descrição de Fase Colaborativa a partir do Cartão Ajustável

A Descrição de Fase Colaborativa de um Cartão Ajustável permite que os utilizadores interajam com os seus conteúdos enquanto prosseguem o fluxo de conversação. Se a Stageview Colaborativa for invocada a partir de um JSON de Cartão Ajustável no cliente Web do Teams, será aberto num Stageview Modal.

Os passos seguintes ajudam-no a compreender como a Stageview Colaborativa é invocada a partir de um Cartão Ajustável:

1. Quando o utilizador partilha um URL para conteúdos de uma aplicação num chat do Teams, o bot recebe um composeExtensions/queryLink pedido de invocação. O bot devolve um Cartão Ajustável com o tipo tab/tabInfoAction.

2. Depois de o utilizador selecionar o botão de ação no Cartão Ajustável, a Visão de Fase Colaborativa é aberta com base no conteúdo no Cartão Ajustável.

O seguinte código JSON é um exemplo para criar um botão de ação num Cartão Ajustável:

{
  "type": "Action.Submit",
  "title": "Open",
  "data": {
    "msteams": {
      "type": "invoke",
      "value": {
        "type": "tab/tabInfoAction",
        "tabInfo": {
          "contentUrl": "contentUrl",
          "websiteUrl": "websiteUrl",
          "name": "Sales Report",
          "entityId": "entityId"
        }
      }
    }
  }
}

Melhores práticas para criar um Cartão Ajustável

• O URL do conteúdo tem de estar na lista de no manifesto da validDomains sua aplicação.
• O tipo de pedido de invocação tem de ser composeExtensions/queryLink.
• O invoke fluxo de trabalho tem de ser semelhante ao appLinking fluxo de trabalho.
• O Action.Submit tem de ser configurado para Open manter a consistência.

Se a sua aplicação não estiver otimizada para funcionar no cliente móvel do Teams, a Stageview para aplicações distribuídas através da Microsoft Teams Store é aberta num browser predefinido.

Invocar a partir da API stageView

A API stageView do TeamsJS permite-lhe abrir a janela do Teams numa experiência de Stageview com base no openMode definido. Se a openMode propriedade não estiver definida, a resposta predefinida é uma Stageview Colaborativa com uma conversação de painel lateral associada. Numa experiência de Stageview Colaborativa, a conversação do painel lateral é o mesmo tópico a partir do qual a Stageview foi invocada, como chat ou chat de grupo.

Os códigos seguintes são os exemplos para cada openMode valor na API stageView:

  {
    "appId": "2c19df50-1c3c-11ea-9327-cd28e4b6f7ba",
    "contentUrl": "https://teams-test-tab.azurewebsites.net",
    "title": "Test tab ordering",
    "websiteUrl": "https://teams-test-tab.azurewebsites.net",
    "openMode": "popoutWithChat"
  }

  {
    "appId": "2c19df50-1c3c-11ea-9327-cd28e4b6f7ba",
    "contentUrl": "https://teams-test-tab.azurewebsites.net",
    "title": "Test tab ordering",
    "websiteUrl": "https://teams-test-tab.azurewebsites.net",
    "openMode": "popout"
  }

  {
    "appId": "2c19df50-1c3c-11ea-9327-cd28e4b6f7ba",
    "contentUrl": "https://teams-test-tab.azurewebsites.net",
    "title": "Test tab ordering",
    "websiteUrl": "https://teams-test-tab.azurewebsites.net",
    "openMode": "modal"
  }

Quando openMode não está definido no StageViewParams, a resposta predefinida é a Descrição de Fase Colaborativa.

  {
    "appId": "2c19df50-1c3c-11ea-9327-cd28e4b6f7ba",
    "contentUrl": "https://teams-test-tab.azurewebsites.net",
    "title": "Test tab ordering",
    "websiteUrl": "https://teams-test-tab.azurewebsites.net"
  }

Para obter mais informações sobre a API stageView, veja stageView module (Módulo stageView).

parâmetros da API stageView

Invocar a partir de uma ligação avançada

Para invocar o Stageview através de uma ligação avançada a partir do seu separador ou aplicação pessoal, coloque o URL da ligação avançada na API app.openLink(url) e defina a openMode propriedade para o conteúdo do chat abrir. Quando a propriedade openMode não é especificada, a resposta de Stageview de uma ligação avançada é predefinida para o Collaborative Stageview.

Para apresentar uma conversa específica no painel lateral, tem de especificar um threadId. Caso contrário, a conversação do painel lateral traz o chat de grupo ou o tópico do canal a partir do qual a ligação avançada é invocada.

Sintaxe

Sintaxe de ligação avançada para o Collaborative Stageview:

https://teams.microsoft.com/l/stage/{appId}/0?context={"contentUrl":"contentUrl","websiteUrl":"websiteUrl","name":"Contoso","openMode":"popoutWithChat","threadId":"threadId"}

Sintaxe de ligação avançada codificada para a Visão de Fase Colaborativa:

https://teams.microsoft.com/l/stage/%7BappId%7D/0?context=%7B%22contentUrl%22:%22contentUrl%22,%22websiteUrl%22:%22websiteUrl%22,%22name%22:%22Contoso%22,%22openMode%22:%22popoutWithChat%22,%22threadId%22:%22threadId%22%7D

Parâmetros de consulta de ligação avançada

Quer queira facilitar a multitarefa, melhorar a colaboração ou proporcionar uma experiência de utilizador focada, o Stageview tem um modo que se adequa aos seus requisitos.

Perguntas Frequentes

Exemplo de código

Confira também

Criar links detalhados