Adicione uma nova coluna ao aplicativo de amostra Etapas para rastrear itens de trabalho

Os modelos do Power Apps para Microsoft Teams incluem muitas colunas predefinidas para rastrear os pontos de dados mais comuns para seu cenário. Por exemplo, no aplicativo Etapas (https://aka.ms/TeamsMilestones), os usuários podem rastrear a categoria e a prioridade dos itens de trabalho.

Neste artigo, veremos como adicionar uma nova coluna/campo a um item de trabalho. Para nosso exemplo, adicionaremos um novo campo para capturar o esforço necessário para um determinado item de trabalho. vamos adicionar este campo às telas de Item de Trabalho Novo e Editar para desktops e dispositivos móveis.

Assista a este vídeo para aprender como adicionar uma nova coluna ao aplicativo de amostra Etapas para rastrear itens de trabalho:

Pré-requisitos

Para concluir este exercício, precisamos da capacidade de entrar no Teams, que estará disponível como parte da seleção de assinaturas do Microsoft 365, e também do aplicativo Etapas instalado em um canal do Teams. Se você não o instalou, poderá instalá-lo de https://aka.ms/teamsmilestones.

Abrir Power Apps

Para abrir o Power Apps no Teams:

1. O Power Apps Studio no aplicativo Teams pode ser destacado como mostrado abaixo.

   

2. Para destacar o Power Apps Studio ao usar o aplicativo da Web da Equipe, clique com o botão direito do mouse na guia Criar na parte superior e selecione a opção Abrir em uma nova guia para abrir o editor em uma guia separada.

Personalização do aplicativo Etapas

Para adicionar a coluna ao aplicativo, adicionaremos o campo à tabela subjacente e, em seguida, a adicionaremos às telas do aplicativo.

Criação de um novo campo na Tabela Itens de Trabalho

1. No Power Apps, selecione a guia Criar.

2. Na lista Equipe, selecione a equipe na qual o aplicativo Etapas está instalado.

3. Selecionar Aplicativos instalados

4. Selecione o aplicativo Etapas do bloco Etapas.

5. O aplicativo será aberto no Power Apps

6. Selecione o botão Dados no painel esquerdo.

7. Selecione a tabela Itens de Trabalho do Projeto, então selecione as reticências e selecione Editar dados

   

8. Selecione Adicionar coluna para adicionar uma nova coluna e insira os seguintes detalhes, conforme mostrado na captura de tela abaixo:

   • Nome – Esforço

   • Tipo – Opção

   • Opções - Pequeno, Médio, Grande, Extragrande

9. Selecione Criar.

   

A nova coluna é adicionada à tabela.

Adição ao novo campo à página Adicionar/Editar Item de Trabalho

As seguintes alterações são necessárias para adicionar o campo/coluna Esforço na página Adicionar/Editar Item de Trabalho

1. Copie e cole o rótulo Categoria na tela. Faremos essa etapa para que o estilo do componente seja consistente com os outros controles do aplicativo.

   Observação

   Um novo controle também pode ser adicionado copiando e colando-o da Tela Controles Ocultos. Isso é útil porque todas as propriedades de estilo do controle já estão definidas, evitando a necessidade de atualizar todas as propriedades de estilo.

   

2. Renomeie o rótulo recém-adicionado para lblAddWorkItemEffort.

3. Defina a propriedade Text como Effort.

4. Defina a propriedade X como lblAddWorkItemAssignedTo.X.

5. Defina a propriedade Y como cmbAddWorkItemCategory.Y+cmbAddWorkItemCategory.Height+20.

6. Selecione o rótulo Descrição.

7. Atualize a propriedade X para lblAddWorkItemMilestone.X.

8. Atualize a propriedade Y para cmbAddWorkItemCategory.Y+cmbAddWorkItemCategory.Height+20.

9. Selecione a caixa de texto Descrição.

10. Atualize a propriedade X para lblAddWorkItemMilestone.X.

11. Atualize propriedade Y lblAddWorkItemDesc.Y + lblAddWorkItemDesc.Height.

12. Atualize a propriedade Width 'Parent.Width - Self.X – 30`.

13. Agora, copie e cole a caixa de combinação Categoria (cmbAddWorkItemCategory).

14. Renomeie a caixa de combinação recém-adicionada para 'cmbAddWorkItemEffort'.

15. Defina a propriedade Width 'lblAddWorkItemAssignedTo.X'.

16. Defina a propriedade X 'lblAddWorkItemAssignedTo.X.

17. Defina a propriedade Y 'lblAddWorkItemEffort.Y + lblAddWorkItemEffort.Height.

18. Definir propriedade de Items 'Choices('Effort (Project Work Items)')**

19. Defina a propriedade SelectionFill 'gblAppStyles.Dropdown.SelectionFill.

20. Defina DefaultSelectedItems 'If(locEditWorkItem, [locSelectedWorkItem.Effort]).

21. Selecione o botão Concluído e adicione o seguinte às funções Patch 'Effort: cmbAddWorkItemEffort.Selected.Value,' right after the description formula 'Description: txtAddWorkItemDesc.Text,'.

A tela aparecerá conforme mostrado abaixo com a coluna recém-adicionada

Adição do novo campo à tela Detalhes de Item de Trabalho Móvel

Agora que adicionamos o campo, vamos adicioná-lo à tela do celular.

1. Selecione a tela Detalhes do Item de Trabalho Móvel no modo de exibição de árvore.

2. Execute o aplicativo no modo de Visualização para abrir um Item de Trabalho.

3. O contêiner Detalhes do Item de Trabalho é aberto.

4. Adicionaremos um novo rótulo com o texto Esforço e uma nova caixa de combinação para capturar o valor do esforço, então faremos a formatação da tela e finalmente adicionaremos o valor do campo à função Patch na propriedade OnSelect do botão Concluído.

5. Copie e cole o rótulo Status.

6. Renomeie o rótulo recém-adicionado para 'lblMobileWorkItemDetailEffortLabel'.

7. Defina a propriedade Text como 'Effort'.

Observação

Não estamos contabilizando a localização neste documento, portanto, mantemos a propriedade de texto definida como Effort. Idealmente, se o aplicativo for localizado, teremos que atualizar o documento de localização para incluir marcas em todos os idiomas para a palavra Effort e, em seguida, localize esse campo recém-adicionado.

8. Defina a propriedade X '80*1'.

9. Defina a propriedade Y 'shpMobileWorkItemDetailSeparator_6.Y+shpMobileWorkItemDetailSeparator_6.Height+10`.

10. Copie e cole o controle shpMobileWorkItemDetailSeparator_6.

11. O controle de forma recém-adicionado é denominado como shpMobileWorkItemDetailSeparator_8.

12. Defina a propriedade X 'lblMobileWorkItemDetailNameLabel.X + 5`.

13. Defina a propriedade Y 'lblMobileWorkItemDetailEffortLabel.Y + lblMobileWorkItemDetailEffortLabel.Height + 10`.

14. Selecione shpMobileWorkItemDetailSeparator_7 e atualize a propriedade Height para `shpMobileWorkItemDetailSeparator_8.Y + shpMobileWorkItemSeparator.Height - Self.Y.

15. Selecione o rótulo Descrição.

16. Atualize a propriedade X 'imgMobileWorkItemDetailStatus.X.

17. Atualize a propriedade Y 'shpMobileWorkItemDetailSeparator_8.Y + shpMobileWorkItemDetailSeparator_8.Height + 20.

18. Selecione a caixa de texto Descrição.

19. Atualize a propriedade X 'imgMobileWorkItemDetailStatus.X.

20. Atualize a propriedade Y 'lblMobileEditWorkItemDesc.Y + lblMobileEditWorkItemDesc.Height.

21. Agora, copie e cole o rótulo Valor de status (lblMobileWorkItemDetailStatus).

22. Renomeie a caixa de combinação recém-adicionada para **cmbMobileEditWorkItemEffort.

23. Defina a propriedade Width 'Parent.Width - Self.X – 80.

24. Defina a propriedade X 'shpMobileWorkItemDetailSeparator_7.X + shpMobileWorkItemDetailSeparator_7.Width + 20.

25. Defina a propriedade Y 'shpMobileWorkItemDetailSeparator_6.Y+shpMobileWorkItemDetailSeparator_6.Height+10.

26. Defina a propriedade Text como locMobileSelectedWorkItem.Effort.

27. Selecione o botão Concluído para adicionar a etapa a seguir na função Patch Effort: cmbAddWorkItemEffort.Selected.Value.

28. A tela atualizada é mostrada abaixo.

1. Semelhante ao cenário acima, precisamos adicionar o campo Esforço à tela de detalhes do Novo Item de Trabalho.

Adicionar o novo campo à tela Detalhes do Novo Item de Trabalho

1. Selecione a tela Detalhes do Item de Trabalho Móvel no modo de exibição de árvore.

2. Execute o aplicativo no modo de visualização e selecione o sinal + para adicionar um novo item de trabalho.

3. A tela do contêiner Novo Item de Trabalho é aberta.

4. Agora, a tela do contêiner Novo Item de Trabalho está visível.

5. Copie e cole o rótulo Prioridade.

6. Renomeie o rótulo recém-adicionado para lblMobileAddWorkItemEffort.

7. Defina a propriedade Text como Effort.

Observação

Não estamos contabilizando a localização neste documento, portanto, mantemos a propriedade de texto definida como Effort. Idealmente, se o aplicativo for localizado, teremos que atualizar o documento de localização para incluir marcas em todos os idiomas para a palavra Effort e, em seguida, localize esse campo recém-adicionado.

8. Defina a propriedade X 'lblMobileAddWorkItemMilestone.X`.

9. Defina a propriedade Y 'datMobileAddWorkItemTargetDate.Y + datMobileAddWorkItemTargetDate.Height + 20`.

10. Agora, copie e cole a caixa de combinação Prioridade (cmbMobileEditWorkItemStatus).

11. Renomeie a caixa de combinação recém-adicionada para cmbMobileAddWorkItemEffort.

12. Defina a propriedade X 'lblMobileAddWorkItemMilestone.X`.

13. Defina a propriedade Y 'lblMobileAddWorkItemEffort.Y + lblMobileAddWorkItemEffort.Height`.

14. Defina a propriedade Width 'txtMobileAddWorkItemName.Width`.

15. Defina a propriedade Items 'Choices('Effort (Project Work Items)')`.

16. Defina a propriedade SelectionFill 'gblAppStyles.Dropdown.SelectionFill`.

17. Selecione o rótulo Descrição.

18. Atualize a propriedade X 'lblMobileAddWorkItemProjectName.X`.

19. Atualize a propriedade Y 'cmbMobileAddWorkItemEffort.Y + cmbMobileAddWorkItemEffort.Height + 20`.

20. Selecione a caixa de texto Descrição.

21. Atualize a propriedade X 'lblMobileAddWorkItemProjectName.X`.

22. Atualize a propriedade Y 'lblMobileAddWorkItemDesc.Y + lblMobileAddWorkItemDesc.Height`.

23. Selecione o botão Criar para adicionar a etapa a seguir na função Patch Effort: cmbMobileAddWorkItemEffort.Selected.Value.

24. A tela atualizada com o campo Esforço é mostrada abaixo.

Opcional: adicione o novo campo à lista de itens de trabalho na home page

Adicionamos o novo campo na tabela de dados e também o adicionamos para ser exibido na área de trabalho e nas telas do celular para itens de trabalho.

Os itens de trabalho também são exibidos em uma lista na tela principal do aplicativo no contexto de um projeto selecionado. Se você deseja tornar seu novo campo também visível na lista de itens de trabalho do projeto na tela principal, siga estas etapas.

Observação

A galeria de itens de trabalho foi projetada para ser responsiva. O cabeçalho da galeria usa botões fora da galeria. Ao usar botões fora de uma galeria, esteja ciente de que os botões não rolarão horizontalmente com a galeria, portanto, você deseja limitar o número de campos ao que caberá em uma tela inteira sem rolagem. Recomendamos que você substitua um dos campos existentes em vez de adicionar campos adicionais para evitar impacto na capacidade de resposta ou exigir galerias de rolagem.

1. Selecione galWorkItems no modo de exibição de árvore e expanda-o.

2. Identifique a coluna que deseja substituir pelo novo campo. Por exemplo, se você deseja substituir o destino pelo seu novo campo de rastreador, deve selecionar o controle lblWorkItemETA.

3. Atualize a fórmula da propriedade Text deste campo para a nova referência de campo.

Publicar e testar o aplicativo

1. Selecione o botão Publicar no Teams no canto superior direito do Editor.

   

2. Abra o aplicativo na Equipe e faça um teste na tela do novo item de trabalho.

3. Vá para o editor para examinar a tabela de Itens de Trabalho para certificar-se de que os registros foram criados e atualizados com o valor do campo de esforço.

4. Da mesma forma, execute um teste do aplicativo móvel do Teams para verificar as alterações feitas na tela do celular.

Consulte também

• Implantar o aplicativo de exemplo Etapas como um aplicativo de ampla distribuição
• Personalizar o aplicativo de exemplo Etapas
• Entender a arquitetura do aplicativo de exemplo Etapas
• Personalizar aplicativos de exemplo
• Perguntas frequentes sobre aplicativos de exemplo
• Usar aplicativos de exemplo da loja do Microsoft Teams

Observação

Você pode nos falar mais sobre suas preferências de idioma para documentação? Faça uma pesquisa rápida. (Observe que esta pesquisa está em inglês)

A pesquisa levará cerca de sete minutos. Nenhum dado pessoal é coletado (política de privacidade).