Laboratório de prática 3 – Criar um aplicativo de tela

Neste laboratório, você projetará e criará um aplicativo de tela em branco, adicionará uma fonte de dados e uma galeria.

O que você aprenderá

• Como criar um aplicativo de tela com uma galeria vinculada a uma fonte de dados
• Como formatar campos com fórmulas do Power Fx

Macroetapas do laboratório

• Criar um aplicativo de tela em branco
• Adicionar uma fonte de dados ao aplicativo
• Adicionar uma galeria ao aplicativo
• Configurar os campos na galeria

Pré-requisitos

• É necessário ter concluído Laboratório 2: Modelo de dados

Etapas detalhadas

Exercício 1 – Criar um aplicativo de tela

Tarefa 1.1 – Criar o aplicativo

1. Navegue até o portal do Power Apps Maker https://make.powerapps.com

2. Verifique se você está no ambiente Dev One.

3. Selecione a guia + Criar no menu de navegação à esquerda.

4. Selecione o bloco Aplicativo em branco em Iniciar de.

5. Selecione Criar no bloco Aplicativo de tela em branco.

   

6. Insira Booking Request app em Nome do aplicativo.

7. Selecione Tablet em Formato.

   

8. Selecione Criar.

9. Aguarde até que o aplicativo seja criado.

10. Selecione Salvar no canto superior direito do Power Apps Studio.

Tarefa 1.2 – Adicionar fonte de dados

1. No menu de criação de aplicativo, selecione Dados.

   

2. Selecione o cursor suspenso ao lado de Adicionar dados e insira Booking em Pesquisa.

   

3. Selecione a tabela Solicitações de reserva do Microsoft Dataverse.

Tarefa 1.3 – Configurar a tela principal

1. No menu de criação do aplicativo, selecione o Modo de exibição de árvore.

2. Escolha Tela1 no modo de exibição de árvore, selecione as reticências (…) e depois Renomear.

3. Digite MainScreen.

4. No menu de criação do aplicativo, selecione Inserir (+).

5. Selecione Retângulo.

6. Arraste o retângulo para o canto superior esquerdo da tela.

7. No menu de criação do aplicativo, selecione o Modo de exibição de árvore.

8. Renomeie o retângulo como HeaderRect.

9. Defina as propriedades do retângulo na barra de fórmulas da seguinte maneira:

   1. X=0
   2. Y=0
   3. Altura=80
   4. Largura=Parent.Width

10. No menu de criação do aplicativo, selecione Inserir (+).

11. Selecione Rótulo de texto.

12. Arraste o rótulo para o canto superior esquerdo da tela.

13. No menu de criação do aplicativo, selecione o Modo de exibição de árvore.

14. Renomeie o rótulo como HeaderLabel.

15. Defina as propriedades do rótulo na barra de fórmulas da seguinte maneira:

    1. X=0
    2. Y=0
    3. Altura=80
    4. Largura=Parent.Width
    5. Alinhamento=Align.Center
    6. Tamanho=24
    7. Texto="Booking Request"
    8. Cor=Color.White

    

16. Selecione Salvar no canto superior direito do Power Apps Studio.

Tarefa 1.4 – Adicionar uma galeria

1. No menu de criação do aplicativo, selecione Inserir (+).

2. Selecione Galeria vertical.

   

3. Selecione Solicitações de Reserva como a fonte de dados.

   

4. Na guia Propriedades, em Layout, selecione Título, subtítulo e corpo.

5. Selecione 7 selecionados ao lado de Campos.

6. Selecione Custo para Corpo1.

7. Selecione Decisão para Subtítulo2.

8. Selecione Nome do animal de estimação para Título2.

   

9. Feche o painel Dados.

10. No menu de criação do aplicativo, selecione o Modo de exibição de árvore.

11. Renomeie a galeria como BookingRequestList.

12. Defina as propriedades da galeria na barra de fórmulas da seguinte maneira:

    1. X=0
    2. Y=80
    3. Altura=575
    4. Largura=250

Tarefa 1.5 – Formatar o campo de moeda

1. No menu de criação do aplicativo, selecione o Modo de exibição de árvore.

2. Expanda a galeria BookingRequestList.

3. Selecione Body1.

   

4. Na barra de fórmulas, defina a propriedade Texto para a seguinte fórmula:

    Text(Value(ThisItem.Cost), "$#,##0.00")
   

5. Selecione Salvar no canto superior direito do Power Apps Studio.

6. Selecione o botão <- Voltar no canto superior esquerdo da barra de comandos e selecione Sair para sair do aplicativo.