Partilhar via

Personalizar modelos de aplicações de exemplo

Neste artigo, vai aprender sobre a personalização de modelos de aplicações de amostra. Por exemplo, pode ser necessário alterar o logótipo da empresa, atualizar os dados dentro dos modelos de aplicações de amostra para se adaptarem aos requisitos do seu negócio, adicionar ou remover controlos nos ecrãs para ampliar a aplicação.

Pré-requisitos

Instalar um modelo de aplicação de amostra. Mais detalhes: Usar modelos de aplicações de amostra no Microsoft Teams.

Nota

  • Algumas secções deste artigo usam um dos modelos de aplicações de amostra disponíveis como exemplo. As tabelas, controlos, ecrãs e outros componentes das aplicações podem variar dependendo da aplicação instalada. Use discrição ao personalizar a aplicação que seleciona.
  • Leia Atualizações do modelo de aplicações de amostra antes de personalizar modelos de aplicações de amostra para compreender o impacto das novas versões nas versões do modelo de aplicações de amostra.

Abra o modelo de aplicações de amostra no Power Apps Studio

Para começar a personalizar os modelos de aplicações de amostra, o primeiro passo é abrir a aplicação no Power Apps Studio.

  1. Inicie sessão no Teams.

  2. Selecione Mais aplicações adicionadas. (Mais aplicações adicionadas).

  3. Selecione Power Apps.

    Selecionar a aplicação Power Apps.

  4. Selecione o separador Compilação.

  5. Selecione o ambiente de equipa onde instalou o modelo de aplicações de amostra.

  6. Selecione as Aplicações instaladas.

  7. Selecione o modelo de aplicações de amostra que instalou.

  8. Se solicitado, selecione a localização.

Mais informações: Editar uma aplicação no Power Apps Studio

Remover dados de exemplo

Quando instala modelos de aplicações de amostra, as tabelas podem ser pré-preenchidas com dados de amostra. A tabela que se segue lista os modelos de aplicações de amostra e a lista de tabelas com os dados da amostra a remover:

Para remover dados dos modelos de aplicações de amostra:

  1. Abra o modelo de aplicações de amostra (por exemplo, Gerir inspeções) no Power Apps Studio.

  2. Selecione Dados no painel esquerdo.

  3. Selecione Dados — reticências. junto ao nome da tabela (por exemplo, Tarefa de Inspeção da Área para a aplicação Gerir inspeções).

  4. Selecione Editar dados.

  5. Elimine todas as linhas que contenham dados de exemplo.

    Elimine linhas.

  6. Feche o editor visual.

  7. Repita os passos anteriores para as tabelas restantes.

Adicione o seu logotipo ao ecrã a carregar

  1. Abra o modelo de aplicações de amostra (por exemplo, Inspeção) no Power Apps Studio.

  2. Selecione Vista de árvore no painel esquerdo.

  3. Se ainda não estiver selecionado, selecione Ecrã a carregar.

  4. Selecione Inserir.

  5. Selecione controlo de imagem em suporte de dados.

    Adicionar imagem.

  6. A partir do painel de propriedades no lado direito, selecione o menu suspenso Imagem e, em seguida, selecione + Adicione um ficheiro de imagem.

    Adicione um ficheiro de imagem.

  7. Selecione a imagem para o logótipo da empresa e, em seguida, selecione Abrir.

  8. Posição e controlo de imagem de tamanho para a posição desejada no ecrã a carregar.

    Logotipo da empresa.

Alterar o texto do ecrã de boas-vindas

Nota

O texto de saudação do ecrã de boas-vindas da aplicação Inspeção usa uma fórmula que contém variáveis globais para exibir corretamente a terminologia desejada para inspeções e itens que estão a ser inspecionados. Tenha cuidado ao mudar esta fórmula.

  1. Abra o modelo de aplicações de amostra (por exemplo, Inspeção) no Power Apps Studio.

  2. Selecione o controlo da etiqueta de texto com o texto de saudação É um prazer tê-lo aqui.

    A fórmula para o texto de saudação está neste formato:

    "Glad to have you here, we are ready for you to " & If(Lower(gblWorkType)="inspection", "inspect", Lower(gblWorkType)) & Switch(
Left(
    Lower(areaLabel),
    1
),
"a",
" an ",
"e",
" an ",
"i",
" an ",
"o",
" an ",
"u",
" an ",
" a "
) & Lower(areaLabel)

  3. Selecione a barra de fórmula.

  4. Selecione a frase É um prazer tê-lo aqui.

  5. Atualize o texto de saudação, como É um prazer tê-lo aqui.

    "We are happy that you are here, we are ready for you to " & If(Lower(gblWorkType)="inspection", "inspect", Lower(gblWorkType)) & Switch(
Left(
    Lower(areaLabel),
    1
),
"a",
" an ",
"e",
" an ",
"i",
" an ",
"o",
" an ",
"u",
" an ",
" a "
) & Lower(areaLabel)

    Atualize o texto de saudação na fórmula.

Altere a cor de fundo do ecrã

Nota

A aplicação Inspeção aproveita variáveis temáticas globais para garantir uma experiência consistente do utilizador. Se modificar um preenchimento de ecrã, o ecrã modificado deixará de utilizar o tema padrão da aplicação.

  1. Abra o modelo de aplicações de amostra (por exemplo, Inspeção) no Power Apps Studio.

  2. Selecione Vista de árvore no painel esquerdo.

  3. Selecione o Ecrã de boas-vindas a partir da vista de árvore.

  4. Selecione Preenchimento a partir da lista de propriedades na parte superior esquerda.

  5. Na barra de fórmula, substitua a fórmula pela cor que pretende.

    A cor de preenchimento de fundo do ecrã será definida para a cor de fundo selecionada.

    Altere a cor de fundo.

Dados de edição em massa

Se quiser editar rapidamente os dados na aplicação, pode abrir a tabela e modificar ou eliminar dados.

Atenção

Os modelos aplicações de amostram utilizam várias tabelas relacionadas, como as Localizações de Inspeção da Área e Tipos de Localização de Inspeção da Área para a aplicação Inspeção. Tenha cuidado ao eliminar registos das tabelas sem verificar a relação de dados e as dependências.

  1. Abra o modelo de aplicações de amostra (por exemplo, Inspeção) no Power Apps Studio.

  2. Selecione Dados no painel esquerdo.

  3. Selecione Dados — reticências. junto ao nome da tabela (por exemplo, Tipos de Localização de Inspeção da Área para a aplicação Inspeção).

  4. Selecione a célula dentro do Editor Visual, por exemplo Comida na coluna Nome.

  5. Substitua o texto pelo valor que pretende.

  6. Feche o editor visual.

    Os dados na aplicação devem refletir o valor atualizado, como o nome de localização neste exemplo.

    Dados de edição em massa.

Adicionar uma coluna à aplicação

Importante

As etapas de personalização da aplicação Inspeção nesta secção abrangem algumas das opções avançadas de configuração. Este exemplo requer que tenha familiaridade com o Power Apps Studio, esteja confortável com a modificação de fórmulas, e trabalhe com controlos como recipientes.

Considere um cenário em que tenha várias lojas e queira associar localizações e inspeções a lojas específicas.

Adicione a coluna de texto do nome da loja à tabela Localização

  1. Abra a aplicação Gerir inspeções no Power Apps Studio.

  2. Selecione Dados no painel esquerdo.

  3. Selecione Dados — reticências. junto ao nome da tabela (por exemplo, Localizações de Inspeção da Área para a aplicação Gerir inspeções).

  4. Selecione Adicionar coluna.

  5. Insira o nome como "Nome da Loja".

  6. Selecione Criar.

  7. Feche o editor visual.

    Adicione coluna Nome da Loja.

Adicione a coluna do nome da loja ao formulário Localização

  1. Selecione o Ecrã localizações.

    Sugestão

    Pode ignorar o erro sobre a utilização dos conectores de pré-visualização nesta aplicação.

  2. Na vista de árvore, procurar btnArea_GroupedAreas.

  3. Nas Áreas Agrupadas no formulário, arraste a margem esquerda para ficar paralela ao contorno do campo Título.

    Nota

    O controlo de campo das áreas agrupadas está num recipiente. Assim, a área selecionada pode aparecer numa parte diferente do ecrã onde vê a coluna. Arrastar a área selecionada redimensiona a coluna.

  4. Selecione Inserir a partir do painel esquerdo.

  5. Selecione o controlo da Etiqueta.

  6. Posicione a Etiqueta para que fique alinhada horizontalmente com as áreas agrupadas e verticalmente com o Tipo de área.

    Posição de controlo da etiqueta.

  7. Selecione Texto a partir da lista de propriedades na parte superior esquerda.

  8. Selecione a barra de fórmula.

  9. Altere a fórmula para Nome da Loja.

  10. Selecione Inserir a partir do painel esquerdo.

  11. Selecione controlo da caixa de texto.

  12. Arraste o controlo da caixa de texto para estar alinhado horizontalmente com a área agrupada e verticalmente com o tipo de área.

  13. Selecione Valor a partir da lista de propriedades na parte superior esquerda.

  14. Na barra de fórmula, substitua o valor atual por gblLocation.'Store Name'

  15. Selecione ColorBackground a partir da lista de propriedades na parte superior esquerda.

  16. Na barra de fórmula, introduza "Branco".

    Propriedade ColorBackground.

  17. Selecione Modo de visualização a partir da lista de propriedades na parte superior esquerda.

  18. Na barra de fórmula, insira "Editar" se ainda não estiver presente.

  19. Mantenha premida a tecla ALT no teclado e selecione Editar.

    Editar com a tecla alt pressionada.

  20. Selecione Vista de árvore no painel esquerdo.

  21. Procure por btnAreaDetails_Save e selecione o controlo devolvido.

  22. Expandir a barra de fórmulas.

  23. No final da 17ª linha, adicione uma vírgula e esta fórmula:

    'Store Name':Microsoft_CoreControls_TextBox1.Value

    Esta parte da fórmula deverá agora ficar semelhante à imagem seguinte:

    {
	msft_name: txtArea_EditTitle.Text,
	'Location Type': cmbAreaDetails_AreaType.Selected,
	'Primary Image': picArea_UploadedImage.Image, 'Store Name':Microsoft_CoreControls_TextBox1.Value
}

    Nota

    Se a fórmula atualizada apresentar erro, verifique o nome da caixa de texto para o nome da loja. Por exemplo, pode ser Microsoft_CoreControls_TextBox2 em vez de Microsoft_CoreControls_TextBox1, dependendo das suas alterações.

  24. Selecione o controlo da etiqueta adicionado no passo 5.

  25. Selecione a propriedade Y a partir da lista de propriedades na parte superior esquerda.

  26. Selecione a barra de fórmula.

  27. Alterar a fórmula para:

    If(gblEditLocation,250,200)

  28. Selecione a caixa de texto adicionada no passo 11.

  29. Selecione a propriedade Y a partir da lista de propriedades na parte superior esquerda.

  30. Selecione a barra de fórmula.

  31. Alterar a fórmula para:

    If(gblEditLocation,282,232)

  32. Mantenha premida a tecla CTRL no teclado e selecione tanto a etiqueta do nome da loja como a caixa de texto.

  33. Selecione a propriedade Vísivel a partir da lista de propriedades na parte superior esquerda.

  34. Selecione a barra de fórmula.

  35. Alterar a fórmula para:

    If(gblViewInspection, false, true)

    A posição altera-se com a propriedade Y.

Publicar atualizações de aplicações no Teams

Para guardar e publicar as alterações na aplicação de exemplo:

  1. Selecione Guardar na parte superior direita.

  2. Selecione Publicar no Teams

  3. Selecione Seguinte.

  4. Para publicar a versão atualizada de uma aplicação para um separador ativo existente, selecione Guardar + Fechar.
    Para adicionar a versão publicada de uma aplicação a um novo separador num canal diferente, selecione Adicione um separador. (Adicionar um separador) para o canal que deseja e, em seguida, selecione Guardar + fechar.

Mais informações: Publicar e adicionar uma aplicação ao Teams