Ir para o conteúdo

Controle de Botão

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 no clique (se desejado), cor, rótulo e muito mais.

Se controle adicional for desejado sobre a aparência de um botão, App Builder suporta isso através 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 Column subjacente, selecione o valor
  3. Defina o Control Type como Button
  4. Atribua um Name. Este valor aparecerá no próprio botão.
  5. Selecione o valor Control Subtype para definir se o botão deve ter a aparência Primary ou Secondary.

    1. Primary = aparece como um botão principal no painel
    2. Seondary = aparece como um botão secundário no painel, mais claro que um botão primário
  6. Clique em Next

  7. Se o botão deve Execute an Event ao clicar, selecione o evento apropriado
  8. Se o botão deve Link to Page ao clicar, selecione a página apropriada
  9. Clique em Next
  10. Revise as atualizações App Builder fará ao adicionar o controle Button e clicar em Concluir
  11. Se um Local diferente for desejado 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 do lado direito 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 fica à direita de qualquer botão de Método de atualização existente (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

Estilos podem ser usados para personalizar ainda mais um controle de Botão. Use os Estilos disponíveis para alterar coisas como tamanho, cor e espessura da fonte do Botão. Você pode personalizar um Estilo se for necessária mais granularidade.

  1. Navegue até a página do aplicativo com o controle de Botão
  2. Vá para Action Drawer > Live Designer
  3. Selecione o controle de 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 Tipo 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 colocados em 4 áreas diferentes em um painel usando o campo Localização. A colocação é definida pela opção Localização selecionada no modo de edição de controle. As áreas em que os botões podem ser colocados 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 do lado direito 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 fica à direita de qualquer botão de Método de atualização existente (por exemplo, Criar, Auditoria)

localizaçãodosbotões.png

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