Columns in a column

Using Streamlit
1

I would like to have two columns as a table and next to it another column.

  • How can this be done?
  • What is the container good for?
  • How can I put in one column two widgets side by side?
[Metric]-[Graph] | [Another Column]
[Metric]-[Graph] |
[Metric]-[Graph] |
[Metric]-[Graph] |
2

Hi @Hanan_Shteingart1 ,

Welcome to the Streamlit Community Forum :partying_face: :balloon:

This :arrow_down_small: well written blog post can certainly help you out :smiley:

App Layout Primitives: Columns, Containers & Expanders (streamlit.io)

3

Thanks I have read it. Yet I still don’t understand what is container good for. Can you show an example for something which cannot be done without a container?

4

Hi @Hanan_Shteingart , check out this video link:

Cheers

5

Hey @Hanan_Shteingart ,

Apologies I missed your query here.

Ofcourse, an UI can be designed without specifically the st.container() widget, if the workarounds are known.
However, there are times, when the container widget comes very handy , for instances (Here’s the reference to the doc),

import streamlit as st
import numpy as np
st.header("Demo")

cont = st.container()
_plotType = st.selectbox("Plot Type", ['Line','Bar'])

if _plotType == 'Line':
    cont.header("Line Plot")
    cont.line_chart(np.random.randn(50, 3),use_container_width = True)
if _plotType == 'Bar':
    cont.header("Bar Plot")
    cont.bar_chart(np.random.randn(50, 3),use_container_width = True)

Probably you are already aware, that the Streamlit App, runs line by line in your code. In this case, let’s consider, you plan to plot in the very top of your app, just below the header. So, you leave a empty container, and populate it based on your user’s choice. If container layout isn’t used, the plot appears after the user’s choice .

I hope this makes sense. (Perhaps a better example would make more sense :sweat_smile: , let me know) .

Best
Avra

6

This topic was automatically closed 365 days after the last reply. New replies are no longer allowed.