Flutter音频播放插件 radio_player 的使用

radio_player 是一个用于播放流媒体音频内容的Flutter插件，支持后台播放和锁屏控制。本文将介绍如何在你的Flutter项目中安装和使用这个插件。

安装

首先，在你的 pubspec.yaml 文件中添加 radio_player 作为依赖项：

dependencies:
  radio_player: ^1.7.0

iOS 特定配置

默认情况下，iOS禁止从非HTTPS URL加载内容。为了取消此限制，请编辑你的 .plist 文件并添加以下内容：

<key>NSAppTransportSecurity</key>
<dict>
    <key>NSAllowsArbitraryLoads</key>
    <true/>
</dict>

如果你需要在后台播放音频，请确保添加以下权限：

<key>UIBackgroundModes</key>
<array>
    <string>audio</string>
    <string>processing</string>
</array>

使用

初始化 RadioPlayer 实例

创建 RadioPlayer 实例非常简单，只需调用构造函数即可：

RadioPlayer radioPlayer = RadioPlayer();

配置频道

使用 setChannel 方法来设置频道信息，包括标题、URL和封面图片路径（可选）：

radioPlayer.setChannel(
  title: 'Radio Player',
  url: 'http://stream-uk1.radioparadise.com/aac-320',
  imagePath: 'assets/cover.jpg',
);

播放控制

你可以使用 play() 和 pause() 方法来控制播放：

radioPlayer.play();
radioPlayer.pause();

状态事件监听

通过监听状态流，可以知道当前是否正在播放：

bool isPlaying = false;

radioPlayer.stateStream.listen((value) {
  setState(() { isPlaying = value; });
});

元数据事件监听

元数据事件返回当前播放音频的元数据信息：

List<String>? metadata;

radioPlayer.metadataStream.listen((value) {
  setState(() { metadata = value; });
});

可以通过 getArtworkImage() 方法获取元数据中的封面图片。

示例 Demo

下面是一个完整的示例代码，展示了如何集成 radio_player 插件到你的Flutter应用中：

import 'package:flutter/material.dart';
import 'package:radio_player/radio_player.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  RadioPlayer _radioPlayer = RadioPlayer();
  bool isPlaying = false;
  List<String>? metadata;

  @override
  void initState() {
    super.initState();
    initRadioPlayer();
  }

  void initRadioPlayer() {
    _radioPlayer.setChannel(
      title: 'Radio Player',
      url: 'http://stream-uk1.radioparadise.com/aac-320',
      imagePath: 'assets/cover.jpg',
    );

    _radioPlayer.stateStream.listen((value) {
      setState(() {
        isPlaying = value;
      });
    });

    _radioPlayer.metadataStream.listen((value) {
      setState(() {
        metadata = value;
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          centerTitle: true,
          title: const Text('Radio Player'),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              FutureBuilder(
                future: _radioPlayer.getArtworkImage(),
                builder: (BuildContext context, AsyncSnapshot snapshot) {
                  Image artwork;
                  if (snapshot.hasData) {
                    artwork = snapshot.data;
                  } else {
                    artwork = Image.asset(
                      'assets/cover.jpg',
                      fit: BoxFit.cover,
                    );
                  }
                  return Container(
                    height: 180,
                    width: 180,
                    child: ClipRRect(
                      child: artwork,
                      borderRadius: BorderRadius.circular(10.0),
                    ),
                  );
                },
              ),
              SizedBox(height: 20),
              Text(
                metadata?[0] ?? 'Metadata',
                softWrap: false,
                overflow: TextOverflow.fade,
                style: TextStyle(fontWeight: FontWeight.bold, fontSize: 24),
              ),
              Text(
                metadata?[1] ?? '',
                softWrap: false,
                overflow: TextOverflow.fade,
                style: TextStyle(fontWeight: FontWeight.bold, fontSize: 16),
              ),
              SizedBox(height: 20),
            ],
          ),
        ),
        floatingActionButton: FloatingActionButton(
          onPressed: () {
            isPlaying ? _radioPlayer.pause() : _radioPlayer.play();
          },
          tooltip: 'Control button',
          child: Icon(
            isPlaying ? Icons.pause_rounded : Icons.play_arrow_rounded,
          ),
        ),
      ),
    );
  }
}

以上就是如何使用 radio_player 插件的基本介绍和示例代码。希望这能帮助你快速上手并集成到你的项目中！