A <WaveformSeekBar />
component for React-Native
- iOS, Not started
- Android, use massoudss/WaveformSeekBar
npm install react-native-waveform-seekbar
import WaveformSeekBar from "react-native-waveform-seekbar";
// ./example/src/App.tsx
<WaveformSeekBar
style={styles.box}
data={data}
backgroundColor="#fff"
progressColor={'yellow'}
onChange={(e) => console.log(e.nativeEvent)}
/>
import React from 'react';
import { ViewStyle, StyleProp, NativeSyntheticEvent } from 'react-native';
export declare type OnChangeEvent = (e: NativeSyntheticEvent<{
progress: number;
fromUser: boolean;
}>) => void;
export declare type WaveformSeekBarProps = {
style: StyleProp<ViewStyle>;
data: number[];
progress?: number;
maxProgress?: number;
visibleProgress?: number;
waveWidth?: number;
gap?: number;
minHeight?: number;
radius?: number;
backgroundColor?: number;
progressColor?: number;
gravity?: 'top' | 'center' | 'bottom';
onChange?: OnChangeEvent;
};
export interface Props extends Omit<WaveformSeekBarProps, 'backgroundColor' | 'progressColor'> {
backgroundColor?: string;
progressColor?: string;
}
export declare const WaveformSeekBar: React.FC<Props>;
See the contributing guide to learn how to contribute to the repository and the development workflow.
MIT