Flutter Audio And Video app [Task 1]

Task 1: Flutter App Development

1.Create a flutter app.

2. Use assets (. audios and videos).

3. App will have to play audios and videos from Assets.

4. Also add Features to play audio and video from the Internet(Network).

5. Create buttons like play, pause, and stop for audio and video both.

Introduction

Flutter — a simple and high-performance framework based on Dart language, provides high performance by rendering the UI directly in the operating system’s canvas rather than through native framework.

Flutter also offers many ready to use widgets (UI) to create a modern application. These widgets are optimized for mobile environment and designing the application using widgets is as simple as designing HTML.

Now, Let’s make an App

After discovering the Flutter SDK doesn’t have support for playing audio/music I searched through all of the available packages which were music-related on pub.dev and finalized audioplayers package for audio and flick_video_payer for video playback.

Step 1: Update the pubspec.yaml file with required dependencies.

Dependencies used

Step 2: Make a main.dart file which will be the entry point for the app.

Here I have used a stateless widget with a build widget to enable hot reload functionality of the app.

Step 3: Make home.dart file which will return a material App.

home.dart returns the material app, which has a home set as default Tab controller for Tab functionality, then the child of the DefaultTabController widget is Scaffold which has an App bar widget with the black background color.

The body of the scaffold includes 2 tabs for offline and online music and video functionality.

AudioCache

In order to play Local Assets, you must use the AudioCache class.

Flutter does not provide an easy way to play audio on your assets, but this class helps a lot. It actually copies the asset to a temporary folder in the device, where it is then played as a Local File.

It works as a cache because it keeps track of the copied files so that you can replay them without delay.

You can find the full documentation for this class here.

AudioPlayer audioPlayer = new AudioPlayer();
var ap = new AudioCache(fixedPlayer: audioPlayer);

Then i made an instance of audio player, and passed this as a fixedPlayer in AudioCache which will help us to access all the functionality like play , pause and stop from AudioCache Instance.

Now for playing music online it includes a function playonline .

playonline() async {
ap.clearCache();await audioPlayer.play('https://raw.githubusercontent.com/sparsh308/sample_musics/master/Alan%20Walker%20-%20Faded.mp3');
}

Now for playing music offline it includes a function PlayOffline.

playlocal() {
ap.clearCache();
ap.play('note.wav');
}

for Pause and stop functionality.

pause() {
audioPlayer.pause();
}
stop() {
audioPlayer.stop();
}

Video player Setup

Thank You .