Skip to content

Além do básico: Guia completo para botões no Streamlit

Updated on

O Streamlit revolucionou a forma como construímos aplicações de dados. Com sua abordagem de baixo código, tornou possível para cientistas de dados e desenvolvedores criar aplicativos interativos e amigáveis ao usuário com facilidade. Um dos elementos-chave no Streamlit que contribui para essa interatividade é o humilde botão. Neste guia, vamos mergulhar fundo no mundo do st.button do Streamlit, explorando seu uso, opções de estilo e capacidades orientadas a eventos. Também forneceremos exemplos práticos para iniciantes e desenvolvedores experientes.

Você já ouviu falar desta incrível ferramenta de Análise de Dados e Visualização de Dados, que transforma seu aplicativo Streamlit em um Tableau?

PyGWalker (opens in a new tab) é uma biblioteca em Python que ajuda você a incorporar facilmente uma interface semelhante ao Tableau em seu próprio aplicativo Streamlit sem esforço. Confira este vídeo incrível produzido por Sven do Coding is Fun (opens in a new tab) demonstrando os passos detalhados para fortalecer seu aplicativo Streamlit com esta poderosa Biblioteca de Visualização de Dados em Python!


Agradecimentos especiais a Sven e sua grande contribuição (opens in a new tab) à comunidade do PyGWalker!

Além disso, você também pode conferir a página do PyGWalker no GitHub (opens in a new tab) para mais exemplos do PyGWalker.

Entendendo o st.button no Streamlit

O que é o st.button no Streamlit?

No Streamlit, st.button é uma função que cria um widget de botão. É uma ferramenta simples, mas poderosa, que permite adicionar interatividade aos seus aplicativos Streamlit. Quando um usuário clica em um botão, ele dispara um evento, que pode ser usado para realizar uma ação específica ou atualizar o estado do aplicativo.

if st.button('Diga Olá'):
   st.write('Olá, Streamlit!')

No exemplo acima, quando o botão 'Diga Olá' é clicado, o texto 'Olá, Streamlit!' é exibido na tela.

Como usar o st.button no Streamlit

Usar o st.button no Streamlit é simples. A função recebe um argumento obrigatório - o rótulo do botão, que é uma string. Ela também aceita vários argumentos opcionais que permitem personalizar o comportamento e a aparência do botão. Vamos dar uma olhada em alguns desses argumentos:

  • key: Um identificador único para o botão. Isso é útil quando você tem vários botões e deseja distinguir entre eles.
  • help: Uma string que será exibida como uma dica de ferramenta quando o usuário passar o mouse sobre o botão.
if st.button('Clique em Mim', key='meu_botao', help='Clique neste botão para realizar uma ação'):
   st.write('Você clicou no botão!')

Explorando Argumentos e Opções de Estilo para Botões no Streamlit

A função st.button do Streamlit oferece vários argumentos que permitem personalizar a aparência e o comportamento dos botões. No entanto, até o momento da escrita, o Streamlit não suporta nativamente a alteração da cor e do tamanho de um botão diretamente por meio da função st.button.

Estilizando Botões no Streamlit com CSS

Embora o Streamlit não forneça opções embutidas para estilizar botões, você pode usar CSS para personalizá-los. Você pode injetar CSS personalizado em seu aplicativo Streamlit usando a função st.markdown com o argumento unsafe_allow_html=True. Aqui está um exemplo:

st.markdown("""
<style>
.custom-button {
   background-color: #4CAF50;
   color: white;
   padding: 14px 20px;
   margin: 8px 0;
   border: none;
   cursor: pointer;
   width: 100%;
}
.custom-button:hover {
   opacity: 0.8;
}
</style>
<button class="custom-button">Botão Personalizado</button>
""", unsafe_allow_html=True)

Neste exemplo, criamos um botão personalizado com um fundo verde, texto branco e algum espaço interno. Também adicionamos um efeito que reduz a opacidade do botão quando o mouse está sobre ele.

O evento on_clickButton no Streamlit

No Streamlit, o evento on_click é acionado quando um botão é clicado. Este evento pode ser usado para realizar uma ação específica ou atualizar o estado do aplicativo. Por exemplo, você pode usar o evento on_click para atualizar dados, mostrar ou ocultar conteúdo ou realizar um cálculo.

Aqui está um exemplo de como você pode usar o evento on_click no Streamlit:

def dizer_ola():
   st.write('Olá, Streamlit!')
 
botao = st.button('Diga Olá')
botao.on_click(dizer_ola)

Neste exemplo, quando o botão 'Diga Olá' é clicado, a função dizer_ola é chamada, que escreve 'Olá, Streamlit!' na tela.

Exemplos Práticos de Botões no Streamlit

O st.button do Streamlit não é apenas um conceito teórico, é uma ferramenta prática que você pode usar para adicionar interatividade aos seus aplicativos. Vamos dar uma olhada em alguns exemplos que ilustram como usá-lo efetivamente.

Exemplos de Botões no Streamlit para Iniciantes

Se você é novo no Streamlit, aqui está um exemplo simples para começar. Este código cria um botão que, quando clicado, exibe uma mensagem:

if st.button('Clique em mim'):
    st.write('Você clicou no botão!')

Neste exemplo, st.button('Clique em mim') cria um botão com o rótulo 'Clique em mim'. Quando este botão é clicado, st.write('Você clicou no botão!') é executado, e a mensagem 'Você clicou no botão!' é exibida na tela.

Uso Avançado do Botão no Streamlit

Para usuários mais avançados, você pode usar botões para controlar o fluxo da sua aplicação. Por exemplo, você pode criar um botão que carrega dados quando clicado:

if st.button('Carregar dados'):
    dados = carregar_dados()
    st.write(dados)

Neste exemplo, ao clicar no botão 'Carregar dados', a função carregar_dados é chamada e os dados retornados são exibidos na tela.

Conclusão

O st.button do Streamlit é uma ferramenta poderosa para criar aplicações interativas e amigáveis para o usuário. Seja você um iniciante começando com o Streamlit ou um desenvolvedor experiente querendo adicionar mais interatividade às suas aplicações, é essencial entender como usar e estilizar botões. Com a capacidade de personalizar o comportamento e a aparência dos botões, além de lidar com eventos de clique, você pode criar uma ampla gama de recursos interativos em suas aplicações do Streamlit. Então vá em frente, comece a experimentar com st.button e veja o que você pode criar!

Você já ouviu falar dessa incrível ferramenta de Análise de Dados e Visualização de Dados, que transforma seu aplicativo Streamlit em um Tableau?

PyGWalker (opens in a new tab) é uma biblioteca Python que ajuda você a incorporar facilmente uma interface semelhante ao Tableau em seu próprio aplicativo Streamlit sem esforço.

PyGWalker para Visualização de Dados no Streamlit (opens in a new tab)

Perguntas Frequentes

Como criar um botão no Streamlit?

No Streamlit, você pode criar um botão usando a função st.button. A função recebe um argumento obrigatório, que é a etiqueta do botão.

Como posicionar um botão no Streamlit?

No momento em que este texto foi escrito, o Streamlit não fornece suporte embutido para posicionar elementos, incluindo botões. O layout de um aplicativo Streamlit é determinado principalmente pela ordem em que os elementos são adicionados no script. No entanto, você pode usar markdown e HTML em combinação com CSS para criar layouts personalizados.

Como criar um botão de opção no Streamlit?

No Streamlit, você pode criar um grupo de botões de opção usando a função st.radio. A função recebe dois argumentos: uma etiqueta para o grupo de botões de opção e uma lista de opções.

Quais são as desvantagens do Streamlit?

Embora o Streamlit seja uma ferramenta poderosa para criar aplicações de dados, ele possui algumas limitações. Por exemplo, no momento em que este texto foi escrito, ele não possui suporte embutido para criar layouts complexos e estilizar elementos. Além disso, como os aplicativos do Streamlit são projetados para serem stateless, gerenciar estados (como entradas do usuário ou valores de variáveis) pode ser um desafio. No entanto, o Streamlit é desenvolvido e mantido ativamente, e novos recursos e melhorias são regularmente adicionados.