Streamlitの「スライダー」は、インタラクティブなUIを構築するうえで便利なウィジェットの一つです。
この記事では、st.sliderの基本的な使い方をまとめます。
Contents
基本的な使い方
スライダーは数値や日付の範囲を直感的に選択できるUI部品です。
import streamlit as st
age = st.slider("年齢を選んでください", 0, 120, 30)
st.write(f"選択した年齢: {age}")
- “年齢を選んでください”: ラベル
- 0: 最小値
- 120: 最大値
- 30: 初期値（デフォルト値）
範囲を選ぶスライダー（Range Slider）
複数の値（例：最小値と最大値）を選ばせたい場合は、タプルを渡します。
start, end = st.slider("範囲を選択", 0, 100, (25, 75))
st.write(f"選択された範囲: {start} 〜 {end}")
(25, 75)のような初期値を指定すると、範囲スライダーになります。
ステップ幅の指定
スライダーの増減の間隔を細かく制御できます。
value = st.slider("ステップ幅を指定", 0, 100, 50, step=5)
st.write(f"選択された値: {value}")
step=5 により、5刻みで値を選べるようになります。
浮動小数点のスライダー
整数だけでなく、小数も扱えます。
value = st.slider("小数点の選択", 0.0, 1.0, 0.25, step=0.05)
st.write(f"選択された値: {value}")日付を選ぶスライダー
日付の範囲を選択することもできます。
import datetime
start_date = datetime.date(2023, 1, 1)
end_date = datetime.date(2023, 12, 31)
default_date = datetime.date(2023, 6, 1)
date = st.slider("日付を選択", min_value=start_date, max_value=end_date, value=default_date)
st.write(f"選択された日付: {date}")
時間を選ぶスライダー
日時（datetime.datetime）や時刻（datetime.time）も指定可能です。
import datetime
time = st.slider("時間を選択",
min_value=datetime.time(9, 0),
max_value=datetime.time(18, 0),
value=datetime.time(12, 0),
step=datetime.timedelta(minutes=15))
st.write(f"選択された時刻: {time}")
スライダーの初期値を条件付きで変える
アプリの状態に応じて初期値を動的に決めると、UXが向上します。
import datetime
now = datetime.datetime.now()
default = now.replace(hour=15, minute=0)
selected_time = st.slider("今日の予定時間",
min_value=now.replace(hour=9, minute=0),
max_value=now.replace(hour=18, minute=0),
value=default)
st.write(f"選択した時間: {selected_time}")
スライダーの用途例
- 数値フィルター：売上範囲、年齢層など
- 日付選択：期間フィルター、イベント日時の設定
- パラメータ調整：モデルの閾値や学習率、表示範囲の調整
- インタラクティブなグラフ作成：グラフにスライダー連動することで操作性アップ
まとめ
| 機能 | 使用例 |
|---|---|
| 数値の単一選択 | st.slider("X", 0, 100, 50) |
| 数値の範囲選択 | st.slider("X", 0, 100, (10, 90)) |
| 小数 | st.slider("X", 0.0, 1.0, 0.5) |
| ステップ幅の設定 | step=5 など |
| 日付・時間の選択 | datetime.date/time を使用 |
Streamlitのスライダーは、インタラクティブなアプリ開発の重要な要素となります。
