Ir para o conteúdo

Páginas do Assistente

Wizard é uma das opções de layout de página disponíveis em App Builder. Quando uma página é projetada usando o layout do Assistente, App Builder exibe painéis um de cada vez com botões Anterior, Próximo e Concluir para navegar pelas telas.

A página do Assistente permite que você adicione outros tipos de botões à barra de navegação inferior, além de Anterior, Próximo e Concluir. Veja a seção como substituir botões do Assistente deste artigo para obter detalhes.

Nas páginas do Assistente, basta clicar em um campo e todos os campos editáveis ficarão disponíveis. Para salvar as alterações, clique no último painel e depois em Concluir. Clicar no X no canto superior direito fechará a página sem salvar as alterações.

Existem muitos cenários de negócios em que você pode usar uma página do Assistente. Um exemplo é um formulário de entrada de pedido, onde há várias etapas ao longo do caminho e você deseja dividir visualmente as informações em telas separadas.

wizardexample.png

Melhorias do Assistente

Os magos têm os seguintes aprimoramentos:

  • Uma Barra de Progresso é exibida nas telas para rastrear a etapa atual no assistente

  • Suporte para a coluna Visibilidade do painel, que permite ao desenvolvedor ocultar/mostrar/desabilitar um painel dinamicamente:

    • Mostrar - O painel é listado nas etapas e o usuário vai até ele normalmente
    • Oculto - O painel não é listado nas etapas e o usuário o ignora
    • Desabilitado - O painel é listado nas etapas, mas é riscado e o usuário o ignora

  • Suporte explícito para botões personalizados Anterior, Próximo e Concluir, permitindo que o usuário promova um botão do seu painel para um desses botões na navegação do Assistente.

  • Texto de ajuda - O texto de ajuda do painel aparece abaixo da barra de progresso.

Como Configurar uma Página do Assistente

  1. Navegue até o App Workbench
  2. Clique no botão + Página
  3. Digite um Nome de Página. Por exemplo: Detalhes do Pedido
  4. Clique em Avançar
  5. Selecione o Menu do qual você deseja vincular a página. Por exemplo: Início
  6. Clique em Avançar
  7. Selecione Assistente como o layout do painel e clique em Avançar
  8. Revise as atualizações propostas e clique em Concluir
  9. Clique no botão Prosseguir para configurar a primeira tela no Assistente
  10. Selecione o tipo de painel para exibição e clique em Avançar. Por exemplo: Grade
  11. Selecione a fonte do painel e clique em Avançar
  12. Selecione se deseja Construir automaticamente a tela ou Escolher manualmente e clique em Avançar
  13. Revise as atualizações propostas e clique em Concluir
  14. Clique em Avançar para configurar a segunda tela no Assistente
  15. Repita as etapas 10 a 14 até ter todas as telas configuradas
  16. Para fazer alterações nas telas do Assistente, vá para Gaveta de ações > Designer ao vivo

Como Substituir Botões do Assistente

Conforme mencionado nos aprimoramentos do assistente, agora você pode substituir os botões Anterior, Próximo e Concluir. Para fazer isso, adicione um Tipo de controle de botão e especifique o Subtipo de botão para direcionar o botão no painel do assistente. Com esse método, você pode personalizar o comportamento do botão.

Exemplos de casos de uso em que você pode querer personalizar um botão são executar um evento personalizado quando o botão Próximo é pressionado ou navegar para uma nova página quando o botão Concluir é clicado.

  1. Navegue até o assistente para modificar
  2. Vá para Gaveta de ações > Designer ao vivo
  3. Clique em Mostrar painéis e clique duas vezes no painel em que deseja substituir um botão
  4. Clique no botão + Controle
  5. Selecione Botão como o Tipo de controle
  6. Forneça um Nome para o botão. Por exemplo: Enviar
  7. Selecione o Subtipo de controle desejado, dependendo de onde no Assistente você está procurando colocar o botão
    • Próximo = botão do Assistente que avança para a próxima tela
    • Concluir = botão do Assistente que conclui e encerra o Assistente
    • Anterior = botão do Assistente que move para o slide anterior
  8. Clique em Avançar
  9. Opcionalmente, atribua um Evento para executar ou uma página para vincular e clique em Avançar
  10. Revise as atualizações propostas e clique em Concluir

Configurando um Botão de Conclusão

O botão Finish em um Wizard é uma configuração de caso especial. Um botão Finish só será exibido quando for definido no último painel visível de um Wizard. Para configurar ou substituir um botão Finish, você deve fazer isso no último painel visível do wizard.

Se seu Wizard tiver caminhos condicionais, você pode definir um botão Finish para cada painel que pode ser o último painel visível e App Builder ajustará para exibir o botão Avançar ou Concluir como visível, conforme apropriado. Se você precisar que um botão Concluir apareça antes da última página visível, você pode definir um botão Avançar ou outro, definir o Rótulo para Concluir e fazê-lo fechar ou navegar para outra página para obter o efeito desejado.

  1. Navegue até o Assistente para modificar
  2. Vá para Action Drawer > Live Designer
  3. Clique na aba Todos os Painéis
  4. Localize o último painel visível e clique no ícone para Abrir registro
  5. Clique em + Control
  6. Defina o Tipo de controle como Botão
  7. Defina o Subtipo de controle como Concluir
  8. Insira o Nome que você quer que apareça no botão. Por exemplo: Enviar
  9. Clique em Avançar
  10. Se o botão deve executar um evento ou link para uma página, defina esses valores
  11. Clique em Avançar
  12. Revise as atualizações propostas e clique em Concluir