Streamlit Version1.11.0で何が変わったか見てみよう

はじめに

2022-7-14にVersion1.11.0がリリースされました。
1つ前のVersion1.10.0ではマルチページがサポートされました。
Streamlitは精力的にアップデートが行われ機能が追加されてきています。開発チームの方に感謝です。
では、今回のVersion1.11.0での変更点を見てみましょう。

なにが変わったの？

Version1.11.0での追加・変更点です。

ハイライト

st.tabsでアプリケーションにタブコンテナを追加することが出来る機能が追加されました。

注目すべき変更

st.metricにhelpのツールチップがサポートされました。
st.columnsにカラム間のギャップサイズの設定がサポートされました。

その他の変更

st.selectbox、st.expander、st.spinnerのデザインが微調整されました。
モバイルデバイスでナビゲーションメニューからページを選択するとサイドバーが閉じるようになりました。
st.memoでdataclassesがサポートされました。
高速インタラクションでウィジットの状態が破壊されるレースコンディションのバグを修正しました。
st.tableがカラムやエキスパンダーの中に置かれた時、はみ出したコンテンツがスクロール出来るようになりました。
Stremlitの型アノテーションがさらにアップデートされました。

ハイライト

st.tabs

タブでコンテナを挿入します。
コンテナに要素を追加するのは「with」による記法が推奨されます。

※ すべてのタブのコンテンツは、常にフロントエンドに送信されレンダリングされます。条件付きのレンダリングは現在のところはサポートされていません。

プログラムコード

import streamlit as st

tab1, tab2, tab3, tab4 = st.tabs(["Cat", "Dog", "Fox", "Hamster"])

with tab1:
    st.header("A cat")
    st.write('🐱')
with tab2:
    st.header("A dog")
    st.write('🐶')
with tab3:
    st.header("A fox")
    st.write('🦊')
with tab4:
    st.header('A hamster')
    st.write('🐹')

実行画面

注目すべき変更

st.metricにツールチップがサポートされました

st.metricにhelpパラメータによるツールチップ表示が追加されました。
st.metricは、メトリックを大きな太文字で表示し、オプションでメトリックがどのように変化したかを示すインジケータも表示します。
helpはインプットウィジット (st.inputなど)でもサポートされていたので新しい機能ではありませんがst.metricでもサポートされるようになりました。

プログラムコード

import streamlit as st

st.metric(
    label="釧路の気温(7/14)", 
    value="15 ℃", 
    delta="-0.3 ℃",
    help="v1.11.0にて追加されました。"
)
st.metric(
    label="東京の気温(7/14)", 
    value="28 ℃", 
    delta="+3.2 ℃:",
    help="v1.11.0にて追加されました。"
)

実行画面

st.columnsにカラム間のギャップサイズの設定がサポートされました。

カラム間のギャップのサイズを指定することが出来るようになりました。
指定は「small」「medium」「large」の3種類で指定しない場合は「small」になります。

プログラムコード

import streamlit as st

def col_gap():
    with col1:
        st.header("A cat")
        st.write('🐱')
    with col2:
        st.header("A dog")
        st.write('🐶')
    with col3:
        st.header("A fox")
        st.write('🦊')
    with col4:
        st.header('A hamster')
        st.write('🐹')

col1, col2, col3, col4 = st.columns(4, gap="small")
col_gap()
col1, col2, col3, col4 = st.columns(4, gap="medium")
col_gap()
col1, col2, col3, col4 = st.columns(4, gap="large")
col_gap()

実行プログラム

カラム間のギャップが小・中・大 (small、midium、large)となっています。
未指定の場合はsmallとなります。