Flutter BLoC Video Chat App

This is a Flutter video chat app using BLoC state management with a backend using Laravel. This will include some cool features which covers both video and voice calling along with text and image sending

Another main feature of this app is that, you can send notification both for audio and video calling. If someone called you you will get notification and the other person will have to wait until you receive it. Both end will have calling sound. It's a custom sound.

Cool features of the app

video chat
voice chat
text chat
sending images
sending stickers
save chat in the local database
sync local database with remote database
both laravel and firebase backend
notification is send first as you do video
notification number and icons based on your chat message number
notification is received even if the app is killed
user need to tap on the button to accept the video call
notification is send first as you do voice call
there's sound on the other side as you call
caller also can hear the sound
every text message has notification
call ends automitically as you hang up the call
phone number message verification
show call time
show call duration
clear message when you open message screen
multi line mesagge box as you type more
auto hide of message box as you are done
audio video controller (buttons)

Some features, we were not able to record sound in the screen recording of iOS device.

Get the complete app from here

Buymecoffee link

Download the apk video chat

Starter code

Technology used in this app

Flutter framework
Firebase service
Agora SDK
Laravel framework

The whole architecture is based on Flutter framework. We used Firebase service for chatting and storing user chat information including texts and images.

We used Agora SDK for video chat and voice chat.

We used Laravel Framework for basic backend service and where you can video basic user data.

Laravel Backend

The backend is mostly used for to know how many users do you have and who they are. You may also maintain them from there.

Backend installation requirement

prepare a domain
have it with SSL
PHP verion 7.4 or higher
MySQL version 5.7 or higher

App Deployment Locally

create a new flutter project
copy all the files and folers like lib, assets and pubspec.yaml from the downloaded project in your new project
make sure you create a firebase project with above project from terminal
you need to make sure you connect this app with your own firebase project
make sure you generate SHA1 and SHA256 key with your project
create an account with Agora video sdk
install the laravel application
make sure that you have SSL with your domain
make sure you replace the App ID and App Certificate

Why use third party SDK

The reason why we use third party SDK to do it, because Flutter does not provide any higher level API to connect with video technology like WebRTC.

If a small team or some students try to do it, it would be almost very difficult to get the job done. Even if they do it, the video signal would be very bad and shaky. Apart from them they have to build up their own server to send the video signals to different users in different country.

They also need to spend thousands of dollars for building servers and decoding the signal.

Third party SDK solves these problems since they are dedicated to do it and they have a very big team to get the job done.

In this app, the way used it here is an example. It requires PHP and Agora integration.

Notification

See how notification works. It should be coming from your app to your server to your firebase account to your user. For this reason we have integrated Firebase Admin SDK with PHP.