quora
  • Recent
Add chat and video calling using QuickBlox chat API and SDK

Build Your Own Messenger With Real-Time Chat & Video APIs

Add instant messaging and online video chat to any Android, iOS, or Web application, with ease and flexibility. In-app chat and calling APIs and SDKs, trusted globally by developers, startups, and enterprises.

phone
QuickBlox Bayshore
QuickBlox NextGen
QuickBlox MORABANC
QuickBlox ZUELLIG PHARMA
QuickBlox Teladoc
QuickBlox OMRON

Launch quickly and convert more prospects with real‑time Chat, Audio, and Video communication

If you own a product, you know exactly how drawn-out and exorbitant it can be to build to build real-time communication features from scratch. Quickblox can help you design, create, and enter the market at a much faster rate with APIs and SDKs that shortcut product and engineering delivery. Convert your ideas into a successful product with us and watch the engagement rate rise, while you build a loyal user base.

Over 30,000 software developers and organizations worldwide are using QuickBlox messaging API.

200+

enterprise instances

22K+

applications

75M+

chats per day

2.5B+

requests per month

Wherever you are in your product journey, we have chat, voice, and video APIs ready to build new features into your app

Why QuickBlox?

Quickblox APIs are equipped to support mobile applications and websites at different stages, be it a fresh product idea, an MVP, early stage startup or a scaling enterprise. Our documentation and developer support are highly efficient to make your dream product a reality.

QuickBlox

Chat API and Feature-Rich SDKs

Our versatile software is designed for multi‑platform use including iOS, Android, and the Web.

QuickBlox

SDKs and Code Samples:

Cross-platform kits and sample apps for easy and quick integration of chat.

QuickBlox

Restful API:

Enable real-time communication via the server.

QuickBlox

UI Kits:

Customize everything as you want with our ready UI Kits.

QuickBlox

Q-Consultation:

White‑label solution for teleconsultation and similar use cases.

QuickBlox

Fully Customizable White Label Solutions

Customizable UI Kits to speed up your design workflow and build a product of your vision as well as a ready white‑label solution for virtual rooms and video calling use cases.

QuickBlox

Cloud & Dedicated Infrastructure

Host your apps wherever you want - opt for a dedicated fully managed server or on‑premises infrastructure. Pick a cloud provider that’s best as per your business goals.

QuickBlox

Cloud:

A dedicated QuickBlox cloud or your own virtual cloud?

QuickBlox

On-Premise:

Deployed and managed on your own physical server.

QuickBlox

Docs:

Integrating QuickBlox across multiple platforms.

QuickBlox

Support:

Quickblox support is a click away.

QuickBlox

Rich Documentation & Constant Support

Get easy step by step guidance to build a powerful chat/messaging/communication app. Easily integrate new features using our documentation and developer support.

Do you need additional security, compliance, and support for the long-term ?

We have a more scalable and flexible solution for you, customized to your unique business/app requirements.

Insanely powerful in-app chat solutions- for every industry

  • Healthcare

    Provide better care for your patients and teams using feature-rich HIPAA‑compliant chat solutions. Integrate powerful telemedicine communication tools into your existing platform.

    QuickBlox
  • Finance & Banking

    Secure communication solutions for the financial and banking industry to support your clients. Easily integrated with your banking APIs with full customization available.

    QuickBlox
  • Marketplaces & E-commerce

    Integrate chat and calling into your e‑commerce marketplace platform to connect with customers using chat, audio, and video calling features.

    QuickBlox
  • Education & Coaching

    Add communication functions to connect teachers with students, coaches with players, and trainers with clients. Appropriate for any remote learning application.

    QuickBlox

Trusted by Developers & Product Owners

Explore Documentation

Familiarize yourself with our chat and calling APIs. Use our platform SDKs and code samples to learn more about the software and integration process.

Start For FREE. Customize Everything. Build Your Dream Online Platform.

Our real-time chat and messaging solutions scale as your business grows, and can be customized to create 100% custom in-app messaging.

QUICKBLOX
QuickBlox post-box

Q-Consultation for every industry

Securely hold virtual meetings and video conferences

Learn More>

Want to learn more about our products and services?

Speak to us now

How to Build a Dialogs Page in SwiftUI

Vladimir Nybozhinsky
9 Feb 2023
How to build a dialogs page with swiftui

In modern app development, creating an engaging and intuitive user interface is vital to the success of your application. One of the essential components of an effective user interface is a dialogs page, which can be used to present alerts, confirmations, and other interactive elements to users. In SwiftUI, building a dialogs page is an easy and straightforward process that allows you to create a visually appealing and user-friendly interface for your app.

In an earlier series of tutorials we covered some of the basic first stages of using SwiftUI to create a user interface with a basic login page. In the next few tutorials we will show you how to build a dialog page for a chat application. The dialogs screen in a mobile chat app is the screen that displays all the conversations that the current user has. In the guide below, we will show you the first basic step of how to fetch dialogs from the QuickBlox server.

You can download the finished project of this part from this link.

And don’t forget to consult our official documentation.

QuickBlox SwiftUI Tutorial Series:

Getting started with SwiftUI
How to Connect QuickBlox iOS SDK to your SwiftUI Project
How To Build A Login Page In SwiftUI
—- #1 Login Screen. Creating a Basic Login Page
—-#2 Login Screen. Validation of entered data and advanced UI
—-#3 Login Screen. Connect to Chat

Let’s Get Started !

To access the chat functionality, you first need to log in to QuickBlox and get the dialogs from the QuickBlox server.

If you haven’t yet created your QuickBlox account, you can find out how to here. You can also learn how to create a new application in your admin panel from our earlier blog.

We will now fetch our dialogs from the QuickBlox server using QuickBlox Server API. We recommend that you read the Dialogs section in the official QuickBlox documentation before proceeding further.

Since we have not yet implemented the functionality of creating dialogs we cannot yet download anything. But we can create test dialogs directly from our admin panel.

To do this, go to your QuickBlox account and the application you created, and find the credentials which you used in the IOS application.

create dialogs screen

Select “Chat” from the menu on the left.

select chat

A page with your dialogs will open. It may be empty, but we’ll soon fix this 🙂

To create a new dialog from the admin panel, click the “New Dialog” button.

select new dialog

A template will open for entering the necessary data to create a dialog.

create group chat

With the Quickblox SDK, you can create threes flavors of chat:

  • private dialog – a dialog between 2 users.
  • group dialog – a dialog between the specified list of users.
  • public dialog – an open dialog. Any user from your app can be joined to it.

You can learn more about dialog types in the documentation.

If you create a Public dialog, then it is enough to enter only the name of the dialog.

In order to create a Group dialog, you must enter the IDs of the participants in the dialog. New users can also be created from the admin panel and for this you need to go to the menu item “Users”.

select user

In this step, we will create a Public Dialog.

In the “Name” text box, enter a name for your dialog, then select the “Public Group” dialog type and click “Create”.

create public chat

That’s all, the dialog is created and it is displayed in the list of dialogs.

fetch dialog

Wonderful!

Now we can make a request to the QuickBlox server to get this dialog.

Let’s create a new QuickBloxServerAPI.swift file in which we will implement methods for interacting with the QuickBlox Server API.

First, let’s implement a request to the server to get a list of dialogs that have our user’s ID. Note that, Public Dialogs do not contain IDs and all users in this application receive them.

import Foundation
import Quickblox


enum QuickBloxServerError: Error {
    case someError
}


typealias DialogsFetchCompletion = (Result<[QBChatDialog]?, Error>) -> Void


class QuickBloxServerAPI {
    
    //MARK: - Public Methods
    //MARK: - Dialogs
    func fetchDialogs(withCompletion completion: @escaping DialogsFetchCompletion) {
        let extendedParameters = ["sort_desc": "last_message_date_sent"]
        let responsePage = QBResponsePage(limit: 100)
        QBRequest.dialogs(for: responsePage,
                          extendedRequest: extendedParameters,
                          successBlock: { response,
            dialogs, dialogsUsersIDs, page in
            
            completion(.success(dialogs))
        }, errorBlock: { response in
            let error = response.error?.error ?? QuickBloxServerError.someError
            completion(.failure(error))
        })
    }
}

In this method, we call the QuickBlox API to get dialogs and pass the necessary parameters to it:

let extendedParameters = ["sort_desc": "last_message_date_sent"]

We indicate that we want to get dialogs sorted in descending order by the date of the last message.

let responsePage = QBResponsePage(limit: 100).

We indicate that we want to receive dialogs in batches of 100 dialogs.

Let’s prepare a Dialogs Screen to display the resulting dialogs:

import SwiftUI
import Quickblox
import UIKit


struct DialogsView: View {
    
    @Environment(\.presentationMode) var presentationMode
    @State var dialogs: [QBChatDialog] = []
    let quickBloxServerAPI = QuickBloxServerAPI()
    
    var body: some View {
        ZStack {
            Color.white.edgesIgnoringSafeArea(.all)
            Color.clear
                .overlay(
                    List {
                        ForEach(dialogs, id: \.self) { dialog in
                            Text(dialog.name ?? "TestDialog" )
                        }
                    }
                        .listStyle(PlainListStyle())
                        .onAppear() {
                            self.fetchDialogs()
                        }
                )}
        .navigationBarTitle("Chats", displayMode: .inline)
    }
    
    func fetchDialogs() {
        quickBloxServerAPI.fetchDialogs { result in
            switch result {
            case .success(let dialogs):
                guard let dialogs = dialogs else { return }
                DispatchQueue.main.async {
                    self.dialogs = dialogs
                }
            case .failure(let error):
                debugPrint("[DialogsView] \(#function) error: \(error.localizedDescription)")
            }
        }
    }
}


struct DialogsView_Previews: PreviewProvider {
    static var previews: some View {
        DialogsView()
    }
}

Now everything is ready to make a request to receive dialogs from the server. Let’s do that!

Let’s run the application and pay attention to the logs that Quickblox iOS SDK displays.

IMHO, in this case it is better to use an image, since this is not code, these are XCode logs that show a request to the server to get a dialog.

Xcode logs

This is what our request looks like with the given parameters.

And this is what the resulting dialog model looks like:

dialog model

We have successfully received the previously created dialog from the server!

On the Dialog Screen we should see the following:

SwiftUI app

Great!!!

In this part, we implemented receiving dialogs from the Quickblox Server and got acquainted with how you can create a dialog in the admin panel.

In the next part, we will create a DialogView to correctly and more fully display the received dialogs!

  1. Christoper says:

    I гead this article concerning SwiftUI technologies, іt’ѕ awesome article.

Leave a Comment

Your email address will not be published. Required fields are marked *

Read More

Ready to get started?

QUICKBLOX
QuickBlox post-box