Flutter Task-1 (Audio & Video Player)
Flutter?
Flutter is a free and open-source mobile UI framework created by Google and released in May 2017. In a few words, it allows you to create a native mobile application with only one codebase. This means that you can use one programming language and one codebase to create two different apps (for iOS and Android).
Flutter consists of two important parts:
- An SDK (Software Development Kit): A collection of tools that are going to help you develop your applications. This includes tools to compile your code into native machine code (code for iOS and Android).
- A Framework (UI Library based on widgets): A collection of reusable UI elements (buttons, text inputs, sliders, and so on) that you can personalize for your own needs.
To develop with Flutter, you will use a programming language called Dart. The language was created by Google in October 2011, but it has improved a lot over these past years.
Dart focuses on front-end development, and you can use it to create mobile and web applications.
???? Flutter App Development ????
Problem Statement:
1. Create a flutter app.
2. Use assets (eg. audios and videos).
3. The app will have to play the 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.
Prerequisites: Flutter installed and added in the path. Dart installed and added in the path. Android Studio is downloaded and properly installed with SDK and required plugins. Android emulator or mobile phone to run the app, here AVD.Visual Studio code with flutter and dart extension installed in it. I used AVD-Nexus 5X API 28 P1
How to create an app in Flutter?
Start Visual Studio Code and go the folder where you want to save the app. Here, I saved the app in the same folder where I have dart-SDK. Run the following command in the CLI of VSCode.You can give any name to your app. I used EUPHONY??
flutter create euphony
Now open the folder through explorer or File. Head into main.dart file in the lib folder. This is the main coding file. This file contains a basic flutter app code. When you run this code, it will launch a basic app with a counter and a floating icon.
Packages?
Packages are published to pub.dev.The Flutter landing page on pub.dev displays top packages that are compatible with Flutter (those that declare dependencies generally compatible with Flutter), and supports searching among all published packages.
Open the pubspec.yaml file located inside the app folder, and the required dependencies' name under dependencies: .
Packages Used:
Setup:
Created 6 .dart files to have a descriptive and robust structure.main.dart holds the main method that calls the required classes.
Used: Container, Widget, FlatButton, BoxDecoration, Scaffold, AppBar, Text, TextStyle, WebView, MaterialPageRoute, VideoPlayerController, IQTheme, Column, Row, Navigator, and so on.
Created assets folder that contains images folder containing all the images to be used in the app. The assets folder also contains all the videos to be played and used in the app offline, locally. The path of each of these assets is provided in the pubspec.yaml file then.
?? EUPHONY??
The home page of the app. That contains 4 flat buttons: Play Offline, Watch Offline, Play Online(Gaana) and Watch Online(Youtube).
This is the Play Offline Page of the App. It contains offline songs that one can play, pause, or stop.
This is the Watch Offline Page. This contains offline videos that can be played.
Furthermore, there are Watch Online and Play Online pages each leading to the WebView of Youtube and Gaana respectively.
Working:
Github for code and assets: https://github.com/TanyaChetnaVaish/Fluttertask1
?