New Component: Audix - Advanced Audio Player with Waveform Visualization and Time Tracking

Show the Community!
1

Hey Streamlit Community! :wave:

I’m excited to share Audix (streamlit-advanced-audio), a new Streamlit component that enhances audio playback capabilities with modern UI and advanced features! :musical_note:

Why Audix?

While Streamlit’s built-in audio component is great for basic playback, I found myself needing more advanced features for audio processing applications. Audix fills this gap by providing:

  • :ocean: Beautiful waveform visualization
  • :stopwatch: Real-time playback tracking
  • :scissors: Region selection support
  • :art: Extensive styling customization
  • :crescent_moon: Dark mode support

Quick Demo

demo

Installation

pip install streamlit-advanced-audio

Basic Usage

from streamlit_advanced_audio import audix

# Basic playback
audix("path/to/your/audio.wav")

# With custom styling
from streamlit_advanced_audio import WaveSurferOptions

options = WaveSurferOptions(
    wave_color="#2B88D9",
    progress_color="#b91d47",
    height=100
)

result = audix("audio.wav", wavesurfer_options=options)

# Track playback status
if result:
    st.write(f"Current Time: {result['currentTime']}s")
    if result['selectedRegion']:
        st.write(f"Selected Region: {result['selectedRegion']['start']} - {result['selectedRegion']['end']}s")

Features

  • :white_check_mark: Full compatibility with original st.audio API
  • :white_check_mark: Real-time playback information tracking
  • :white_check_mark: Modern UI with extensive customization
  • :white_check_mark: Region selection for timing and trimming
  • :white_check_mark: Dark mode support

Links

Feel free to try it out and let me know what you think! PRs and feature suggestions are welcome! :raised_hands:

2 Likes
2

Yeeeeah, this is dope!

1 Like
3

I’ve deployed this repo in the Streamlit Cloud! https://advanced-audio-example.streamlit.app/

2 Likes