Exercício: criar seu primeiro aplicativo do Power Apps como desenvolvedor tradicional

Concluído

Nesta unidade, você cria um aplicativo móvel para ajudar os usuários em campo a verificar o estoque e as peças da ordem, se necessário. Usamos o Excel como fonte de dados e o apresentamos como "dados de desenvolvimento" na criação do aplicativo, para que não haja a necessidade de conexão a sistemas existentes, como o Microsoft SQL Server ou, até mesmo, o Salesforce.

Há centenas de conectores de dados aos quais o Power Apps pode se conectar imediatamente, de muitos produtos e serviços da Microsoft e serviços de terceiros também. Se não houver um conector do qual você precisa, um desenvolvedor poderá criar um conector personalizado para fazer essa conexão.

Observação

O Power Apps requer uma licença do Microsoft 365 ou uma avaliação gratuita. Saiba mais sobre as opções de licenciamento. Os produtos da Microsoft incluem o Microsoft Power Apps e o Power Automate.

Conectar-se a uma fonte de dados

Para conectar-se a uma fonte de dados, siga este procedimento:

  1. Baixe a pasta de trabalho de estoque de pisos e salve-a no OneDrive.

  2. Acesse https://make.powerapps.com e entre com sua conta organizacional.

  3. Na tela inicial, selecione o botão + Criar no painel de navegação esquerdo.

  4. Selecione Excel nas opções "Começar com".

  5. Você pode ser solicitado a selecionar uma conexão existente ou criar uma nova conexão. Selecione/crie uma conexão ao OneDrive.

  6. No lado direito da tela, você será solicitado a Escolher um arquivo do Excel. Encontre/selecione FlooringInventory.xlsx.

  7. Em Escolher uma tabela, selecione FlooringEstimates e selecione o botão Conectar no canto inferior direito da tela.

O Power Apps gera o aplicativo inspecionando os dados e combinando-os com os recursos do Power Apps para que você obtenha um aplicativo funcional de três telas como ponto de partida.

Visualize o aplicativo gerado

O novo aplicativo de três telas é aberto no Power Apps Studio.

Captura de tela da janela principal de desenvolvimento do Power Apps para o Power Apps Studio.

Para visualizar o aplicativo, selecione a tecla F5 ou selecione o ícone Reproduzir no canto superior direito da barra de comandos. Ele inclui todos os dados da tabela e proporciona uma ótima experiência padrão. Você pode usar o campo de pesquisa na parte superior, selecionar um item para ver detalhes etc.

Todos os aplicativos gerados com base em dados dessa forma têm o mesmo conjunto de telas que você pode exibir no painel de Exibição em árvore:

  • Tela Navegar: essa tela é exibida por padrão. Nela, é possível procurar, classificar, filtrar e atualizar os dados na fonte de dados. Na tela Navegar, você pode adicionar itens à fonte de dados; para isso, basta selecionar o ícone de adição (+).
  • Tela Detalhes: a tela Detalhes mostra todas as informações sobre um único item. Nessa tela, é possível abrir um item para editá-lo ou excluí-lo.
  • Tela Editar/Criar: nessa tela, você edita um item existente ou cria um.

Explorar o aplicativo gerado

Selecione o ícone (X) no canto superior direito da exibição para retornar o aplicativo ao modo de edição. Observe que o aplicativo, mesmo estando no modo de edição, está funcionando ativamente, como se estivesse no modo de inspeção de um aplicativo tradicional. Quando você fizer alterações nas propriedades de controle e fórmulas do Power fx, o aplicativo responderá automaticamente a essas alterações, mesmo no modo de edição.

Dica

Para alternar temporariamente para o modo de visualização enquanto estiver no modo de edição, mantenha a tecla Alt pressionada no teclado. Observe que, quando você mantiver a tecla pressionada, se selecionar o aplicativo, ela atuará como no modo de visualização. Quando você liberar a tecla, a mola será automaticamente revertida para o modo de edição e você poderá selecionar o aplicativo para selecionar os controles normalmente.

Adicionar a tela de solicitação de estoque

O aplicativo gerado inclui uma tela para a adição de linhas de dados por meio da realocação da tela de edição de dados; mas, em vez disso, ele usará o ícone (+) incluído nele para proporcionar ao usuário uma maneira de solicitar que mais estoque seja adicionado ao depósito diretamente do escritório residencial.

  1. Selecione a tela EditScreen1 no painel de Exibição em Árvore no lado esquerdo da tela.

  2. Selecione ... à direita de onde EditScreen1 está realçado e selecione Duplicar tela.

  3. Clique com o botão direito do mouse em EditScreen1_1 no modo de exibição de árvore e selecione Renomear. Digite InventoryRequest como novo nome da tela e selecione Enter para salvá-lo.

  4. Selecione BrowseScreen1 na exibição em árvore para voltar à primeira tela e selecione o ícone (+) no canto superior direito da tela do aplicativo para editá-lo.

  5. Vamos ajustar a propriedade OnSelect. Por padrão, ela deve ser mostrada na barra de fórmulas, mas se não for, você poderá encontrar/selecionar essa propriedade na lista suspensa à esquerda da barra de fórmulas e substituir o conteúdo da barra de fórmulas pelo seguinte:

        Navigate(InventoryRequest, ScreenTransition.None)
    
  6. Mantenha a tecla ALT pressionada e selecione o ícone (+) para testar a função Navigate que você acabou de escrever; o aplicativo deve carregar a tela InventoryRequest recém-criada.

  7. Selecione EditForm1_1 no modo de exibição de árvore e pressione a tecla Delete para excluir o controle.

Adicionar controles à nova tela

  1. Selecione o botão Inserir na barra de comandos para abrir o painel Inserir.

  2. Selecione Text Label e Text Input para adicionar um controle de cada tipo à tela.

  3. Arraste os dois controles na tela para que fiquem abaixo do cabeçalho e alinhados ao centro da tela. Observe como o Power Apps ajudará você a alinhar tudo ao arrastar os controles.

  4. Selecione o rótulo na tela do aplicativo para selecioná-lo e, no painel Propriedades do lado direito, altere o valor da propriedade Text para informar o Motivo da Solicitação.

  5. Selecione a caixa de texto na tela do aplicativo para selecioná-lo e, no painel Propriedades do lado direito, altere o valor da propriedade Padrão para informar o Estoque necessário para atender às necessidades do cliente.

  6. Use Inserir para adicionar outro Rótulo de texto à tela.

  7. Selecione Inserir novamente e use a caixa de pesquisa para procurar um controle suspenso. Digite "suspenso" e selecione Suspenso para adicionar um controle suspenso à tela.

  8. Selecione e arraste os dois controles para alinhá-los aos outros controles e um ao outro e altere o texto do novo rótulo para informar o item de estoque.

  9. Selecione o controle suspenso para selecioná-lo e, no painel de propriedades do lado direito, selecione o menu suspenso da propriedade Items e selecione FlooringEstimates. Em seguida, selecione o menu suspenso da propriedade Valor e selecione Nome.

  10. Selecione o rótulo da propriedade Items e observe que o foco do cursor está agora na barra de fórmulas, com a propriedade Items selecionada.

  11. Classifique os itens por nome digitando a seguinte fórmula:

        Sort(FlooringEstimates, Name, SortOrder.Ascending)
    

    Janela de edição do Power Apps Studio mostrando erros no aplicativo após a última etapa

Corrigir os erros e adicionar uma conexão de dados

  1. Selecione o ícone no canto superior direito da tela do aplicativo. A propriedade OnSelect do ícone é mostrada na barra de fórmulas. Altere a fórmula para apenas dizer Back(). Isso fará com que o erro desapareça.

  2. Selecione o ícone de dados à esquerda da tela para ativar o painel Dados. A conexão OneDrive que começamos com o aplicativo está listada ali.

  3. Selecione ➕ Adicionar dados para abrir o painel de pesquisa de conexão e procurar o Office 365 Outlook.

  4. Caso você já tenha uma conexão definida, selecione-a para adicioná-la. Se nenhuma conexão estiver listada, selecione Adicionar uma conexão e, quando o painel da nova conexão for aberto no lado direito, selecione Conectar para adicionar a conexão.

  5. Selecione o ícone ✔ no cabeçalho do aplicativo. A propriedade OnSelect do ícone foi selecionada para a barra de fórmulas.

  6. Altere a fórmula OnSelect do ícone para a fórmula abaixo. Essa fórmula envia um email para você mesmo (ou para o usuário do aplicativo), solicitando a ordem de mais estoque.

Office365Outlook.SendEmailV2(
    User().Email,
    "New Request: " & TextInput1.Text,
    User().FullName & " has requested more inventory for " &
        Dropdown1.Selected.Name & " be ordered. There is currently " &
        Dropdown1.Selected.InventoryInSquareFeet & " square feet left in stock."
);
Back()

Observação

Para adicionar mais de uma instrução a um evento, use um ponto-e-vírgula (;) para separá-las.

Um exemplo do email enviado quando uma solicitação é salva no aplicativo

Salve e publique o aplicativo

Para tornar o aplicativo visível no telefone, salve e publique-o. Na faixa de opções, no canto superior direito, selecione a seta suspensa ao lado do ícone Salvar e selecione Salvar como. Substitua o título atual "Aplicativo" por Estoque de pisos e, em seguida, selecione Salvar. Agora selecione o ícone Publicar na faixa de opções e, após alguns minutos, você poderá acessar e usar o aplicativo em seu telefone.

Ao salvar um novo aplicativo pela primeira vez, você será solicitado a publicá-lo, tornando essa versão "ativa". Depois que você salvá-lo pela primeira vez, nas próximas vezes, as versões não ficarão ativas automaticamente; elas somente serão salvas como novas versões. Posteriormente, você precisará selecionar o botão Publicar que aparece na tela de salvamento após clicar em Salvar.

Instalar o aplicativo em seu dispositivo

Para ver como o aplicativo é executado em dispositivos móveis, instale o aplicativo Power Apps Mobile em seu telefone. Ao criar um aplicativo, você deverá testá-lo no mesmo fator forma de seus usuários.

  1. Baixe o Power Apps Mobile na loja de aplicativos da plataforma de sua preferência.

  2. Entre usando seu nome de usuário e senha do Office 365.

  3. Em seu telefone ou tablet, execute o aplicativo Estoque de pisos no Power Apps Mobile. Se você não quiser instalar o aplicativo, poderá executá-lo em um navegador.

  4. Se você não vir o aplicativo Estoque de pisos, em seu aplicativo Power Apps Mobile, selecione o menu de hambúrguer na parte superior esquerda da tela e alterne para Mostrar aplicativos de não produção.

Você viu agora como é simples criar e modificar um aplicativo de uma tabela do Excel. Não foi necessária codificação complexa, e você pôde fazer algumas alterações low-code rápidas para atender melhor às suas necessidades.