Flutter
Flutter : Membuat Backsound
Faiq Himmah
31 August 2024
1 - Install Package Audio Player
flutter pub add audioplayers2 - Buat Class StatefulWidget
_audioPlayer : objek dari audio player
_listener : objek dari AppLifecycle yang fungsinya untuk pause dan resume backsound saat app minimize dan restore
class PlayState extends State<PlayPage>{
............
late final AppLifecycleListener _listener;
final AudioPlayer _audioPlayer = AudioPlayer();
............
}3 - Buat Method playBackSound()
Pada contoh kode di bawah ini file mp3 diambil dari asset resource. jadi silahkan disesuikan. Untuk mengulang-ulang backsound gunakan ReleaseMode.loop
class PlayState extends State<PlayPage>{
.....................
void playBakcsound()async{
await _audioPlayer.play(AssetSource("sounds/perlude.mp3"));
_audioPlayer.setReleaseMode(ReleaseMode.loop);
}
.....................
}4 - Panggil Method playBackSound() di initState
Agar saat suatu halaman diakses secara otomatis music berjalan tanpa harus ada interaksi tombol misalnya
class PlayState extends State<PlayPage>{
.....................
@override
void initState() {
// TODO: implement initState
super.initState();
playBakcsound();
_listener = AppLifecycleListener(
onPause: () => _audioPlayer.pause(),
onResume: () => _audioPlayer.resume(),
);
}
.....................
}Pada kode diatas terdapat dua event yaitu:
a. onPause : saat app ditutup tanpa proses exit (minimize)
b. onResume : saat aplikasi diakses kembali pasca event pause (minimize)
Sehingga harapannya saat onPause backsound berhenti dan saat resume backsound berjalan lagi
5 - Stop Backsound Saat Keluar Halaman
overide method dispose() dan tambahkan kode seperti dibawah ini
class PlayState extends State<PlayPage>{
.....................
@override
void dispose() {
// TODO: implement dispose
_audioPlayer.stop();
_listener.dispose();
super.dispose();
}
.....................
}
flutter
backsound