Is there a way to have multiple pages like flask?

Hi, I just finished streamlit tutorial and I was wondering if there is a way to have a multiple page like flask.

Maybe code would look like this

from flask import Flask
import streamlit as st

app = Flask(__name__)

@app.route('/')
def home():
    return 'this is home'

@app.route('/page1')
def page1():
    st.button('this is page1')

if __name__ == '__main__':
    app.run()

I’ve tried making multi page after watching data professors video on youtube, but it’s not quite what I’m looking for.

1 Like

Hi 2asy,

you can try my Multipage framework for this
streamlit-multipage/MultiPage.py at main · akshanshkmr/streamlit-multipage (github.com)

from MultiPage import MultiPage
from apps import first_app, second_app, third_app

app = MultiPage()
app.add_app('App1',first_app.app)
app.add_app('App2',second_app.app)
app.add_app('App3',third_app.app)
app.run()

This should fulfill your usecase

Thanks

2 Likes

you can use the streamlit_pages package directly

1 Like

Or you could use the most mature multi-page framework for Streamlit, Hydralit, with animated menu, extensive code examples and the ability to customise your session state and even use login and security.

@Probability
Super cool package Hydralit. Thanks for sharing in the forum.

Does it support query params?

Yes, it completely supports query parameters. In fact, if you want to use the secure internal navigation as well as query parameter navigation at the same time, 3 lines of code in the parent (see the comment section USE QUERY PARAMETER NAVIGATION below) and 1 line in each of the child applications is all that is required. For example, the Hydralit example application can use query parameter navigation as well as internal by adding the 3 lines shown in the comments and the 1 line shown, at the top of the run method of each child app.

Using query parameters is not recommended if you are creating a secure app, as you are exposing the ability to by-pass any security checks in place, however Hydralit can use this method if you want, it won’t work when using a secure app, as being able to jump straight to a page within a secure app without authentication defeats the purpose of the security.

Using this, you could then bookmark any child app and jump to it directly, for example the parent app code for the Hydralit example with the 3 lines added that will allow query parameter navigation.

You can see the full code and a live running example of the original source below here.

from hydralit import HydraApp
import streamlit as st
import apps


if __name__ == '__main__':
    #this is the host application, we add children to it and that's it!
    app = HydraApp(title='Hydralit Data Explorer',favicon="🐙",nav_horizontal=True,hide_streamlit_markers=True)
  
   # The Home app, this is the default redirect if no target app is specified.
    app.add_app("Home", icon="🏠", app=apps.HomeApp(title='Home'),is_home=True)

    #add all your child apps here
    app.add_app("Cheat Sheet", icon="📚", app=apps.CheatApp(title="Cheat Sheet"))
    app.add_app("Sequency Denoising",icon="🔊", app=apps.WalshApp(title="Sequency Denoising"))
    app.add_app("Sequency (Secure)",icon="🔊🔒", app=apps.WalshAppSecure(title="Sequency (Secure)"))
    app.add_app("Solar Mach", icon="🛰️", app=apps.SolarMach(title="Solar Mach"))
    app.add_app("Spacy NLP", icon="⌨️", app=apps.SpacyNLP(title="Spacy NLP"))
    app.add_app("Uber Pickups", icon="🚖", app=apps.UberNYC(title="Uber Pickups"))
    app.add_app("Solar Mach", icon="🛰️", app=apps.SolarMach(title="Solar Mach"))

    #we want to have secure access for this HydraApp, so we provide a login application
    #optional logout label, can be blank for something nicer!
    #app.add_app("Login", apps.LoginApp(title='Login'),is_login=True) 

    # If the menu is cluttered, just rearrange it into sections!
    # completely optional, but if you have too many entries, you can make it nicer by using accordian menus
    complex_nav = {
        'Home': ['Home'],
        'Intro 🏆': ['Cheat Sheet',"Solar Mach"],
        'Hotstepper 🔥': ["Sequency Denoising","Sequency (Secure)"],
        'Models 🧩': ["Spacy NLP","Uber Pickups"],
    }

    # ----------USE QUERY PARAMETER NAVIGATION----------------------------------------
    # If we want to use query parameters to control the navigation, 
    # for example we could bookmark a specific app and jump straight to it.
    # --------------------------------------------------------------------------------
    query_params = st.experimental_get_query_params()
    if 'selected' in query_params:
      app.session_state.selected_app = (query_params['selected'])[0]
    # --------------------------------------------------------------------------------
    # At the top of the run() method of each child app, just 
    # add this one line and it will also update the query parameter regardless of the source of navigation
    # st.experimental_set_query_params(selected=self.title)

    #create a wrapper class
    # class MySmallApp(HydraHeadApp):

    # #wrap all your code in this method and you should be done
    #     def run(self):
    #         #--------now using query parameter nav as well as internal navigation

              st.experimental_set_query_params(selected=self.title)

    #         #-------------------existing untouched code------------------------------------------
    #         st.title('Small Application with a table and chart.')

    #         st.markdown("### Plot")
    #         df = create_table()

    #         st.line_chart(df)
    # --------------------------------------------------------------------------------

    # Run the Hydra
    app.run(complex_nav)
1 Like