Source code removed from the public access, if you are interested in Q-municate please contact us
Q-municate is an open source code of chat application with full range of communication features on board (such as messaging, file transfer, push notifications, audio/video calls, etc.).
We are inspired to give you chat application out of the box. You can customise this application depending on your needs. As always QuickBlox backend is at your service: https://quickblox.com/plans/
Find the source code and more information about Q-municate, as well as installation guide, in our Developers section: https://quickblox.com/developers/q-municate
This guide is brought to you from QuickBlox iOS team in order to explain how you can build a communication app on iOS using QuickBlox API.
It is a step by step guide designed for all developer levels including beginners as we move from simple to more complex implementation. Depending on your skills and your project requirements you may choose which parts of this guide are to follow. Enjoy and if you need assistance from QuickBlox iOS team feel free to let us know by creating an issue.
Q-municate is a fully fledged chat application using the Quickblox API.
QuickBlox - Communication & cloud backend platform which brings superpowers to your mobile apps.
1.2 WebRTC
Q-municate uses WebRTC for video and audio calling meaning it’s a great cross-platform solution. WebRTC itself it open-source, so you can modify the code as much as you wish, or you can trust the thousands of skilled developers who contributed to it’s development.
The VideoChat code sample allows you to easily add video calling and audio calling features into your iOS app. Enable a video call function similar to FaceTime or Skype using code sample as a basis.
The App supports both landscape and portrait mode.
The iOS application has English language interface and easy to add localisation.
Three sign-up methods as well as login – Facebook, Firebase (phone number) and with email/password
Call Kit
Share extension
Siri extension for messaging
View list of all active chat dialogs with message history (private and group chat dialogs)
View, edit and leave group chat dialogs
View and remove private chat dialogs
Search: local dialogs search, contacts search and global users search
Create and participate in private and group dialogs
Managing, updating and removing dialogs
Audio and Video calls (using QuickBlox WebRTC Framework)
Edit own user profile
Reset password and logout
See other users profile
Pull to refresh for dialogs list, contacts list and user info page
Please note all these features are available in open source code, so you can customise your app depending on your needs.
4. Screens
4.1 Welcome
Available features:
Connect with Phone – this button allows user to enter the App with his/her phone number using Firebase. If tapped will be shown User Agreement pop-up.
Login by email or social button – By tapping this button action sheet with extra login methods will pop up. There is such methods as Facebook login and login by email/password.
Login with Facebook allows user to enter the App with his/her Facebook credentials. If tapped will be shown User Agreement pop-up.
If App has passed Facebook authorisation successfully, the App will redirect user into chat dialogs list screen.
Login by email/password allows user to enter the App if he/she provides correct and valid email and password. By tapping on this button user will be redirected to the login screen.
Please note, that there is no longer a possibility to sign up user using email and password method. You can only sign up using Phone number and/or Facebook credentials.
4.2 Login with email/password
Available features:
Fields set:
Email – text/numeric/symbolic fields 3 chars min - no border, mandatory (email symbols validation included)
Password – text/numeric/symbolic field 8-40 chars (should contain alphanumeric and punctuation characters only) , mandatory
Buttons:
Back - returns user back to welcome screen
Done - performing login after fields validation using provided email and password
Forgot password - opens forgot password screen
4.3 Forgot password
Fields set:
Email – text/numeric/symbolic fields 3 chars min - no border, mandatory (email symbols validation included)
Buttons:
Back - returns user back to welcome screen
Reset - performing password reset
4.4 Tab Bar
Tab bar is a main controller of the application. It consists of such pages:
Chat dialogs list (main page)
Contacts list
Settings
4.5 Chat Dialogs List
Search:
Search allows user to filter existing dialogs in local cache by its names.
Buttons:
Right bar button - redirects user to new dialog screen
4.6 New Message
If you will select only 1 contact - private chat will be opened (if existent) or created if needed. Otherwise group chat will be created.
Search:
Tag field allows you to search through contacts full names.
Buttons:
Right bar button - creates chat dialog
Back - return user back to chat dialogs page
4.7 Chat
There is a possibility to send:
Text messages
Images from gallery and camera
Videos from gallery and camera
Audio records using input toolbar right button
Available features:
Sharing and forwarding
Copying image attachmnets and text messages
4.8 Private Chat
Buttons:
Right bar buttons - Audio and Video call buttons, you can only call user if he is in your contact list
Back - returns user back to chat dialogs list screen
Navigation bar title - redirects user to opponent profile page
4.9 Group Chat
Buttons:
Right bar button and navigation bar title - redirects user to group chat info screen
Back - return user to chat dialogs list screen
Opponent user avatars - by tapping opponent user avatars in messages you will be redirected to the info page of that user
4.10 Group Chat Info
Fields/Buttons:
By tapping on group avatar you can change it by taking a new photo or selecting it from library
By tapping on group name you will be redirected to group name change screen
By tapping on Add member field you will be redirected to contacts screen in order to select users to add
By tapping on any user in members list you will be redirected to their info page (except your own user in list)
By tapping Leave and remove chat field - you will leave existent group chat and delete it locally
4.11 Contacts List
Search:
Search has two scopes buttons:
Local search - allows user to filter existing contacts by their names.
Global search - allows user to find users and see their profiles by full names.
4.12 User Info
Fields/Buttons
Contacts actions:
Send message - opens chat with user, if there is no chat yet - creates it
Audio Call - audio call to user
Video Call - video call to user
Remove Contact and Chat - deleting user from contact list and chat with him
Other user actions:
Add contact - sending a contact request to user or accepting existing one
4.13 Settings
Fields/Buttons:
Full name, status and email fields will redirect you to update field screen, where you can change your info.
By tapping on avatar action sheet will be opened. You can either take a new picture or choose it from library to update your user avatar.
Push notification switch - you can either subscribe or unsubscribe from push notifications.
Tell a friend - opens share controller where you can share this awesome app with your friends :)
Give feedback - feedback screen, where you can send an email to us with bugs, improvements or suggestion information in order to help us make Q-municate better!
5. Audio and Video Calls
Q-municate using QuickBlox WebRTC SDK as call service. You can find more information on it here.
5.1 Calls controller
Call controller has 6 states:
Incoming audio call
Incoming video call
Outgoing audio call
Outgoing video call
Active audio call
Active video call
Call controller is been managed by QMCallManager, basically call manager allocating it with a specific state, whether it is an incoming or outgoing call, then call controller changing its state to active one if required user accepts it.
5.2 Audio Call
You can see down below Incoming, outgoing and active audio call screens.
Toolbar buttons
Incoming call:
Decline - declines call and closes received session and controller
Accept - accepts call and changes call controller state to Active audio call
Outgoing and active call:
Microphone - disables microphone for current call
Speaker - whether sound should be played in speaker or receiver. Default for audio calls is receiver.
Decline - hanging up current all and closing controller
5.3 Video Call
You can see down below Incoming, outgoing and active video call screens.
By default sound for video calls is in speakers.
Incoming call:
Decline - declines call and closes received session and controller
Accept - accepts call and changes call controller state to Active video call
Outgoing and active call:
Camera - enables/disables camera for current call
Camera rotation - changes camera for current call (front/back)
Microphone - disables microphone for current call
Decline - hanging up current all and closing controller
5.4 Call Kit
CallKit allows to integrate calling services with other call-related apps on the system. CallKit provides the calling interface, and we handle the back-end communication with our VoIP service. For incoming and outgoing calls, CallKit displays the same interfaces as the Phone app, giving Q-municate application a more native look and feel.
6. Extensions
6.1 Share extension
Share extension gives users a convenient way to share content with other entities.
Available types for sharing:
Locations
URL
Images
Videos
Audios
6.2 Intents App Extension(SiriKit for messaging)
An Intents app extension receives user request to send a message from SiriKit and turns it into app-specific actions.
7. Code explanation
You can see basic code explanation down below. For detailed one please see our inline documentation for header files in most classes. We have tried to describe as detailed as possible the purpose of every class and its methods. If you have any questions, feel free to let us know by creating an issue.
7.1 Storyboards
We have separated Q-municate for modules, such as:
Auth
Main
Chat
Settings
Each module has its own storyboard, all storyboards are linked with storyboard links (feature available since Xcode 7 and iOS 8+).
8. How to build your own Chat app
If you want to build your own app using Q-municate as a basis, please follow our detailed guide here.
请发表评论