PowerApps – Como criar sua primeira App (Canvas)


Olá pessoal,

Neste post vou demonstrar como é simples criar apps utilizando PowerApps, mais especificamente, irei mostrar como criar uma app do tipo Canvas!

Para mais informações sobre Canvas apps, veja este outro post.

Para testar a app que vou em breve construir, será necessário que você no mínimo precisa uma licença do Plano 1. Caso não possua, crie um trial em https://trials.dynamics.com/

Como eu disse no post anterior, a grande vantagem de uma app em Canvas é a facilidade de utilizar diferentes fontes de dados, para este exemplo, vou ser o mais simples possível, irei usar como “base de dados” o Excel! Sim, isso mesmo!

Ai vai o passo a passo!

Em seu OneDrive ou OneDrive for Business, criei uma nova planilha Excel:

 

Adicionei os campos (colunas) que sua app terá e clique em formatar como uma tabela (Format as Table):

 

Agora formate o tipo de dado de cada coluna, por exemplo data de nascimento (birthday) é do tipo data curta (short date):

 

Planilha pronta, vamos criar nossa app! Em seu navegador, vá em https://make.powerapps.com/ e clique em iniciar a criação de uma app em Canvas através de dados (Start from data):

 

Agora precisamos configurar o nosso conector com o OneDrive/OneDrive for Business, clique na seta:

 

Clique em adicionar nova conexão (new connection), selecione OneDrive/OneDrive for Business, depois clique em criar (create) e fazer o sign in:

 

Agora, selecione a planilha que acabou de criar, depois selecione a primeira “aba” e clique em conectar (connect):

 

Aguarde alguns segundos enquanto a app é criada…

 

Vejam que automaticamente foram criados três telas:

  • Navegação (BrowserScreen) – uma lista contendo os registros já criados
  • Detalhes (DetailScreen) – tela de detalhes de cada registro (somente leitura)
  • Edição (EditScreen) – tela de criação e edição de registros

 

Como eu havia dito, o PowerApps automaticamente adiciona todos os campos da planilha Excel em nossa app, para pre-visualizar, pressione F5 e depois clique no “+” no canto superior:

 

Vou fazer algumas mudanças visuais para melhor apresentar o formulário. Sai da pré-visualização, reposicione (via drag and drop) os campos nos dois formulários (edit e details).

Agora vamos modificar o tipo de alguns componentes do formulário de edição, vamos modificar a altura (height), sexo (sex) e data de nascimento (birthday). Para isso, clique no formulário de edição (no menu lateral esquerdo) e depois em editar atributos (edit fields):

Veja as ações para cada atributo:

  • Sexo (sex)
    • Selecione o atributo e troca o tipo de controle (control type) para valores permitidos (allowed values).
    • Depois precisamos criar as possíveis opções, clique no campo sexo, selecione a aba avançado (advanced), desbloquei o campo, ao lado na área em que podemos incluir fórmulas existe um combo, troque para valores permitidos (allowed values):

    • Por fim cole ou digite o seguinte no comando na área de fórmulas:
      • [” “,”Male”,”Female”]

 

  • Altura (height) troque para slider, depois aumente o valor máximo para “250” (não esqueça de debloquear o campo):

 

  • Data de nascimento (birthday), oculte os campos de hora e minuto (não esqueça de debloquear o campo):

Pronto! Sua aplicação está pronto, você testá-la pressionando F5 ou ainda publicá-la, clicando em arquivo (file) > salvar como (save as):

Para acessá-la em seu dispositivo móvel, você precisa baixar a app do PowerApps primeiro:

 

Por fim, é so abrir e acessar sua primeira app em Canvas!:

 

 

 

Bom é isso, este post termina aqui! No próximo post irei mostrar como adicionar uma app feita pelo PowerApps no área de serviços (desktop) de seu device! Não percam!

[]’s,

Tiago

2 comentários em “PowerApps – Como criar sua primeira App (Canvas)

  1. Ola Tiago, estava estudando um pouco aqui com este post incrível, mas me deparei com uma pequena dificuldade. Neste ponto, onde sugeres a mudança do campo e inclusão destes caracteres [” “,”Male”,”Female”], não seria “ponto e vírgula” no lugar da “vírgula”?

    Curtir

Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair /  Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair /  Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair /  Alterar )

Conectando a %s

Este site utiliza o Akismet para reduzir spam. Saiba como seus dados em comentários são processados.