🎙️
原生实时波形
波形条由 Swift 和 Kotlin 根据麦克风电平原生绘制，每一帧都不需要运行 JavaScript。
属性
React Native Waveform Recorder带原生实时波形的录音组件
一个适用于 iOS 和 Android 的 Fabric 视图：录音、在 UI 线程绘制波形、预览后继续录音，最后交给你音频文件和可直接用于聊天气泡的 64 条波形数据。
Skip to content
安装
sh
npm install react-native-waveform-recordersh
yarn add react-native-waveform-recordersh
npx expo install react-native-waveform-recorder
npx expo prebuild然后为 iOS 运行 npx pod-install，并添加麦克风使用说明。权限、后台录音和 Expo 配置插件请参阅安装。
录一条语音消息
tsx
import { useRef } from 'react';
import { Button, View } from 'react-native';
import {
WaveformRecorderView,
type WaveformRecorderViewRef,
} from 'react-native-waveform-recorder';
export function VoiceNote() {
const ref = useRef<WaveformRecorderViewRef>(null);
return (
<View>
<WaveformRecorderView
ref={ref}
style={{ height: 56 }}
onComplete={(e) => console.log(e.uri, e.durationMs, e.samples)}
/>
<Button title="录音" onPress={() => ref.current?.start()} />
<Button title="停止" onPress={() => ref.current?.stop()} />
</View>
);
}用姊妹库播放
react-native-waveform-player 用同样风格的胶囊视图来播放音频。把 onComplete.uri 和 onComplete.samples 传给它，播放器就不需要再解码文件。参阅导出数据与播放器。