Aprenda a criar um app de finanças pessoais no Power Apps do zero, com um passo a passo completo!
Caso prefira esse conteúdo no formato de vídeo-aula, assista ao vídeo abaixo ou acesse o nosso canal do YouTube!
Na aula de hoje, vou te guiar na criação de um app de Finanças Pessoais no Power Apps a partir do zero, com um passo a passo completo.
Com esse aplicativo, você terá a capacidade de registrar todas as entradas e saídas de dinheiro, proporcionando um controle total sobre suas finanças.
Utilizaremos o SharePoint para criar a base de dados e, em seguida, exploraremos o Power Apps para desenvolver as telas do aplicativo. Criaremos páginas de extrato e movimentações.
Obs.: Se você ainda não sabe como acessar o Power Apps ou não tem uma conta criada, sugiro que dê uma olhada nessa postagem para realizar essa etapa inicial antes de prosseguir com esta aula.
O SharePoint é uma opção bastante prática e útil para utilizar como banco de dados para nossos aplicativos no Power Apps.
Para acessá-lo, basta clicar no menu no canto superior esquerdo dentro do Power Apps e selecionar o SharePoint entre os aplicativos da Microsoft disponíveis.
Dentro do SharePoint, criaremos um ambiente, uma espécie de site, onde registraremos todo o banco de dados deste aplicativo que estamos construindo.
Vamos clicar em Criar site, selecionar Site de equipe e nomeá-lo como Finanças.
O nome do site não precisa ser o mesmo do aplicativo, porém, isso facilita a organização.
Além disso, vamos mudar o idioma para Português (Brasil) e avançar. Antes de concluir a criação, você pode adicionar novos membros da sua empresa para gerenciar e ter acesso a esse banco de dados com você.
Depois, basta clicar em Concluir, e nosso banco de dados estará criado e pronto para uso.
Embora o SharePoint tenha sido desenvolvido principalmente para a criação de sites, o utilizaremos como um banco de dados. Para isso, vamos criar uma nova lista. Clique em Novo e selecione Lista.
Vamos criar nossa Lista em Branco e nomeá-la de lista_movimentacoes.
Observe que por padrão, o SharePoint também cria uma coluna chamada Título, mas não iremos utilizá-la.
Para armazenar as informações, precisamos criar algumas colunas dentro do nosso banco de dados. Clique em Adicionar coluna, selecione o tipo Data e Hora e clique em Avançar.
Essa será a nossa primeira coluna, chamada de Data_movimentacao.
Feito isso, vamos criar mais três colunas: uma do tipo Moeda, chamada Valor_movimentacao, outra do tipo Texto, chamada Categoria_movimentacao, e por fim, outra do tipo Texto chamada Descricao_movimentacao.
Essa é a nossa lista de movimentações. Além dela, vamos criar uma nova lista chamada lista_categorias que só terá uma informação, uma única coluna do tipo Texto chamada nome_categoria.
Diferente da lista de movimentações, em que cada pessoa vai cadastrar suas despesas e receitas, a lista de categorias terá opções fixas. Podemos adicioná-las diretamente pelo SharePoint. Basta clicar em Novo.
E na janela que será aberta, preencher o nome da categoria.
O Título pode ser deixado em branco, pois não iremos utilizar essa coluna. Ela está presente porque o SharePoint a cria por padrão.
Como Nome_categoria, iremos criar as categorias de receitas: Salário, Renda Extra e Rendimentos. E as categorias de despesas: Lazer, Moradia, Carro, Educação, Saúde e Outros.
Essas serão as categorias que exibiremos em nosso aplicativo quando o usuário for registrar suas movimentações.
Para iniciar a criação do nosso aplicativo, na página principal do Power Apps, clique em Criar e, em seguida, selecione Aplicativo em branco.
Opte pela opção de aplicativo para telefone e atribua um nome a ele, como Tarefas. Sinta-se à vontade para escolher o nome que mais lhe agrada.
Com nosso aplicativo criado, podemos definir as telas que utilizaremos nele. A primeira tela, que já estará criada, podemos renomear (clicando duas vezes sobre o nome dela) de Screen1 para tela_extrato.
Feito isso, podemos clicar em Nova tela e criar mais duas telas para o nosso aplicativo: tela_nova_movimentacao e tela_analises.
Vamos estabelecer um tema e um layout padrão para o nosso app de finanças pessoais no Power Apps. Para isso, clique em Tema e escolha o tema Vermelho para toda a aplicação.
Com o tema definido, podemos adicionar dois retângulos, que já virão na cor vermelha, na nossa tela. Vamos criar um retângulo na parte superior para inserir o título de cada tela, e um retângulo na parte inferior para adicionar algum botão posteriormente.
Para realizar isso, basta clicar em Inserir e depois selecionar Retângulo.
Dimensione os retângulos da maneira desejada para a exibição na nossa primeira tela e, em seguida, copie e cole para as outras duas.
Para adicionar os títulos em cada tela, vá em Inserir e clique em Rótulo de Texto.
Na tela de extrato, dê o título de Seu Extrato; na de movimentação, Movimentações; e na de análises, Análises. Vamos centralizar o texto, utilizar a fonte Georgia, tamanho 50 e a cor cinza escuro.
Com isso, já estabelecemos a base visual do nosso aplicativo. Sinta-se à vontade para personalizar o seu da forma que preferir.
Vamos agora criar a tela de movimentações, onde o usuário preencherá a data, o valor movimentado, a categoria e a descrição da movimentação a ser inserida.
Essa tela será responsável por preencher a lista_movimentacoes criada no SharePoint.
A maneira mais prática de criar um formulário no Power Apps que preencha uma tabela no SharePoint é através da ferramenta Formulário de Edição, que pode ser adicionada em Inserir.
Após adicionar o formulário de edição, precisaremos conectar nosso aplicativo ao banco de dados do SharePoint. Em Adicionar dados, busque por SharePoint e selecione a opção correspondente.
Em seguida, volte à página inicial do site do SharePoint, copie o endereço da página (a URL).
Cole no Power Apps e clique em Conectar.
Ao fazer isso, o Power Apps se conectará ao nosso banco de dados no SharePoint e exibirá as listas que criamos. Podemos marcar ambas e clicar novamente em Conectar.
Em seguida, podemos selecionar nosso formulário e alterar a fonte de dados para lista_movimentacoes. Assim, teremos um formulário criado automaticamente com todas as informações que o usuário precisa preencher.
Além dos campos necessários para o formulário, o Power Apps criará os campos Título e Anexos, que não utilizaremos.
Para removê-los, clique em Editar campos abaixo de Fonte de dados. Na lista de campos, clique nos três pontinhos ao lado do nome dos campos e selecione Remover.
Também podemos alterar a ordem dos campos; para isso, arraste o campo Valor_movimentacao para baixo na lista.
Selecione novamente o formulário, mude o Modo Padrão para Novo.
Vá em Editar campos. No campo Categoria_movimentacao, altere o Tipo de controle de Editar texto para Valores Permitidos.
Agora, selecione apenas a caixa referente a Categoria_movimentacao, clique em Desbloquear para alterar propriedades em Avançado.
Em Dados, altere Items para lista_categorias e Value para Nome_categoria. Isso fornecerá as opções da coluna Nome_categoria do SharePoint para o formulário.
Além de atualizar essas propriedades, modifique a propriedade Update, que será responsável por enviar informações para o SharePoint. Para essa propriedade, insira DataCardValue17.Selected.Nome_categoria.
Isso indica que o Power Apps deve pegar o valor da coluna Nome_categoria selecionado no DataCardValue17, que é o nome da caixa referente a Categoria_movimentacao.
Altere também o nome do formulário para form_movimentacoes para torná-lo mais intuitivo.
Agora, clique em Inserir e adicione um botão à tela, abaixo do formulário.
Esse botão será responsável por enviar as informações do formulário para o SharePoint. Renomeie-o para Inserir e atribua a seguinte função.
SubmitForm(form_movimentacoes);; Notify("Movimentação Cadastrada! ");; Navigate(tela_extrato)
Essa função envia o formulário via SubmitForm, exibe uma mensagem na tela com Notify e, por fim, muda para a tela de extrato com Navigate.
Para testar se essa tela já está funcionando, podemos rodar o aplicativo clicando no ícone de Play no canto superior direito.
O aplicativo exibirá a tela do formulário, e após clicar no botão Inserir, mudará para a tela de Extrato.
No SharePoint, a informação será registrada corretamente:
Agora que as movimentações estão sendo registradas e enviadas para o SharePoint, precisamos adicionar a funcionalidade de puxar essas informações do SharePoint para o aplicativo através da tela de Extrato.
Em Inserir vamos adicionar uma Galeria Vertical.
Com a galeria adicionada, selecione-a e, em Fonte de dados, defina a opção como lista_movimentacoes.
Em Layout, definiremos que essa galeria pode exibir Imagem, título, subtítulo e corpo.
E em Editar Campos, escolhemos quais valores queremos exibir na nossa galeria. Como queremos as informações das movimentações, definiremos o título como sendo a categoria, o subtítulo a data e o corpo como sendo o valor.
Para melhorar a visualização do valor dentro da nossa galeria, clique sobre a caixa referente a ele, vá em Função e insira o texto que queremos exibir antes do valor:
"R$ " & ThisItem.Valor_movimentacao
O & usamos para unir o texto R$ com o valor da movimentação.
Podemos fazer o mesmo com o título, adicionando além da categoria o campo de descrição. Selecione o título e, na função, insira a seguinte fórmula:
ThisItem.Categoria_movimentacao & " - " & ThisItem.Descricao_movimentacao
Agora podemos executar novamente nosso aplicativo de finanças pessoais para testar essa funcionalidade. Após adicionar um novo valor na tela de movimentação, seremos direcionados para a tela de Extrato, com todos os valores cadastrados.
Nosso aplicativo de finanças pessoais no Power Apps está funcionando corretamente, porém, até o momento não temos nada identificando o que são despesas e o que são receitas dentro dele.
Para resolver isso, vamos começar a inserir as despesas com o sinal de menos (–) antes do valor e atribuir uma imagem para distinguir as despesas das receitas.
Dessa forma, quando o valor for negativo, teremos a imagem de uma seta vermelha para baixo, e quando o valor for positivo, ele será identificado com uma seta verde para cima.
Para utilizar imagens dentro do seu aplicativo no Power Apps, você precisa primeiro carregá-las para dentro da plataforma. Faremos isso clicando em Mídia e subindo as imagens desejadas.
Com as imagens carregadas, podemos definir a fórmula que irá determinar se será exibida a seta vermelha ou verde ao lado da movimentação na tela de extrato.
Então, na tela de Extrato, marque uma das caixas referentes às imagens e defina a seguinte fórmula:
IF(ThisItem.Valor_movimentacao<0; 'seta vermelha '; 'seta verde ')
Essa é uma função IF, ela verifica a condição solicitada, nesse caso, se o Valor da movimentação é menor do que zero. Se for verdadeiro, atribui o primeiro resultado; caso contrário, atribui o segundo resultado.
Nesse caso, verificamos se o valor é menor do que zero. Se verdadeiro, exibiremos a seta vermelha; se falso, exibiremos a seta verde.
Para finalizar nosso app de Finanças Pessoais no Power Apps, só precisamos adicionar os botões responsáveis por navegarmos entre as telas do aplicativo.
Podemos inserir um ícone de Adicionar (+) na tela de Extrato para sermos levados para a tela de movimentações.
Com o ícone posicionado e formatado na nossa tela, vamos adicionar a função responsável por nos levar para a tela de Movimentações:
Navigate(tela_nova_movimentacao);; NewForm(form_movimentacoes)
Com essa fórmula, além de navegarmos para a tela de movimentação, estamos definindo para ela ser carregada com um novo formulário de movimentações para ser preenchido.
Para finalizar, precisamos adicionar um ícone na tela de Movimentações que nos permita voltar para a tela de Extrato. Vamos inserir um ícone de seta e definir a seguinte fórmula:
Navigate(tela_extrato)
Assim, nosso aplicativo de finanças pessoais estará com as duas telas prontas, totalmente funcionais e permitindo navegarmos de uma tela para a outra facilmente.
Na aula de hoje, você aprendeu como criar um App de Finanças Pessoais no Power Apps do zero, seguindo um passo a passo completo!
Com esse aplicativo de finanças pessoais, você será capaz de registrar todas as entradas e saídas de dinheiro, proporcionando um controle completo de suas finanças.
Além disso, é possível personalizá-lo, alterando tanto o layout quanto adicionando mais informações e funcionalidades, tornando sua aplicação ainda mais completa e adequada às suas necessidades.
Para acessar outras publicações de Power Apps, clique aqui!
Expert em conteúdos da Hashtag Treinamentos. Auxilia na criação de conteúdos de variados temas voltados para aqueles que acompanham nossos canais.
Quer sair do zero no Python e virar uma referência na sua empresa? Inscreva-se agora mesmo no Python Impressionador