Você já imaginou criar um aplicativo web interativo e dinâmico sem precisar ser um expert em programação? Com o Streamlit, isso é possível! Neste guia, vamos explorar como você pode criar multipágina com Streamlit de forma simples e prática, mesmo que você seja um iniciante. Vamos lá?
Introdução ao Streamlit
Streamlit é uma biblioteca de código aberto que transforma scripts de dados em aplicativos web interativos. Ele é especialmente útil para cientistas de dados e analistas que desejam compartilhar suas análises de forma visual e interativa, sem a necessidade de conhecimentos avançados em desenvolvimento web. Com o Streamlit, você pode criar dashboards, visualizações de dados e até mesmo aplicativos completos com apenas algumas linhas de código.
Preparando o Ambiente
Antes de começarmos a criar nosso aplicativo multipágina com streamlit, precisamos preparar nosso ambiente de desenvolvimento. Vamos ver como instalar a biblioteca e configurar tudo para começar a codificar.
Instalando o Streamlit
A instalação do Streamlit é bastante simples. Você pode instalá-lo usando o pip, o gerenciador de pacotes do Python. Basta abrir o terminal e executar o seguinte comando:
pip install streamlit
Configurando o Ambiente de Desenvolvimento
Depois de instalar o Streamlit, é importante configurar seu ambiente de desenvolvimento para facilitar o processo de criação do aplicativo. Certifique-se de ter um editor de código de sua preferência, como VSCode ou PyCharm, e crie uma nova pasta para o seu projeto.
App Multipágina
Agora que nosso ambiente está pronto, vamos entender o que é um aplicativo multipágina e por que ele pode ser útil.
O que é um App Multipágina?
Um aplicativo multipágina é um tipo de aplicativo que permite a navegação entre diferentes páginas ou seções dentro do mesmo projeto. Um app multipágina Streamlit é criado organizando o código em diferentes arquivos dentro de uma pasta específica chamada “pages”. Cada arquivo representa uma página distinta do aplicativo. Isso facilita a organização do código e a criação de interfaces mais complexas e estruturadas, permitindo que os usuários naveguem entre várias funcionalidades ou visualizações de dados sem sair do aplicativo principal.
Benefícios de Usar um App Multipágina
Os aplicativos multipágina são especialmente úteis quando você tem diferentes seções ou funcionalidades que deseja separar. Por exemplo, você pode ter uma página de introdução, uma página de gráficos, uma página de mapas e uma página de tabelas de dados. Isso torna o aplicativo mais organizado e fácil de navegar.
Passo a Passo para Criar um App Multipágina
Vamos ao que interessa: como criar um aplicativo multipágina com Streamlit. Vamos seguir um passo a passo para estruturar nosso projeto, mover o conteúdo para as páginas e configurar a navegação entre elas.
Estruturando o Projeto
Primeiro, precisamos estruturar nosso projeto. Crie uma pasta chamada pages
dentro da pasta do seu projeto. Essa pasta será onde colocaremos os arquivos de cada página do nosso aplicativo.
Criando a Pasta de Páginas
Dentro da pasta pages
, crie arquivos Python para cada página do seu aplicativo. Por exemplo, você pode criar os seguintes arquivos:
1_introducao.py
2_graficos.py
3_mapas.py
4_tabelas.py
Movendo o Conteúdo para as Páginas
Agora, mova o conteúdo de cada funcionalidade para os respectivos arquivos. Por exemplo, o conteúdo da página de introdução vai para o arquivo 1_introducao.py
, e assim por diante.
Configurando a Navegação entre Páginas
Para configurar a navegação entre as páginas, vamos usar a função st.sidebar.selectbox
para criar um menu de navegação na barra lateral. No arquivo principal do seu projeto, adicione o seguinte código:
import streamlit as st
# Funções para cada página
def introducao():
st.title("Introdução")
st.write("Bem-vindo ao nosso aplicativo multipágina!")
def graficos():
st.title("Gráficos")
st.write("Aqui você pode ver alguns gráficos.")
def mapas():
st.title("Mapas")
st.write("Aqui você pode ver alguns mapas.")
def tabelas():
st.title("Tabelas de Dados")
st.write("Aqui você pode ver algumas tabelas de dados.")
# Dicionário de páginas
paginas = {
"Introdução": introducao,
"Gráficos": graficos,
"Mapas": mapas,
"Tabelas de Dados": tabelas
}
# Menu de navegação
st.sidebar.title("Navegação")
pagina_selecionada = st.sidebar.selectbox("Selecione uma página", paginas.keys())
# Exibir a página selecionada
paginas[pagina_selecionada]()
Exemplo Prático: Criando um App Multipágina
Vamos criar um exemplo prático de um aplicativo multipágina com quatro páginas: introdução, gráficos, mapas e tabelas de dados.
Página de Introdução
No arquivo 1_introducao.py
, adicione o seguinte código:
import streamlit as st
def introducao():
st.title("Introdução")
st.write("Bem-vindo ao nosso aplicativo multipágina!")
Página de Gráficos
No arquivo 2_graficos.py
, adicione o seguinte código:
import streamlit as st
import matplotlib.pyplot as plt
def graficos():
st.title("Gráficos")
st.write("Aqui você pode ver alguns gráficos.")
# Exemplo de gráfico
fig, ax = plt.subplots()
ax.plot([1, 2, 3, 4], [10, 20, 25, 30])
st.pyplot(fig)
Página de Mapas
No arquivo 3_mapas.py
, adicione o seguinte código:
import streamlit as st
import pandas as pd
import pydeck as pdk
def mapas():
st.title("Mapas")
st.write("Aqui você pode ver alguns mapas.")
# Exemplo de mapa
df = pd.DataFrame({
'lat': [37.76, 37.77, 37.78],
'lon': [-122.4, -122.41, -122.42]
})
st.pydeck_chart(pdk.Deck(
initial_view_state=pdk.ViewState(
latitude=37.76,
longitude=-122.4,
zoom=11,
pitch=50,
),
layers=[
pdk.Layer(
'HexagonLayer',
data=df,
get_position='[lon, lat]',
radius=200,
elevation_scale=4,
elevation_range=[0, 1000],
extruded=True,
),
],
))
Página de Tabelas de Dados
No arquivo 4_tabelas.py
, adicione o seguinte código:
import streamlit as st
import pandas as pd
def tabelas():
st.title("Tabelas de Dados")
st.write("Aqui você pode ver algumas tabelas de dados.")
# Exemplo de tabela
df = pd.DataFrame({
'Nome': ['Alice', 'Bob', 'Charlie'],
'Idade': [24, 27, 22]
})
st.write(df)
Executando e Testando Seu App Multipágina
Finalmente, vamos ver como rodar e testar nosso aplicativo multipágina.
Como Rodar o App
Para rodar o aplicativo, abra o terminal na pasta do seu projeto e execute o seguinte comando:
streamlit run nome_do_seu_arquivo_principal.py
Testando a Navegação entre Páginas
Abra o navegador e acesse o endereço fornecido pelo Streamlit. Você verá a barra lateral com o menu de navegação. Teste a navegação entre as páginas para garantir que tudo está funcionando corretamente.
Conclusão
Neste guia, aprendemos como criar um aplicativo multipágina com Streamlit, desde a preparação do ambiente até a criação e navegação entre as páginas. Vimos como estruturar o projeto, mover o conteúdo para as páginas e configurar a navegação de forma simples e prática.
Se você gostou deste tutorial e quer aprender mais sobre Streamlit e outras ferramentas de visualização de dados, confira nossos outros artigos e tutoriais. Continue explorando e aprimorando suas habilidades em programação!
Referências
Cursos de programação gratuitos com certificado
Aprenda a programar e desenvolva soluções para o seu trabalho com Python para alcançar novas oportunidades profissionais. Aqui na Asimov você encontra:
- Conteúdos gratuitos
- Projetos práticos
- Certificados
- +20 mil alunos e comunidade exclusiva
- Materiais didáticos e download de código
Comentários
Como estruturar o código de um aplicativo Streamlit com uma tela de login e múltiplas páginas, onde cada página é representada por um arquivo .py separado dentro de um diretório secundário? Além disso, como garantir que os usuários só possam acessar todas as páginas do aplicativo após efetuarem o login na pagna inicial?
Valmir,
Estou iniciando um projeto desse agora.
estou desenhando da seguinte forma,
uso o multipages tô olhando aqui e na documentação.
Mas meu desenho inicial (até dar errado), antes de encontrar esse material (em resumo ontem), crio a pagina inicial com um botão que manda para página de login, estava pensando em usar o st.Page. e st.navigation mas ainda não escrevi o código..