首页 > 解决方案 > 如何在颤振中添加音频播放器插件?

问题描述

您好,我和我的团队正在尝试创建一个应用程序,如果用户单击提升的按钮,则应该播放链接。在过去的 20 天里,我们正在尝试使用音频播放器插件来做到这一点。我们只会遇到错误和问题。我还在下面添加整个应用程序文件。抱歉,按钮中的链接和另一个变量中的歌曲名称。应用程序链接 - drive-link main.dart

import 'dart:async';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:audioplayers/audioplayers.dart';

void main() {
  runApp(SampleApp());
}

class SampleApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        brightness: Brightness.dark,
      ),
      title: 'Random Songs Picker',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Random Songs Picker'),
        ),
        body: Container(
          alignment: Alignment.bottomCenter,
          child: TextChanger(),
        ),
      ),
    );
  }
}

class TextChanger extends StatefulWidget {

  MainTextChanger createState() => MainTextChanger();
}

class MainTextChanger extends State {
  final List name1 =  ['song1','https://firebasestorage.googleapis.com/v0/b/sample-app-2a74f.appspot.com/o/Cartoon%20-%20On%20_%20On%20(feat.%20Daniel%20Levi)%20_NCS%20Release_.mp3?alt=media&token=58fb526e-8f10-46f2-9679-7c6da839da4f'];
  final List name2 =  ['song2','song2 link'];
  final List name3 =  ['song3','song3 link'];
  final List name4 =  ['song4','song4 link'];
  final List name5 =  ['song5','song5 link'];
  var mainList = [['namef','link']];
  // bool playingTF = false;
  // IconData playBtn = Icons.play_arrow;

  AudioPlayer aplayer  = AudioPlayer();
  // url 

  playAudio(url) async {
    int resultt = await aplayer.play(url);
  }

  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        SizedBox(height: 100,),
        Container(
          child: ElevatedButton(
            onPressed: () {
              var url = name1[1];
              playAudio('https://firebasestorage.googleapis.com/v0/b/sample-app-2a74f.appspot.com/o/Cartoon%20-%20On%20_%20On%20(feat.%20Daniel%20Levi)%20_NCS%20Release_.mp3?alt=media&token=58fb526e-8f10-46f2-9679-7c6da839da4f');
            },
            style: ElevatedButton.styleFrom(
              primary: Colors.black, // Background color
              onPrimary: Colors.white, // Foreground color
              padding: EdgeInsets.all(15.0), // Box padding
            ),
            child: Text(
              //mainList,
              mainList[0][0],
              style: TextStyle(
                fontSize: 22,
              ),
            ),
          ),
        ),
        SizedBox(height: 10,),
        Container(
          child: ElevatedButton(
            onPressed: () {},
            style: ElevatedButton.styleFrom(
              primary: Colors.black, // Background color
              onPrimary: Colors.white, // Foreground color
              padding: EdgeInsets.all(15.0), // Box padding
            ),
            child: Text(
              name2[0],
              style: TextStyle(
                fontSize: 22,
              ),
            ),
          ),
        ),
        SizedBox(height: 10,),
        Container(
          child: ElevatedButton(
            onPressed: () {},
            style: ElevatedButton.styleFrom(
              primary: Colors.black, // Background color
              onPrimary: Colors.white, // Foreground color
              padding: EdgeInsets.all(15.0), // Box padding
            ),
            child: Text(
              name3[0],
              style: TextStyle(
                fontSize: 22,
              ),
            ),
          ),
        ),
        SizedBox(height: 10,),
        Container(
          child: ElevatedButton(
            onPressed: () {},
            style: ElevatedButton.styleFrom(
              primary: Colors.black, // Background color
              onPrimary: Colors.white, // Foreground color
              padding: EdgeInsets.all(15.0), // Box padding
            ),
            child: Text(
              name4[0],
              style: TextStyle(
                fontSize: 22,
              ),
            ),
          ),
        ),
        SizedBox(height: 10,),
        Container(
          child: ElevatedButton(
            onPressed: () {},
            style: ElevatedButton.styleFrom(
              primary: Colors.black, // Background color
              onPrimary: Colors.white, // Foreground color
              padding: EdgeInsets.all(15.0), // Box padding
            ),
            child: Text(
              name5[0],
              style: TextStyle(
                fontSize: 22,
              ),
            ),
          ),
        )
      ],
    );
  }
}

发布规范.yaml

name: sample_app
description: A new Flutter project.

# The following line prevents the package from being accidentally published to
# pub.dev using `pub publish`. This is preferred for private packages.
publish_to: 'none' # Remove this line if you wish to publish to pub.dev

# The following defines the version and build number for your application.
# A version number is three numbers separated by dots, like 1.2.43
# followed by an optional build number separated by a +.
# Both the version and the builder number may be overridden in flutter
# build by specifying --build-name and --build-number, respectively.
# In Android, build-name is used as versionName while build-number used as versionCode.
# Read more about Android versioning at https://developer.android.com/studio/publish/versioning
# In iOS, build-name is used as CFBundleShortVersionString while build-number used as CFBundleVersion.
# Read more about iOS versioning at
# https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html
version: 1.0.0+1

environment:
  sdk: ">=2.7.0 <3.0.0"


dependencies:
  flutter:
    sdk: flutter
  # The following adds the Cupertino Icons font to your application.
  # Use with the CupertinoIcons class for iOS style icons.
  cupertino_icons: ^1.0.2
  audioplayers: ^0.19.1

dev_dependencies:
  flutter_test:
    sdk: flutter

# For information on the generic Dart part of this file, see the
# following page: https://dart.dev/tools/pub/pubspec

# The following section is specific to Flutter.
flutter:

  # The following line ensures that the Material Icons font is
  # included with your application, so that you can use the icons in
  # the material Icons class.
  uses-material-design: true

  # To add assets to your application, add an assets section, like this:
  # assets:
  #   - images/a_dot_burr.jpeg
  #   - images/a_dot_ham.jpeg

  # An image asset can refer to one or more resolution-specific "variants", see
  # https://flutter.dev/assets-and-images/#resolution-aware.

  # For details regarding adding assets from package dependencies, see
  # https://flutter.dev/assets-and-images/#from-packages

  # To add custom fonts to your application, add a fonts section here,
  # in this "flutter" section. Each entry in this list should have a
  # "family" key with the font family name, and a "fonts" key with a
  # list giving the asset and other descriptors for the font. For
  # example:
  # fonts:
  #   - family: Schyler
  #     fonts:
  #       - asset: fonts/Schyler-Regular.ttf
  #       - asset: fonts/Schyler-Italic.ttf
  #         style: italic
  #   - family: Trajan Pro
  #     fonts:
  #       - asset: fonts/TrajanPro.ttf
  #       - asset: fonts/TrajanPro_Bold.ttf
  #         weight: 700
  #
  # For details regarding fonts from package dependencies,
  # see https://flutter.dev/custom-fonts/#from-packages

标签: flutterandroid-studiodartflutter-dependencies

解决方案


试试下面的代码,希望对你有帮助。在您的 pubspec.yaml 文件依赖项上添加 audioplayer 依赖项

创建 audioPlay 函数,如:

 playSound(){
   audioPlayer.play('your audio url here');
 }

创建按钮小部件,如:

TextButton(child:'Play',
   onPressed:playSound(),
),

推荐阅读