【Streamlit】Tabの使用した表示切替

Streamlitは、シンプルなコードでインタラクティブなアプリケーションを構築できる便利なライブラリです。

streamlit.tabsを使うと、複数のタブを切り替えて情報を整理して表示できます。

streamlit.tabsの使い方について、基本的な使い方から応用例まで詳しく解説します。

Contents

基本的な使い方
応用例
注意点
まとめ

基本的な使い方

st.tabsを使うと、複数のタブを作成できます。それぞれのタブに異なるコンテンツを表示できます。

サンプルコード

import streamlit as st

# タブの作成
tabs = st.tabs(["タブ1", "タブ2", "タブ3"])

# 各タブに表示する内容
with tabs[0]:
    st.header("タブ1の内容")
    st.write("ここにタブ1の詳細情報を記載します。")

with tabs[1]:
    st.header("タブ2の内容")
    st.write("ここにタブ2の詳細情報を記載します。")

with tabs[2]:
    st.header("タブ3の内容")
    st.write("ここにタブ3の詳細情報を記載します。")

実行結果

このコードを実行すると、画面の上部に「タブ1」「タブ2」「タブ3」が表示され、それぞれをクリックすると異なるコンテンツが表示されます。

応用例

動的にタブを作成

タブの数や名前を動的に設定することも可能です。リストや変数を使って柔軟に対応できます。

import streamlit as st

# 動的にタブを生成
tab_names = ["ホーム", "設定", "ヘルプ"]
tabs = st.tabs(tab_names)

# タブに動的な内容を設定
for i, tab in enumerate(tabs):
    with tab:
        st.header(f"{tab_names[i]}の内容")
        st.write(f"ここに{tab_names[i]}の詳細情報を記載します。")

タブで異なるデータ表示

タブを利用して異なるデータセットを表示することもできます。

import streamlit as st
import pandas as pd

# ダミーデータの作成
data1 = pd.DataFrame({"A": [1, 2, 3], "B": [4, 5, 6]})
data2 = pd.DataFrame({"X": [10, 20, 30], "Y": [40, 50, 60]})

tabs = st.tabs(["データセット1", "データセット2"])

with tabs[0]:
    st.header("データセット1")
    st.dataframe(data1)

with tabs[1]:
    st.header("データセット2")
    st.dataframe(data2)