Flutter使用audioplayers包开发音乐播放器：上一首与下一首歌曲切换实现问题咨询

Hey there! I’ve built a couple of music players using Flutter and the audioplayers package, so let me break down exactly how to add smooth previous/next track functionality to your app.

Step 1: Set Up Core State Variables #

First, you’ll need to track your playlist, the currently playing track index, and your AudioPlayer instance. If you’re using a StatefulWidget, define these in your state class:

import 'package:audioplayers/audioplayers.dart';

class MusicPlayerScreen extends StatefulWidget {
  const MusicPlayerScreen({super.key});

  @override
  State<MusicPlayerScreen> createState() => _MusicPlayerScreenState();
}

class _MusicPlayerScreenState extends State<MusicPlayerScreen> {
  final AudioPlayer _audioPlayer = AudioPlayer();
  // Replace with your actual track paths/URLs
  List<String> _playlist = [
    "assets/audio/track1.mp3",
    "assets/audio/track2.mp3",
    "assets/audio/track3.mp3",
  ];
  int _currentTrackIndex = 0;
  bool _isPlaying = false;

  @override
  void initState() {
    super.initState();
    // Auto-play next track when current one finishes
    _audioPlayer.onPlayerComplete.listen((_) {
      _playNextTrack();
    });
  }

  @override
  void dispose() {
    _audioPlayer.dispose();
    super.dispose();
  }
}

Step 2: Implement Previous/Next Logic #

Add these helper functions to handle track switching. I’ve included loop-back behavior (so hitting next on the last track jumps to the first, and vice versa) — you can remove that if you don’t want it:

// Switch to next track
void _playNextTrack() {
  setState(() {
    // Loop back to first track if at playlist end
    _currentTrackIndex = (_currentTrackIndex + 1) % _playlist.length;
  });
  _playCurrentTrack();
}

// Switch to previous track
void _playPreviousTrack() {
  setState(() {
    // Loop back to last track if at playlist start
    _currentTrackIndex = (_currentTrackIndex - 1 + _playlist.length) % _playlist.length;
  });
  _playCurrentTrack();
}

// Helper to load and play the track at current index
void _playCurrentTrack() async {
  // Stop existing playback before starting new track
  await _audioPlayer.stop();
  // Adjust source type based on your audio (AssetSource for local files, UrlSource for web links)
  await _audioPlayer.play(AssetSource(_playlist[_currentTrackIndex]));
  setState(() {
    _isPlaying = true;
  });
}

Step 3: Wire Up UI Controls #

Add buttons to your build method that trigger these functions:

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(title: const Text("My Music Player")),
    body: Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Text("Now Playing: Track ${_currentTrackIndex + 1}", style: const TextStyle(fontSize: 18)),
          const SizedBox(height: 30),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              IconButton(
                icon: const Icon(Icons.skip_previous),
                iconSize: 40,
                onPressed: _playPreviousTrack,
              ),
              IconButton(
                icon: Icon(_isPlaying ? Icons.pause : Icons.play_arrow),
                iconSize: 40,
                onPressed: () async {
                  if (_isPlaying) {
                    await _audioPlayer.pause();
                  } else {
                    await _audioPlayer.resume();
                  }
                  setState(() => _isPlaying = !_isPlaying);
                },
              ),
              IconButton(
                icon: const Icon(Icons.skip_next),
                iconSize: 40,
                onPressed: _playNextTrack,
              ),
            ],
          ),
        ],
      ),
    ),
  );
}

Key Enhancements & Notes #

• Audio Source Flexibility: If your tracks are hosted online, replace AssetSource with UrlSource and pass the track URL instead of a local asset path.
• Error Handling: Wrap the _playCurrentTrack logic in a try/catch block to handle cases where a track fails to load (e.g., broken URL, missing local file).
• Custom Song Model: For a more polished player, create a Song class with properties like title, artist, and album art instead of using a simple list of strings.
• Shuffle Mode: To add shuffle functionality, you can generate a randomized version of your playlist and track the original order if you want to revert to sequential play.

内容的提问来源于stack exchange，提问作者Digamber negi