O que você pode fazer com Barra Superior do Power Apps
Agora que você já sabe quais são as peças principais do ambiente de desenvolvimento, vamos começar a explorar cada área da interface com mais atenção. E faremos isso iniciando pela Barra Superior, uma região que concentra comandos importantes para criação, edição, salvamento e gerenciamento dos seus aplicativos.
Este post dá continuidade ao que você aprendeu no capítulo anterior. Nele, você conheceu os cinco elementos fundamentais que formam qualquer aplicativo de tela no Power Apps: Telas, Componentes, Propriedades, Fórmulas e Dados. Além disso, aprendeu a localizar e reconhecer cada um deles dentro da interface do Power Apps Studio.
Se esses conceitos ainda não estão totalmente claros, recomendo que volte ao post "O Power Apps e Seus Componentes" antes de continuar. O conteúdo deste capítulo parte do princípio de que você já consegue identificar esses elementos quando abre o Studio.
Abra o Power Apps Studio e acompanhe a explicação observando cada item diretamente na tela. Essa prática simples acelera o aprendizado e ajuda a transformar conhecimento em familiaridade.
📌 Guia de Navegação
1. Objetivo: O Ponto de Partida de Tudo que Você Faz no Studio
O que você vai aprender neste post
A Barra Superior do Power Apps Studio é a primeira coisa que
você vê ao abrir o ambiente de desenvolvimento — e a que você mais vai usar ao
longo de todo o curso. Ela concentra os controles que afetam o aplicativo como
um todo: onde fica o nome do sistema que você está editando, onde estão as
ferramentas de inserção e configuração, onde você salva, publica e testa. Neste
post você vai aprender a ler essa barra de ponta a ponta: o que cada região
faz, o que cada botão significa e quando usar cada um.
Você também vai entender um comportamento que surpreende
quase todo iniciante: a quantidade de opções visíveis na Barra Superior muda
conforme a largura da sua tela. O que parece ter sumido não sumiu — está
guardado em um menu de contexto acessível pelos três pontinhos. Quem não sabe
disso procura um botão que está bem à frente, só escondido.
Por que este post vem logo após o primeiro — e por que a ordem importa
No Post 1 você
aprendeu o vocabulário da plataforma. Agora você precisa aprender o ambiente
onde vai trabalhar. É como aprender o nome de cada ferramenta de uma oficina e,
em seguida, aprender onde cada uma fica pendurada na parede. Você não usa uma
ferramenta que não sabe onde está. Por isso, antes de inserir qualquer
componente, antes de escrever qualquer fórmula, você precisa dominar a barra
que controla tudo.2. Conceito: A Barra Superior: Três Linhas que governam o Studio
Quando você abre um aplicativo no Power Apps Studio para
edição, a Barra Superior ocupa as duas primeiras linhas da tela — sempre,
independentemente da tela do aplicativo que você estiver editando. Ela não
desaparece, não se move e não muda de lugar. É a região mais estável de toda a
interface.
Essas duas linhas têm papéis completamente distintos. A
primeira linha concentra a identidade do ambiente, as ferramentas de ação e os
controles de publicação. A segunda linha é exclusivamente a barra de fórmulas —
o canal direto entre você e as propriedades de qualquer componente selecionado.
Vamos percorrer cada uma delas de forma detalhada.
A Primeira Linha: Identidade, Ferramentas e Controles
A primeira linha da Barra Superior é a mais movimentada. Ela
está dividida em três regiões com funções distintas: o lado esquerdo com
identidade e navegação, o centro com as ferramentas de desenvolvimento e o lado
direito com os controles de publicação e configuração.
O lado esquerdo: onde você está e de onde veio
No canto esquerdo da primeira linha estão as informações que
respondem a duas perguntas simples: em qual plataforma você está e em qual
aplicativo você está trabalhando.
O ícone de nove pontos — chamado de waffle — é o
acesso rápido a todos os serviços do Microsoft 365. Clicando nele, você pode
navegar para o SharePoint, o Teams, o Outlook e qualquer outro serviço da sua
organização sem precisar abrir uma nova aba. Ao lado do waffle, o texto Power
Apps identifica a plataforma, e em seguida aparece o nome do aplicativo que
está aberto em edição — no caso do sistema da Escola,, Controle Mov_Extras
(Edição). A palavra "Edição" entre parênteses confirma que você
está no modo de desenvolvimento, não visualizando o app como usuário final.
Logo depois do nome do aplicativo, ainda no lado esquerdo,
estão os primeiros controles de ação: a seta ← Anterior para desfazer
navegações, e dois botões de histórico — desfazer a última ação e acessar
versões anteriores do aplicativo. Esses controles existem para proteger o seu
trabalho: antes de qualquer alteração arriscada, vale saber que você pode
voltar atrás.
O centro: as ferramentas de desenvolvimento
O centro da primeira linha concentra as ferramentas que você
vai usar durante a construção do aplicativo. São os botões que controlam o que
você insere, como você configura a aparência geral e como você organiza as
telas.
O botão + Inserir é o ponto de entrada para adicionar
qualquer componente à tela — botões, galerias, formulários, campos de texto,
rótulos, imagens e muito mais. Ao clicar nele, um painel se abre com os
componentes organizados por categoria. Cada categoria será apresentada ao longo
do curso, sempre no momento em que o componente correspondente for utilizado na
construção do sistema.
O botão Adicionar dados é o caminho para conectar o
aplicativo a fontes de dados externas — como as listas do SharePoint que
alimentam o sistema da Escola,. É por aqui que você declara de onde os dados
vêm antes de usá-los em qualquer fórmula ou galeria.
Os botões seguintes — Novo ecrã, Tema, Cor
de fundo — controlam aspectos visuais e estruturais do aplicativo como um
todo. Novo ecrã adiciona uma nova tela ao aplicativo. O termo
"ecrã" é uma das variações de tradução que o Power Apps apresenta: no
contexto do nosso sistema e deste curso, "ecrã" e "tela"
significam exatamente a mesma coisa. Sempre que você encontrar "ecrã"
na interface, leia como "tela" — o conceito é idêntico. Tema e
Cor de fundo controlam a paleta visual global — cores que se aplicam ao
app inteiro, não a um componente específico.
Os três pontinhos: o menu que guarda o que não cabe na tela
Este é um dos comportamentos mais importantes de entender
sobre a Barra Superior: a quantidade de opções visíveis no centro da barra
depende da largura da sua tela. Se você estiver com o monitor em resolução
menor, com a janela do navegador reduzida, ou com painéis laterais abertos que
ocupam espaço, alguns botões do centro somem da vista. Eles não foram removidos
— foram compactados no menu acessível pelos três pontinhos (...) que
aparecem no final da faixa de botões centrais.
Ao clicar nos três pontinhos, um menu suspenso aparece com
as opções que não couberam na tela visível. No sistema da Escola,, esse menu
costuma conter Imagem de fundo, Definições e Histórico de
versões da aplicação. Definições é particularmente importante: é ali
que você ajusta configurações globais do aplicativo, como o nome oficial, as
dimensões da tela e comportamentos de desempenho. Histórico de versões
permite recuperar uma versão anterior publicada — uma rede de segurança que
todo desenvolvedor precisa saber que existe.
Sempre que você procurar um botão que deveria estar no
centro da Barra Superior e não encontrar, o primeiro lugar a verificar são os
três pontinhos.
O lado direito: publicar, testar e configurar o ambiente
O lado direito da primeira linha concentra os controles que
determinam o que acontece com o aplicativo além do momento de desenvolvimento.
São os botões que você usa quando quer ver o aplicativo funcionando ou quando
quer disponibilizá-lo para os usuários.
Antes de falar sobre cada botão, é essencial entender uma
distinção que evita um dos erros mais comuns no desenvolvimento: salvar e
publicar são ações completamente diferentes, com consequências
completamente diferentes.
Salvar grava o estado atual do aplicativo na nuvem. O
seu trabalho fica protegido e pode ser retomado a qualquer momento, mas os
usuários do sistema não veem nenhuma mudança. É um ato interno, entre você e o
desenvolvimento.
Publicar libera a versão atual do aplicativo para
todos os usuários que têm acesso a ele. A partir do momento em que você
publica, quem abrir o app vai ver a versão mais recente — com tudo que você
construiu, e também com qualquer erro que você não tenha corrigido ainda.
Publicar pressupõe que você já salvou e já testou. Nunca é o primeiro passo.
O botão de Edição — que aparece como texto com um
ícone de lápis — indica o modo atual do Studio e pode ser usado para alternar
entre modos de trabalho. Ao lado dele estão ícones de funções colaborativas:
comentários, assistente de voz e compartilhamento do aplicativo com outros
desenvolvedores ou usuários.
O botão de play — o triângulo apontado para a direita
— ativa o modo de visualização. Nesse modo, o Studio sai do ambiente de
edição e exibe o aplicativo exatamente como o usuário final o veria: botões
funcionando, galerias carregando dados reais, fórmulas executando. É aqui que
você testa se o que construiu funciona como planejou. Para sair do modo de
visualização e voltar à edição, pressione a tecla Esc. Um detalhe
crítico: se o aplicativo tiver fórmulas de gravação ativas — como as que salvam
dados no SharePoint — elas executam de verdade no modo de visualização. Teste
com responsabilidade.
O botão de salvar — o ícone de disquete ou a opção
acessível pelo atalho Ctrl+S — grava o estado atual sem publicar.
Desenvolva o hábito de salvar com frequência: antes de qualquer teste, antes de
qualquer pausa, antes de qualquer alteração de risco.
No canto direito da primeira linha, separadas do restante
por um espaçamento visual, estão as informações do ambiente e do usuário: o
nome da organização — no caso da Escola,, Centro Educacional Sag... —,
os ícones de notificações e configurações gerais do Microsoft 365, e a foto ou
inicial do usuário logado. Esses elementos confirmam em qual tenant você está
trabalhando — informação útil para quem administra mais de um ambiente.
A Segunda Linha: A Barra de Fórmulas
A segunda linha da Barra Superior é dedicada exclusivamente
à barra de fórmulas — e ela merece atenção especial porque é uma das
ferramentas que você mais vai usar em todo o desenvolvimento.
A barra de fórmulas é composta por três partes, da esquerda
para a direita.
O primeiro elemento é um campo suspenso que exibe o
nome da propriedade atualmente selecionada. No print do sistema da Escola,,
esse campo mostra Fill — a propriedade que controla a cor de
preenchimento de um componente. Clicando nesse campo, uma lista suspensa
aparece com todas as propriedades disponíveis para o componente selecionado,
permitindo que você alterne entre elas sem precisar ir ao painel lateral.
O segundo elemento é o símbolo = fx, que indica que o
campo à direita aceita tanto valores fixos quanto fórmulas dinâmicas. O
"fx" é o mesmo símbolo que você reconhece do Excel — e não é
coincidência: a linguagem Power Fx que governa o Power Apps foi inspirada
diretamente na lógica das planilhas.
O terceiro elemento é o campo de fórmula em si — o
espaço onde você escreve o valor ou a fórmula da propriedade selecionada. No
print do sistema da Escola,, esse campo exibe RGBA(242; 239; 223; 1) — uma
fórmula que define uma cor específica usando os canais vermelho, verde, azul e
opacidade. Você vai aprender a escrever fórmulas assim ao longo do curso,
sempre com explicação argumento por argumento.
Como você aprendeu no Post 1, as propriedades de qualquer
componente são acessíveis de duas formas: pelo painel lateral de
propriedades à direita da tela, ou pela barra de fórmulas. O painel
lateral é mais visual e amigável para ajustes rápidos de aparência. A barra de
fórmulas é mais precisa e direta — ideal para escrever e revisar fórmulas.
Profissionais experientes usam quase exclusivamente a barra de fórmulas.
Durante o aprendizado, este curso vai sempre mostrar as duas formas quando uma
propriedade for configurada pela primeira vez.
3. Prática: Como a Barra Superior Está Presente no Sistema da Escola
A Barra Superior não é um elemento que você edita ou
personaliza dentro do sistema da Escola, — ela não recebe componentes, não muda
de cor, não é configurada por fórmulas. Mas ela governa cada ciclo do
desenvolvimento do sistema.
Durante o ano de construção do aplicativo, o fluxo de
trabalho padrão passou pela Barra Superior dezenas de vezes por sessão:
construir uma funcionalidade, salvar com Ctrl+S, testar com o botão de play,
corrigir o que for necessário, salvar novamente e, quando a funcionalidade
estiver madura e testada, publicar. Esse ciclo se repetiu para cada botão, cada
galeria, cada fórmula do sistema.
Há um detalhe da configuração da Escola, que aparece
diretamente na Barra Superior: o nome da organização exibido no canto superior
direito - confirma que o aplicativo está vinculado ao tenant correto do
Microsoft 365 A1 Educação. Isso importa porque publicar nesse ambiente
significa que o aplicativo fica disponível apenas para usuários dentro da
organização, com as permissões certas no SharePoint. Não é possível publicar
para usuários externos nessa configuração — e isso é uma decisão de arquitetura
consciente, não uma limitação acidental.
4. Entendimento: A Barra que Você Vai Consultar Todos os Dias
A Barra Superior não é complexa — mas é densa. Veja o que
ficou:
A Barra Superior ocupa as duas primeiras linhas do Power
Apps Studio e está sempre visível. A primeira linha tem três regiões: à
esquerda a identidade do ambiente e os controles de desfazer; no centro as
ferramentas de desenvolvimento (Inserir, Adicionar dados, Novo ecrã, Tema, Cor
de fundo); à direita os controles de publicação, teste e configurações. A
segunda linha é a barra de fórmulas, com o seletor de propriedade, o indicador
fx e o campo onde você escreve valores e fórmulas. Salvar e publicar são ações
distintas com consequências distintas — nunca pule o teste entre as duas. A
quantidade de botões visíveis no centro da barra varia com a largura da tela —
os que não couberem estão nos três pontinhos.
Atenção Técnica
O termo ecrã aparece na Barra Superior no lugar de tela
— isso é uma variação de tradução do Power Apps e não indica nenhum erro de
configuração. No contexto deste curso e do sistema da Escola,, os dois termos
significam exatamente a mesma coisa. Sempre que a interface mostrar
"ecrã", leia "tela".
A barra de fórmulas sempre exibe a propriedade do elemento
atualmente selecionado. Se você clicou no fundo vazio da tela de trabalho em
vez de em um componente, a barra vai mostrar as propriedades da tela em si —
não de um componente. Isso não é erro: é o comportamento correto. Clique no
componente que deseja configurar e as propriedades corretas aparecem.
Erro Comum
O erro mais frequente neste post é publicar sem testar. O
desenvolvedor faz uma alteração, salva — e, no entanto, clica em publicar sem
antes usar o botão de play para verificar se a alteração funciona como
esperado. O resultado observável é imediato: o usuário abre o aplicativo e encontra
um comportamento quebrado, um componente que não responde ou uma fórmula que
exibe um erro em tela. A sequência correta é sempre: construir → salvar →
testar → corrigir → salvar → publicar. Nunca encurte esse caminho.
O que vem no Próximo Post — O Menu Lateral e os Painéis
que Mudam Tudo
Agora que você conhece a barra que fica no topo, o próximo
passo é explorar o painel que fica à sua esquerda. O Menu Lateral do Power AppsStudio não é uma barra de navegação simples — ele contém painéis que mudam
completamente o que você vê e pode fazer. A Árvore do aplicativo, o painel de
Variáveis e o painel de Conexões vivem ali. Cada um tem um momento certo de
uso. No próximo post, você vai aprender quando e por que usar cada um — e vai
entender por que a Árvore, em especial, é o mapa que você vai consultar dezenas
de vezes por sessão de trabalho.
Nenhum comentário:
Postar um comentário