(八)穿越多媒体奇境:探索Streamlit的图像、音频与视频魔法

news/2024/2/21 3:03:25

文章目录

  • 1 前言
  • 2 st.image:嵌入图像内容
    • 2.1 图像展示与描述
    • 2.2 调整图像尺寸
    • 2.3 使用本地文件或URL
  • 3 st.audio:嵌入音频内容
    • 3.1 播放音频文件
    • 3.2 生成音频数据播放
  • 4 st.video:嵌入视频内容
    • 4.1 播放视频文件
    • 4.2 嵌入在线视频
  • 5 结语:走向更高级的Streamlit应用开发

在这里插入图片描述

1 前言

欢迎各位读者来到“最全Streamlit教程”专栏系列!如果您正在寻找一种简单而强大的方式来创建交互式数据应用程序,那么Streamlit无疑是您的最佳选择。作为该领域的热门框架,Streamlit让数据科学家、开发者和爱好者能够以前所未有的速度构建出引人入胜的数据可视化工具。

专栏名称:最全Streamlit教程
在这个专栏中,我们将深入探索Streamlit的各个方面,从入门基础到高级技巧,从数据可视化到交互式应用,无一不涵盖。您将逐步掌握Streamlit的核心概念,并学会如何将其灵活应用于您的项目中。

不论您是数据分析师,机器学习工程师,还是想要将数据与技术相结合的创业者,这个专栏都将为您提供所需的知识和技能,助您成为一名Streamlit的高级使用者。

在本篇博客中,我们将聚焦于Streamlit的媒体元素功能,包括st.image、st.audio和st.video。通过本文,您将了解如何使用这些功能,为您的应用增添图像、音频和视频内容,从而提升用户体验。

2 st.image:嵌入图像内容

在Streamlit应用程序中展示图像内容是增强用户体验的重要一环。Streamlit的st.image函数为您提供了在应用中嵌入图像的便捷方法。通过该函数,您可以轻松地将图像文件或URL集成到应用中,从而为用户呈现各种视觉元素。

2.1 图像展示与描述

让我们从一个简单的示例开始。假设您有一张名为’sunrise.jpg’的图像,您可以使用以下代码将其展示在您的Streamlit应用中:

import streamlit as st
from PIL import Image# 打开图像文件
image = Image.open('sunrise.jpg')# 使用st.image函数展示图像
st.image(image, caption='Sunrise by the mountains')

在这里插入图片描述
在这个示例中,我们首先通过PIL库的Image.open函数打开了一个图像文件。接着,使用st.image函数将图像嵌入到了应用程序中。通过caption参数,您可以为图像添加标题,提供更多信息给用户。这个标题将显示在图像下方。

2.2 调整图像尺寸

除了简单地展示图像,st.image函数还支持调整图像的尺寸。通过width参数,您可以设置图像的显示宽度,从而控制图像在应用中的呈现大小。例如:

st.image(image, caption='Sunrise by the mountains', width=300)

在上述代码中,图像的宽度被设置为300像素,可以根据实际需要进行调整。

2.3 使用本地文件或URL

值得注意的是,您可以通过本地文件路径或者URL来加载图像。如果您想要从网络上加载图像,只需将URL传递给Image.open函数即可。这使得您可以轻松地在应用中展示在线图像资源。

url = 'https://example.com/sunrise.jpg'
image_url = Image.open(url)
st.image(image_url, caption='Sunrise by the mountains')

通过st.image函数,您可以轻松地在Streamlit应用程序中展示图像内容,并为图像添加描述和适当的尺寸。不论是数据可视化、图像处理还是展示项目,嵌入图像将使您的应用更加生动有趣。在接下来的部分中,我们将继续探索其他媒体元素,以丰富您的应用体验。

在下一个章节,我们将深入了解如何使用st.audio函数来嵌入音频内容。

3 st.audio:嵌入音频内容

在Streamlit应用程序中嵌入音频内容是提升用户交互体验的关键之一。Streamlit的st.audio函数使得将音频文件或音频数据嵌入应用变得非常简单。让我们深入了解如何使用这个功能来在您的应用中播放音频。

3.1 播放音频文件

首先,我们来看一个展示如何使用st.audio播放音频文件的示例代码:

import streamlit as st# 打开音频文件
audio_file = open('myaudio.ogg', 'rb')
audio_bytes = audio_file.read()# 使用st.audio函数播放音频
st.audio(audio_bytes, format='audio/ogg')

在这里插入图片描述

在这个示例中,我们使用了open函数打开了一个名为’myaudio.ogg’的音频文件。接着,将音频文件的字节内容传递给st.audio函数,通过format参数指定音频格式。这将在应用中显示一个音频播放器,允许用户播放音频文件。

3.2 生成音频数据播放

除了播放预先录制的音频文件,st.audio还支持播放通过代码生成的音频数据。以下是一个示例代码,展示如何生成一个440Hz的音符并播放:

import streamlit as st
import numpy as npsample_rate = 44100  # 44100 samples per second
seconds = 2  # 音符持续2秒钟
frequency_la = 440  # 音符的频率为440 Hz# 生成时间数组
t = np.linspace(0, seconds, seconds * sample_rate, False)
# 生成440 Hz的正弦波音符
note_la = np.sin(frequency_la * t * 2 * np.pi)# 使用st.audio播放生成的音频
st.audio(note_la, sample_rate=sample_rate)

在上述代码中,我们使用NumPy库生成了一个持续2秒钟的440Hz正弦波音符。通过将生成的音频数据传递给st.audio函数,我们可以在应用中播放这个音符。

请注意,在使用st.audio播放音频数据时,您需要确保提供正确的音频格式和采样率。同时,音频文件或数据的大小可能会影响应用程序的加载和响应时间。确保优化音频内容以提供最佳用户体验。

通过st.audio函数,您可以在Streamlit应用程序中播放音频文件或自动生成的音频数据。无论是为您的数据分析可视化增加声音效果,还是用于教育或娱乐性应用,嵌入音频内容都能丰富您的应用交互性。接下来的部分中,我们将深入探讨st.video函数,让您了解如何嵌入视频内容。

4 st.video:嵌入视频内容

在Streamlit应用程序中嵌入视频内容是吸引用户关注的有效手段之一。Streamlit的st.video函数使得将视频文件或视频数据嵌入到应用中变得非常简单。让我们深入了解如何使用这个功能来在您的应用中展示视频。

4.1 播放视频文件

首先,我们来看一个展示如何使用st.video播放视频文件的示例代码:

import streamlit as st# 打开视频文件
video_file = open('myvideo.mp4', 'rb')
video_bytes = video_file.read()# 使用st.video函数播放视频
st.video(video_bytes)

在这里插入图片描述
在这个示例中,我们使用了open函数打开了一个名为’myvideo.mp4’的视频文件。接着,将视频文件的字节内容传递给st.video函数。这将在应用中嵌入一个视频播放器,允许用户观看视频内容。

请注意,st.video函数支持多种视频格式,但由于不同浏览器和操作系统的差异,一些格式可能会出现兼容性问题。确保选择一种广泛支持的视频格式,以确保您的应用在各种环境中能够正常播放。

4.2 嵌入在线视频

除了播放本地视频文件,st.video还支持通过URL嵌入在线视频。以下是一个示例代码,展示如何通过URL播放YouTube视频:

video_url = 'https://www.youtube.com/watch?v=your_video_id'
st.video(video_url)

在上述代码中,您只需将YouTube视频的URL传递给st.video函数,即可将视频嵌入到应用中。这使得您可以轻松地在应用中展示在线视频资源。

通过st.video函数,您可以在Streamlit应用程序中嵌入本地视频文件或在线视频。不论是为数据可视化增加动态内容,还是在培训或演示中使用视频,嵌入视频内容都能让您的应用更具吸引力。

5 结语:走向更高级的Streamlit应用开发

在本篇技术博客中,我们深入探索了Streamlit框架中的媒体元素功能,包括st.image、st.audio和st.video。通过这些功能,您可以轻松地在您的Streamlit应用程序中嵌入丰富多彩的图像、音频和视频内容,为用户带来更加丰富的交互体验。

通过st.image函数,我们学会了如何展示图像内容,并为图像添加标题和调整尺寸。这使得您的数据可视化和展示项目更具视觉冲击力,为用户带来更好的沉浸式体验。

使用st.audio函数,我们了解了如何嵌入音频文件和自动生成的音频数据。不论是为数据分析结果增添声音效果,还是在教育应用中使用音频提示,嵌入音频内容将为您的应用增添更多维度。

最后,我们深入探讨了st.video函数,了解了如何嵌入本地视频文件和在线视频。这为您提供了在应用中展示动态内容的有效方式,使得您的应用更加生动有趣。

总之,Streamlit作为一款强大而易用的数据应用开发框架,为我们提供了丰富的工具和功能,以快速构建交互式应用。通过熟练使用媒体元素,您能够为您的应用增加更多的多媒体元素,从而让用户体验更加丰富和吸引人。

在本篇博客的示例代码和解释的基础上,您可以进一步探索更多高级功能,如用户输入控件、数据交互、布局调整等。通过不断实践和学习,您将能够创建出更加复杂和功能丰富的Streamlit应用。

感谢您阅读本篇博客!如果您有任何问题、反馈或想法,欢迎在评论区与我互动。期待看到您在未来的项目中运用Streamlit创造出惊艳的交互式应用!不要停止学习和创新,祝您在Streamlit的世界中取得更多的成就。

在这里插入图片描述


http://www.ppmy.cn/news/1019183.html

相关文章

Python-OpenCV中的图像处理-物体跟踪

Python-OpenCV中的图像处理-物体跟踪 物体跟踪 物体跟踪 现在我们知道怎样将一幅图像从 BGR 转换到 HSV 了,我们可以利用这一点来提取带有某个特定颜色的物体。在 HSV 颜色空间中要比在 BGR 空间中更容易表示一个特定颜色。在我们的程序中,我们要提取的…

java,python,c++有什么区别,python java c c++区别

大家好,给大家分享一下java,python,c有什么区别,很多人还不知道这一点。下面详细解释一下。现在让我们来看看! 从这四种语言的难度、受欢迎度还有作用以及优点缺点给楼主做一个全面的分析,我们可以从中了解其区别,以及…

MySQL:表的约束和基本查询

表的约束 表的约束——为了让插入的数据符合预期。 表的约束很多,这里主要介绍如下几个: null/not null,default, comment, zerofill,primary key,auto_increment,unique key 。 空属性 两个值:null&am…

SAP度量单位转换功能

针对今天N2项目提出业务痛点:物料30011110的基本单位是KG,在XXX的BOM里单位是G,由于物料没配单位转换关系,但系统又能正常进行转换,开发需要技术支持。 经专项调查,G和KG的转换是SAP相同量纲转换标准功能&…

搭建window平台的C语言开发环境

1. 安装MSYS2 这是一个包的软件,我理解相当于centos的yum 下载地址: https://www.msys2.org/ 建议安装在C:\Program Files目录下 2. 更新包 管理员权限运行(这个很重要)【C:\Program Files\msys64\mingw64.exe】否则执行命令会…

一个可以通过多个条件筛选的系统界面是如何实现的(springboot+mybatis)

比如我们有一个订单记录管理界面 条件可以通过订单号、商品名称、创建日期范围、价格范围。。。来进行筛选查询。 首先我们先确定数据库订单表(我这里就不做连表了,都放在一个表中)模拟一个订单表 order表 订单号商品名称创建日期价格地址…

java日期常用操作

Testpublic void validateDateUtils(){// 1 字符串转换日期Date result DateUtil.parse("2023-08-01", com.alibaba.excel.util.DateUtils.DATE_FORMAT_10);log.info("result : [{}]" , result);// 2 日期转换字符串final Date date new Date();String f…

大模型“瘦身”进手机 下一个iPhone时刻将至?

一股“端侧大模型”浪潮正在涌来。华为、高通等芯片巨头正探索将AI大模型植入端侧,让手机实现新一代物种进化。 相比ChatGPT、Midjourney等AI应用依赖云端服务器提供服务,端侧大模型主打在本地实现智能化。它的优势在于能够更好地保护隐私,同…

虚拟机报错处理(长期更新 2023.8.10)

目录 一、启动报错1.1 、另一个程序已锁定文件的一部分,进程无法访问 一、启动报错 1.1 、另一个程序已锁定文件的一部分,进程无法访问 报错内容: 处理方案: 找到安装 CentOS 虚拟机本地位置,然后删除以 lck 结尾的文…

07 |「异步任务」

前言 实践是最好的学习方式,技术也如此。 文章目录 前言一、进程与线程1、进程2、线程 二、实现 一、进程与线程 1、进程 进程(Process)是操作系统分配资源的基本单位,它是一个执行中的程序实例;每个进程都有自己独立的内存空间,不同进程的内存是相互独…

计蒜客T1115——字符串判等

水题不解释,考研复习压力偶尔写一道换换心情还不错~ 这里有一个比较有趣的知识点,对于同时输入多个字符串时还要允许空格的输入,那么普通的cin函数就不能满足要求了,这里采用getline函数解决,如下: string …

linux系统虚拟主机开启支持SourceGuardian(sg11)加密组件

注意:sg11我司只支持linux系统虚拟主机自主安装。支持php5.3及以上版本。 1、登陆主机控制面板,找到【远程文件下载】这个功能。 2、远程下载文件填写http://download.myhostadmin.net/vps/sg11_for_linux.zip 下载保存的路径填写/others/ 3、点击控制…

【云原生】Docker 详解(一):从虚拟机到容器

Docker 详解(一):从虚拟机到容器 1.虚拟化 要解释清楚 Docker,首先要解释清楚 容器(Container)的概念。要解释容器的话,就需要从操作系统说起。操作系统太底层,细说的话一两本书都说…

设计模式——单例模式(懒汉和饿汉)

单例模式 一、概念 单例模式是一种对象创建型模式,使用单例模式,可以保证为一个类只生成唯一的实例对象。也就是说,在整个程序空间中,该类只存在一个实例对象。一个类只能有一个实例在生活中是很常见的,比如打印机程…

多语言海外购物商城APP系统(java开源)快速搭建

搭建一个多语言海外购物商城APP系统需要考虑以下几个方面:系统设计、技术架构、多语言支持和快速搭建。 一、系统设计: 1. 市场调研:了解海外购物市场的特点和需求,确定目标用户群体。 2. APP功能设计:根据市场需求&a…

React源码解析18(1)------ React.createElement 和 jsx

1.React.createElement 我们知道在React17版本之前,我们在项目中是一定需要引入react的。 import React from “react” 即便我们有时候没有使用到React,也需要引入。原因是什么呢? 在React项目中,如果我们使用了模板语法JSX&am…

docker删除容器时报错:Error response from daemon: reference does not exist

前言 之前使用的docker版本太低了,升级高版本docker之后的错误。 低版本docker(1.30.1)中的镜像有:golang、mysql,将docker升级为24.0.5并新拉取mysql最新版本之后,执行docker images命令,发现…

题目:2356.每位教师所教授的科目种类

​题目来源: leetcode题目,网址:2356. 每位教师所教授的科目种类的数量 - 力扣(LeetCode) 解题思路: 使用group by 分组聚合后,统计每组中的 subject_id 的不同个数后按要求输出即可。 解题代…

行业追踪,2023-08-09

自动复盘 2023-08-09 凡所有相,皆是虚妄。若见诸相非相,即见如来。 k 线图是最好的老师,每天持续发布板块的rps排名,追踪板块,板块来开仓,板块去清仓,丢弃自以为是的想法,板块去留让…

更优雅地调试SwiftUI—借助LLDB

更优雅地调试SwiftUI—借助LLDB 概述 你是否写过这样的代码: struct ContentView: View {@State private var mySize: CGFloat = 15.0var myString: String = "Hi LLDB"var myArray: [Int] = [1, 2, 3]var body: some View {VStack {Text("Hello World"…
最新文章