Whoxa – Whatsapp Clone Flutter Android & iOS App With Admin Panel
Whoxa flutter App documentation version 2.0.2(21/04/2022)
Introduction
- Item Name : Whoxa – Whatsapp Clone Flutte Android & iOS App
- Item Version : v 2.0.2
- Author : Primocys
- Support Or Contact : https://www.primocys.com/contact
- Mail : primocys@gmail.com
- Skype : arpansagar451
Whoxa Whatsapp clone Social Android and iOS App built in Flutter and Firebase. You can reuse more than 120+ widgets to customize your application.
First of all, Thank you so much for purchasing this App and for being our loyal customer.
You are awesome!
You are entitled to get free lifetime updates to this product + exceptional support from the author directly.
This documentation is to help you regarding each step of customization. Please go through the documentation carefully to understand how this template is made and how to edit this properly. Basic Flutter Android and iOS app setup knowledge is required to configure or customize this App. You may learn basics here, here.
Requirements
You will need the following sofwares to open this App.
- Visual Studio Code (https://code.visualstudio.com/)
- Xcode (iOS final Submit build)
- Firebase Account
- Agora Account for Audio/Video Call
Be careful while Customize the App. If not edited properly, the design layout may break completely.
No support is provided for faulty customization.
Create a Firebase Project #back to top
Firebase is Google's mobile platform that helps you quickly develop high-quality apps and grow your business. Use Firebase products together to solve complex challenges and optimize your app experience. Personalize your onboarding flow, grow user engagement, or add new functionality with Firebase.
Get a Installation Service Ask a Question
Next up, we’re given the option to enable Google Analytics. It isn’t directly necessary for what we’re trying to do, so do whatever feels right for your use-case here.
After a relatively painless setup process, we should now be navigated to the dashboard for our project.
Phone OTP Configure with Firebase #back to top
Add SHA-1 and SHA-256 On Your Android Project
You should find the Project Setting and General Tab.
How to Generate SHA-1 and SHA-256?
Step 1
Open Terminal. Go to in Project and Open path program>java>jdk>bin in your terminal.
Step 2
Run the command in above mentioned path.
keytool -list -v -keystore "C:\Users\PC\.android\debug.keystore" -alias androiddebugkey -storepass android -keypass android
How to Do Agora setup with the app? #back to top
Agora Setup
You can create your Agora account with free version. You can create from here: Agora Account
Step 1
Go to in Project and Open path lib/constatnt/Constant.dart
Step 2
Change Agora App ID with your project Agora ID.
const String APP_ID = "YOUR APP ID"
Add Google JSON file. #back to top
How to add google-services.json in Android?
The most important thing here is to match up the Android package name that you choose here with the one inside of our application. The structure of this is done like so: com.example.app.
The next step is to add the Firebase configuration file into Your Flutter Android project. This is important as it contains the API keys and other critical information for Firebase to use.
Select “Download google-services.json” from this page.
Once you’ve got this, take the file and place it inside of the android/app directory within the Flutter project and it must replace the existing one.
How to add google-services.json in iOS?
The most important thing here is to match up the iOS package name that you choose here with the one inside of our application. The structure of this is done like so: com.example.app.
The next step is to add the Firebase configuration file into Your Flutter iOS project. This is important as it contains the API keys and other critical information for Firebase to use.
Download GoogleService-Info.plist and drag this into the root of your Xcode project within Runner.
It's important that you don't simply drag this into the folder without going through Xcode, as this will not work..
Flutter Android and iOS App #back to top
Mobile app developed using a flutter framework created by Google is open-source mobile application development. It is used to develop applications for Android and iOS, as well as being the primary method of creating applications
Requirements
To edit this project you must have Flutter and Dart installed and configured successfully on your device Install flutterSet up your editor Install the Flutter and Dart plugins
Get a Installation Service Ask a Question
Get Started
1- Download and unzip the Flutter App, use your preferred IDE (Android Studio / Visual Code / IntelliJ) to open the project.
2 - Add Firebase Google json/plist file in specifically androidn/iOS folders as explained above.
3 - Open pubspec.yaml, Change below code with your logo image name.
flutter_icons:
image_path: "assets/images/applogo.png"
android: true
ios: true
4 -Run the following command..
flutter pub run flutter_launcher_icons:main
Android Configuration #back to top
Get Dependencies
1. And just run the following command.
flutter pub getChange Package Name
2. Go to Folder android>app>src>main>AndroidManifest.xmland change the package name
defaultConfig {
applicationId "<REPLACE WITH YOUR PACKAGE NAME>" // this is the package name
minSdkVersion 19
targetSdkVersion 29
versionCode flutterVersionCode.toInteger()
versionName flutterVersionName
testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
}
3- Open /android/app/src/main/AndroidManifest.xml , /android/app/src/profile/AndroidManifest.xml, /android/app/src/debug/AndroidManifest.xml and specify your:
NOTE: Copy code from /android/app/src/main/AndroidManifest.xml and paste on profile and debug folder AndroidManifest.xml
- YOUR PACKAGE NAME
- YOUR APPLICATION NAME
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="<YOUR PACKAGE NAME>">
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>
<!-- io.flutter.app.FlutterApplication is an android.app.Application that
calls FlutterMain.startInitialization(this); in its onCreate method.
In most cases you can leave this as-is, but you if you want to provide
additional functionality it is fine to subclass or reimplement
FlutterApplication and put your custom class here. -->
<application
android:name=".Application"
android:label="<YOUR APPLICATION NAME>"
android:icon="@mipmap/ic_launcher">
iOS Configration #back to top
1 - Open Code in visual studio.
2. Run the following command (if you already did for android then not need to run following commmand. Move on step 3).
flutter pub get3 - How to install/Update Pod for submit the iOS App. Please Run the following command in iOS folder path.
pod install
pod update
pod repo update
pod install --repo-update
4 - Now you can open Runner.xcworkspace with Xcode. Run your project with simulators.
- Click the Get dependencies or Packages get to install the libraries from pubspecs.yaml file.
- Open the simulator to run iOS or Android (as the step above)
- Then press the run button to start the project (you can still open multi simulator at the same time)
Run & Build #back to top
Run the Application
1- After you make all your changes and customizations save all your project, Open the console, navigate to your project folder and execute the following command to build your app.
flutter runBuild and Install App
If you don't use Android Studio or IntelliJ you can use the command line to run your application using the following command
flutter build apk --releaseAdmin Panel Setup With Firebase #back to top
Step 1 (Setup Web Project in Firebase)
It's same setup like android and iOS firebase project setup. Firebase also provide web project so just create it.
Step 2
Open Web App Project Setting and choose Firebase SDK Config. Review screenshot.
Step 3
Go to your project Root folder using cd command in cmd.
Step 4 ( Put that firebase values in below given folder path and update ENV file too. )
App->http->Controllers->firebase_credentials.json
Step 5
Now locally You will start Your application using below command.
php artisan serve
NOTE: By default your application will open at 8000 port.
Changelog #back to top
-----------------------------------------------------------------------------------------
V 2.0.2 | 21/04/2022
- Contact Issue Fixed
-----------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------
V 2.0.1 | 23/03/2022
- Flutter 2.8.1 support
- Audio/Video Call Improve
- Plugin Dependacies Upgrade.
- iOS pod Update with latest flutter 2.8.1
-----------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------
V 2.1 | 11/12/2021
- Flutter 2.5.3 support
- Dark Mode
- Light Mode
- New Design update
- Status Visibillity
- Agora RTC update.
- Plugin Dependacies Upgrade.
- iOS pod Update with latest flutter 2.5.3
-----------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------
V1.1.0 | 23/09/2021
- Agora RTC update.
- Plugin Dependacies Upgrade.
- iOS pod Update with latest flutter 2.2.3
-----------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------
V1.0.9 | 01/09/2021
- Group Video Call
- Group Audio Call
- Group Call Ringtone set
- Complete New design
- Media overview screen for Image, Video and documents.
- Plugin Dependacies Upgrade
- iOS pod Update with latest flutter 2.0
-----------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------
V1.0.8 | 13/07/2021
- Image/Video/Docs/Links reply option in chat/group Chat
- Started Message Specifics Tabs for Text, Image, Video, Voice Message, File.
- Live location sharing option in chat/ group chat.
- Share contact option in contact Info.
- Media overview screen for Image, Video and documents.
- Plugin Dependacies Upgrade
- iOS pod Update with latest flutter 2.0
-----------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------
V1.0.7 | 09/06/2021
-Flutter Upgrade with Latest 2.2.1
- Connect with Whoxa Web App
- Minor Bug Fixes
-----------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------
V1.0.6 | 06/04/2021
Flutter App
01. On incoming call show notification card with the possibility to accept or decline the call
02 Possibility to play ring tone when somebody calls with a notification,
03. When the phone is locked Possibility to show notification with caller name with a ring tone.
04. Enable front camera and profile pic of the user, possibility to accept or decline the call.
05. When you call someone, show that its ringing and play ring tone, enable front camera
06. If accepted, video call started and the timer is running, the speaker is enabled
07. During a video call, possibility to mute
08. Show when user muted his mic
09. Possibility to minimize call and show a small bar at top of the app with the possibility to return to call
10. When calling not answered, possibility to call again or to cancel and exit the screen
11. Show user profile pics during the call
App Call detail screen:
01.Possibility to switch between a list of all calls and a list of missed calls.
02.List with all calls (accepted/missed/declined).
03.List missed calls.
04.Possibility to create a new call: Open contact list with all app users, search function to find app users; possibility to start an audio or video call with each user.
05.click on the info symbol for a 1on1 call: open Contact-Profile-Screen.
06.Possibility to search calls.
07.Possibility to clear list.
08.With a click on a list entry, start audio or video call depending on type
-----------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------
V1.0.5 | 30/03/2021
Flutter App
- iOS strings Added in info.plist
- Own Story View
- Flutter Upgrde
Admin Panel (Laravel)
- Add Image section in custom Push notification
- Show Listing Numbers
- Edit Username/Numbers
-----------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------
V1.0.4 | 24/03/2021
- Admin Panel with Laravel PHP
-----------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------
V1.0.3 | 19/03/2021
- GIF
- Sticker
- Admob on/off with firebase
- Swipe To Reply
- Multiple Story
- Show Own Story List
- Delete Story
- Own Contact List Show
- Invite Friend
- Typing and Status
- Ui improvements
- Upgrade Flutter
-----------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------
V1.0.2 | 03/02/2021
- Voice chat Fixed
- Search contact Fixed
- Upgrade Flutter
-----------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------
V1.0.1 | 02/02/2021
- Improve Audio/Video call
- Add Latest Location Dependency
- Fix Android compile issue
-----------------------------------------------------------------------------------------
Connect For more information primocys@gmail.com.