-
Notifications
You must be signed in to change notification settings - Fork 286
Closed as not planned
Closed as not planned
Copy link
Description
Versions
Expo: ~51.0.17
Expo-av: ~14.0.6
React: 18.2.0
React-Native: 0.74.3
@react-native-community/slider: 4.5.2
Demonstration
https://drive.google.com/file/d/1A3suBjpINpGPBf7SGFsFvMffCd_lVz6e/view?usp=sharing
Implementation
This is not exact code as-is in the app, just the bits that matter
SoundControlContext.js
import Slider from "@react-native-community/slider";
import { useSound } from './SoundProvider.js';
const {soundDuration, positionMillis, handleSoundPan} = useSound()
const handleSliding = async (value) => {
handleSoundPan(value)
}
<Slider onSlidingComplete={(value) => {handleSliding(value)}}
style={{width: '75%', height: 32}}
minimumValue={0}
maximumValue={soundDuration }
value={ positionMillis }
thumbTintColor="#F7F7FF"
minimumTrackTintColor="#F7F7FF"
maximumTrackTintColor="#dcdce6"/>
SoundProvider.js
import { Audio } from "expo-av";
const sound = useRef(new Audio.Sound())
const [positionMillis, setPositionMillis] = useState(0);
sound.current.setOnPlaybackStatusUpdate((status) => {
handleSoundStatus(status)
})
await sound.current.setProgressUpdateIntervalAsync(1000)
const handleSoundPan = async (position) => {
await sound.current.setPositionAsync(position)
}
const handleSoundStatus = async (status) => {
if (status.durationMillis != soundDuration || soundDuration == 0) {
setSoundDuration(await status.durationMillis)
}
setPositionMillis(await status.positionMillis)
....
}
risafj, akbarnurullaev, JennieCrowel, sanchaz, IvanIhnatsiuk and 1 morefarynaio
Metadata
Metadata
Assignees
Labels
No labels