Ir para o conteúdo

Controle de botão no Jitterbit App Builder

Controles de botão permitem que você coloque um controle em um painel que se parece com um botão e oferecem opções de configuração para controlar o local de posicionamento, comportamento ao clicar (se desejado), cor, rótulo e muito mais.

Se você desejar controle adicional sobre a aparência de um botão, o App Builder oferece suporte a isso por meio de Estilos.

Como configurar um controle de botão

  1. Na visualização do aplicativo, vá para Action Drawer > Live Designer
  2. Se o Botão deve ser associado a uma Coluna subjacente, selecione o valor
  3. Defina o Tipo de controle como Botão
  4. Atribua um Nome. Este valor aparecerá no próprio Botão.
  5. Selecione o valor Subtipo de controle para definir se o botão deve ter aparência Primária ou Secundária.

    1. Primário = aparece como um botão principal no painel
    2. Secundário = aparece como um botão secundário no painel, mais claro que um botão primário
  6. Clique em Avançar

  7. Se o botão deve Executar um Evento ao clicar, selecione o evento apropriado
  8. Se o botão Link para a página ao clicar, selecione a página apropriada
  9. Clique em Avançar
  10. Revise as atualizações que o App Builder fará ao adicionar o controle Botão e clique em Concluir
  11. Se desejar um Local diferente para o posicionamento do botão, selecione o valor apropriado

    1. Corpo = comportamento padrão que normalmente é exibido em linha no Painel
    2. Cabeçalho = é exibido na região do cabeçalho do painel, o padrão é a região direita do painel
    3. Painel (Menu) = exibe em um menu aninhado que é exibido no Painel, região superior direita do Painel
    4. Barra de ferramentas = é exibida na região da barra de ferramentas do painel, por padrão, à direita de quaisquer botões de método de atualização existentes (por exemplo, Criar, Auditoria)
  12. Revise as opções disponíveis e faça quaisquer atualizações de configuração adicionais

  13. Clique em Salvar

Como estilizar um botão

Os estilos podem ser usados para personalizar ainda mais um controle de botão. Use os estilos disponíveis para alterar recursos como tamanho, cor e espessura da fonte do botão. Você pode personalizar um estilo se precisar de mais granularidade.

  1. Navegue até a página do aplicativo com o controle Botão
  2. Vá para Gaveta de Ações > Live Designer
  3. Selecione o controle Botão na visualização de página
  4. Na região de edição, vá para Mais... > Estilos
  5. Clique em + Estilo
  6. Selecione Botões em Categorias de Estilo
  7. Localize o Estilo desejado e clique no botão + Adicionar correspondente. Por exemplo: App Builder - Botão em fonte grande
  8. Saia das telas de Estilos e edição, atualize o navegador e confirme as atualizações

Opções de localização dos botões

Os controles de botão podem ser configurados para serem posicionados em 4 áreas diferentes de um painel usando o campo Localização. O posicionamento é definido pela opção Localização selecionada no modo de edição do controle. As áreas em que os botões podem ser posicionados nos painéis incluem:

  1. Corpo = comportamento padrão que normalmente é exibido em linha no Painel
  2. Cabeçalho = exibido na região do cabeçalho do painel, o padrão é a região direita do painel
  3. Painel (Menu) = é exibido em um menu aninhado que é exibido no Painel, região superior direita do Painel
  4. Barra de ferramentas = é exibida na região da barra de ferramentas do painel, por padrão, à direita de quaisquer botões de método de atualização existentes (por exemplo, Criar, Auditoria)

buttonlocations.png

Ilustração de diferentes localizações de botões disponíveis no App Builder