react-native-sound-player 未在 UI 中显示控件

Posted 2023-02-25

【中文标题】react-native-sound-player 未在 UI 中显示控件

【英文标题】：react-native-sound-player not showing controls in UI

【发布时间】：2019-06-27 13:11:43

【问题描述】：

我已将以下库集成到我的 react 本机项目中以播放来自 URL 的音频。

https://www.npmjs.com/package/react-native-sound-player

工作正常，但是没有显示媒体控件（播放/暂停/进度条）

它只是在播放音频。

import SoundPlayer from 'react-native-sound-player'


    try 
        // or play from url
        SoundPlayer.playUrl('https://example.com/music.mp3')
     catch (e) 
        console.log(`cannot play the sound file`, e)
    

有什么建议吗？

【参考方案1】：

查看文档，该库中似乎没有 UI 组件。

您可能必须自己渲染按钮并在其上附加 onPress 函数。

喜欢：

<Button 
    onPress=()=>SoundPlayer.playUrl('https://example.com/music.mp3') 
    title="Play"
/>

【讨论】：

但是，我必须显示进度条（滑块）、播放/暂停/停止、标题。而且我也必须在后台状态下播放音频。我是 react-native 的新手

如前所述，您必须自己创建组件，并使用该库为您提供的功能，创建一个显示播放器的 UI。滑块、播放、暂停和其他一切都不是使用这个单一库开箱即用的，但是可以根据需要创建它们并设置它们的样式

该用户界面的任何示例？

尝试按照这篇文章创建用户界面：hackernoon.com/…，使用你在 react-native-sound-player 中的功能你应该可以创建它

已编辑，立即尝试