I need to show images or videos in a container, and I hope to change the number in one row depending on the width of container
This library GitHub - aghasemi/streamlit_js_eval: A custom Streamlit component to evaluate arbitrary Javascript expressions has a method for getting parameters like screen.width
See the example in the readme:
st.write(f"Screen width is {streamlit_js_eval(js_expressions='screen.width', key = 'SCR')}")
tks,I will try it at once
I am sorry to find, yes, it seems the package has a simple way to get the window size, but I just test, it is not stable, and just show once time seemly the width shown, but when I tried more, the width number didn’t change, I resized my windows once and once ,and then refresh my chrome, after I change my windows, but no useful.
I think what you need is the page window width rather than the screen window width.
import streamlit as st
from streamlit_js_eval import streamlit_js_eval
st.set_page_config(layout='wide')
page_width = streamlit_js_eval(js_expressions='window.innerWidth', key='WIDTH', want_output = True,)
st.write(page_width)
The method doesn’t automatically rerun when the windows is resized, so if you want to change the app when a window is resized, it might not work well.
I tried this to get both window’s height and width. But I only get the width value while for the height I get 0
code:
output:

Any ideas on how to make it work?
Do SCR2
and SCR1
refer to different screens?
It would be nice to have some streamlit intrinsic way to get the width and height of the website, e.g. to change the height of a dataframe according to the available height of the page.
This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.