speed playback from array
This commit is contained in:
parent
0154c5a5b2
commit
eb33ce3688
|
@ -4,21 +4,22 @@ import Touchable from 'react-native-platform-touchable';
|
|||
|
||||
import styles from './styles';
|
||||
import { useTheme } from '../../theme';
|
||||
import { AVAILABLE_SPEEDS } from './utils';
|
||||
|
||||
const PlaybackSpeed = ({
|
||||
onChange,
|
||||
loaded = false,
|
||||
rate = 1
|
||||
rateIndex = 0
|
||||
}: {
|
||||
onChange: (value: number) => void;
|
||||
loaded: boolean;
|
||||
rate: number;
|
||||
rateIndex: number;
|
||||
}) => {
|
||||
const { colors } = useTheme();
|
||||
|
||||
const onPress = () => {
|
||||
const nextRate = rate === 2 ? 0.5 : rate + 0.5;
|
||||
onChange(nextRate);
|
||||
const nextRateIndex = rateIndex >= AVAILABLE_SPEEDS.length ? 0 : rateIndex + 1;
|
||||
onChange(AVAILABLE_SPEEDS[nextRateIndex]);
|
||||
};
|
||||
|
||||
return (
|
||||
|
@ -27,7 +28,7 @@ const PlaybackSpeed = ({
|
|||
onPress={onPress}
|
||||
style={[styles.containerPlaybackSpeed, { backgroundColor: colors.buttonBackgroundSecondaryDefault }]}
|
||||
>
|
||||
<Text style={[styles.playbackSpeedText, { color: colors.buttonFontSecondary }]}>{rate}x</Text>
|
||||
<Text style={[styles.playbackSpeedText, { color: colors.buttonFontSecondary }]}>{AVAILABLE_SPEEDS[rateIndex]}x</Text>
|
||||
</Touchable>
|
||||
);
|
||||
};
|
||||
|
|
|
@ -11,6 +11,7 @@ import Seek from './Seek';
|
|||
import PlaybackSpeed from './PlaybackSpeed';
|
||||
import PlayButton from './PlayButton';
|
||||
import audioPlayer from '../../lib/methods/audioPlayer';
|
||||
import { AVAILABLE_SPEEDS } from './utils';
|
||||
|
||||
interface IAudioPlayerProps {
|
||||
fileUri: string;
|
||||
|
@ -28,7 +29,7 @@ const AudioPlayer = ({
|
|||
onPressCallback = () => {}
|
||||
}: IAudioPlayerProps) => {
|
||||
const [paused, setPaused] = useState(true);
|
||||
const [rate, setRate] = useState(1);
|
||||
const [rateIndex, setRateIndex] = useState(0);
|
||||
|
||||
const duration = useSharedValue(0);
|
||||
const currentTime = useSharedValue(0);
|
||||
|
@ -63,7 +64,7 @@ const AudioPlayer = ({
|
|||
if (currentSecond <= durationSeconds) {
|
||||
currentTime.value = currentSecond;
|
||||
}
|
||||
setRate(data.rate);
|
||||
setRateIndex(AVAILABLE_SPEEDS.indexOf(data.rate));
|
||||
}
|
||||
};
|
||||
|
||||
|
@ -142,7 +143,7 @@ const AudioPlayer = ({
|
|||
<View style={[styles.audioContainer, { backgroundColor: colors.surfaceTint, borderColor: colors.strokeExtraLight }]}>
|
||||
<PlayButton disabled={disabled} loading={loading} paused={paused} isReadyToPlay={isReadyToPlay} onPress={onPress} />
|
||||
<Seek currentTime={currentTime} duration={duration} loaded={!disabled && isReadyToPlay} onChangeTime={setPosition} />
|
||||
<PlaybackSpeed onChange={onChangeRate} loaded={!disabled && isReadyToPlay} rate={rate} />
|
||||
<PlaybackSpeed onChange={onChangeRate} loaded={!disabled && isReadyToPlay} rateIndex={rateIndex} />
|
||||
</View>
|
||||
</>
|
||||
);
|
||||
|
|
Loading…
Reference in New Issue