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”]
- Por fim cole ou digite o seguinte no comando na área de fórmulas:
- 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
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”?
CurtirCurtir
Ola Fabio, obrigado por acessar este blog!
Seria virgula mesmo, veja o material oficial:
https://docs.microsoft.com/en-us/powerapps/maker/canvas-apps/add-list-box-drop-down-list-radio-button
[]’s,
Tiago
CurtirCurtir