Aula 06 Power Apps - Tela de Detalhes e o vínculo de formatação entre os controles

Aula 06 Power Apps - Tela de Detalhes e o vínculo de formatação entre os controles Olá seja bem-vindo a mais uma aula do meu canal de vídeos no YouTube na aula de hoje vamos falar sobre o aplicativo que estamos desenvolvendo no power apps vou começar abrindo o navegador você tem.

Aula 06 Power Apps - Tela de Detalhes e o vínculo de formatação entre os controles

Um app1 chamado participantes da palestra aí na sua lista de aplicativos você pode clicar já diretamente sobre ele pois é um aplicativo recente que nós abrimos ou.

Clicar em aplicativos e fazer o ajuste para você encontrar o seu aplicativo também ele está na página inicial então duas formas diferentes de você abrir a sua aplicação clicando sobre o botão.

Editar nós vamos agora focar a nossa atenção na página dois na página de detalhes da aplicação você se recorda que na página 1 nós aplicamos as boas práticas renome todos os objetos e.

Adaptamos alguns dos controles Pois vamos fazer o mesmo agora aqui nesse nosso nessa nossa segunda página eu estou aguardando ele carregar Vamos criar também um objeto diferente nós.

Vamos cadastrar um rodapé aqui na parte de baixo só para que você possa colocar algo como se fosse um copyright uma informação de que foi você que desenvolveu sua.

Aplicação na tela de consulta na nossa primeira tela Você vai clicar sobre a galeria reduza o tamanho da galeria e libere um espaço na parte inferior da tela para que você possa.

Colocar uma caixa de texto clicando em inserir você pode clicar em rótulo de texto e nós vamos arrastá-lo para baixo ele está aqui na parte superior da tela vamos arrastar até embaixo é só uma.

Mensagem informando que nós que desenvolvemos a aplicação Então você vai reduzir o seu tamanho depois você pode até encostar a sua galeria para com ele né deixando bem encostadinho e nós vamos.

Começar a mudar as suas características então primeiro o texto vai ser des envolvido por e você vai colocar o seu nome Alessandro trovato Vou colocar aqui o meu nome pressionando o enter vou.

Reduzir a fonte para 10 ficou muito pequeno 12 vou colocar em Itálico e vou pedir para alinhar ao centro esse nosso texto a cor nós vamos aplicar também igual a a.

Nossa caixa aqui na parte superior da tela lembre-se nós temos um retângulo superior e esse retângulo tem a cor que eu preciso aqui retângulo cabeçário fica mais fácil de.

Veja Mais Aqui:

    $ads={1}

    Identificá-lo a cor está aqui no balde

    De preenchimento se você clicar sobre o balde de preenchimento você pode clicar em personalizar e copiar o Tom exato exade decimal da cor para aplicar ao.

    Rodapé assim não vai dar diferença Clique na caixa e agora na no preenchimento na cor de preenchimento Você vai clicar sobre ela personalizar e Vai colar o código ex decimal mantendo.

    Então a mesma estrutura na cor da fonte nesse botão exatamente ao lado você vai definir a cor branca você pode colocar ainda eliminação da borda veja que a borda.

    Aqui está como zero você se você quiser bordas você pode colocar uma borda Mais Escura tive a impressão que estava com uma borda selecionada mas foi só impressão.

    Mesmo você pode então agora clicar sobre essa caixa de texto lembrando de renomeável nós vamos trocar o seu nome para lbl rodapé e vou colocar a TL com que é.

    Identificação da tela pressionando enter copia já preparamos o nosso rótulo copiando esse rótulo você pode agora selecionar a segunda página que é a tela de detalhes e da mesma forma que.

    Fizemos anteriormente só que dessa vez você vai perceber que esse é um controle diferente é chamado de formulário esse formulário de detalhes você vai reduzir o seu tamanho també vai clicar sobre a.

    Página e vai colar ele vai entrar na mesma posição aí é só ajustar o seu elemento já que estamos fazendo isso vamos trocar o seu nome lbl.

    Rodapé como agora estamos com a tela de detalhes e vou colocar TL Dell Dessa forma não haverá conflito de nomes com outro controle e na tela de edição a mesma coisa vamos clicar sobre o.

    Controle principal que é um Edit for

    Vamos reduzir a sua altura e colar a nossa caixa de texto nosso rótulo de texto você vai ver que o nome dele veio com o mesmo nome anterior basta você.

    Clicar e trocar o nome dessa vez a tela ao invés de ser a tela de consulta é a tela de edição Ed pronto temos três controles diferentes já renomeados vamos Soar a nossa atenção na tela de detalhes.

    Vou reduzir o zoom para que possamos visualizar a nossa aplicação Aqui nós temos na parte superior a o nosso título da tela ao invés de deixar o nome da tabela como tb participantes.

    Você vai clicar sobre ela sobre esse rótulo e nós vamos trocar o seu nome Vamos colocar aqui detalhes só isso olhando para a nossa tela de.

    Consulta você vai ver que o esquema de cores está igual então nós já temos participantes E agora temos a tela de detalhes o botão para voltar ele tem uma ação a instrução do Power FX navigate.

    Ele vai levar isso de volta pra nossa tela de consulta que é a tela anterior usando uma transição nenhuma é nenhuma esse botão do lixo usa o comando remove do Power FX Esse comando ele vai.

    Buscar da nossa tabela de participantes aquele item que está selecionado na galeria ou item que está exibido Lembrando que dois ponto e vírgula junto significa que é um outro.

    Comando você pode quebrar isso digitando shift enter facilitando a sua leitura também e depois Observe que o comando if está verificando se está vazia a caixa de erros ou se retornou erros o.

    Processo temos aqui o comando back que volta para a tela anterior no final ok então nós vamos nos aprofundar nesses comandos no futuro esse ícone é o ícone de edição quando nós estamos estamos.

    Usando a nossa PP vamos relembrar ao executá-lo a partir da tela inicial quando você clica sobre um registro qualquer um ele vai ser aberto para edição usando a nossa tela de detalhes e.

    Se você quiser alterar qualquer item basta clicar nesse botão que ele edita o item que está ativo a primeira mudança que nós vamos fazer é fazer a a a reordenação desses.

    Campos o nome completo que está aqui embaixo eu gostaria que ele viesse para cima você não vai clicar sobre o elemento e arrastar manualmente lembre-se por ser um ambiente de low.

    Code boa parte das ações que fazemos são feitas com propriedades se você observar à direita no seu painel em campo você encontrará o botão editar ao clicar sobre o botão editar você verá o.

    Controle e-mail cidade idade e nome completo Ok clicando na reticências aqui do nas reticências do nome completo você pode mover para cima conforme você vai.

    Movendo o campo aqui nesse painel automaticamente ele vai se reordenando também aqui na tela você não precisa se preocupar vamos fechar esse controle e agora vamos para uma propriedade bem.

    Interessante eu gostaria de diferenciar o rótulo do conteúdo no rótulo eu gostaria então de colocar uma cor de preenchimento e nós vamos trazer esse rótulo colado à esquerda posição x = 0.

    Também V vamos pegar essa posição aqui o tamanho né a largura e vamos usar a largura Total o nome completo eu vou trocar na propriedade texto você vai ver que ele está protegido basta você clicar.

    No cadeado para desbloquear e podemos mudar as suas propriedades agora clicando no nome completo na propriedade texte você está vendo a parent p.

    Displayname significa que o item que é o parente anterior a ela ou item hierarquicamente anterior é o responsável por dar o seu nome nós vamos Apagar isto aqui podemos dar o nome que.

    Queremos Então vamos colocar uma aspas duplas e digitar nome completo fecho as aspas e você vai ver que o controle será alterado depois nós vamos renomear Esse controle eu gostaria de.

    Colocar uma distância você já viu o comando pading left nós vamos mudar o pading left que está como s e você vai ver que vai descolar esse.

    Título da borda nós vamos agora preencher esse cont uma para segir de cores eu usar um mais escuro V usar deix ver essa escala bem.

    Escuro para mostrar o título e a mesmo tempo V colocar na fonte a cor branca nós vamos ter aqui uma linha que eu vou definir uma altura manual 40 e essa altura está muito boa.

    Lembre-se que nós temos várias propriedades então se eu clicar sobre esse botão altura ele se chama he 40 quando eu clicar agora no controle do eil eu vou.

    Desbloqueá-lo podemos usar aqui uma propriedade muito interessante primeiro nós vamos clicar sobre esse campo e nós vamos dar um nome para ele vamos colocar lbl nome completo então nome completo da.

    Tela l de detalhes vou copiar essa terminação para facilitar as próximas vezes que renomear Aliás nem vai precisar porque nós vamos usar esse nome muitas vezes então vou.

    Copiar ele inteiro ok então nós temos esse objeto que já está formatado então quando eu clicar sobre email nós vamos acessar a propriedade he dele e ao invés de.

    Digitar o tamanho 40 nós vamos colocar aqui o nome do controle anterior ponto e vamos buscar a sua propriedade height pressionando enter eles ficarão com o mesmo.

    Tamanho da mesma forma que fizemos essa alteração eu posso escolher também a propriedade de cor se nós olharmos aqui para o nosso controle cor está como color eu vou copiar isto Opa estamos com.

    AVISO LEGAL: Toda a responsabilidade do conteúdo deste vídeo transcrito é do produtor do canal.
    CLique no Link do Vídeo: https://www.youtube.com/watch?v=h9Z0UfxwKpk
Wesdigital

Postar um comentário

Postagem Anterior Próxima Postagem