QuickBlox iOS UIKit provides customizable screens and basic chat features such as dialog list, dialog creation, chat in dialogs, and dialog editing out of the box.
ScreenSettings
for that screen, and a ViewModel
that provides the screen’s functionality.
Each screen has custom user interface components. Each screen has a specific ScreenSettings
that creates the view and each ScreenSettings
contains customizable UI components. A screen also has a corresponding ViewModel
that provides the necessary data from QuickBlox iOS SDK.
Refer to the table below to see which screens we provide and the components that make up each screen.
Screen | ScreenView | ScreenSettings | ViewModel | Components |
---|---|---|---|---|
Dialog list | DialogsView | DialogsScreenSettings | DialogsViewModel | DialogListHeader |
Private Dialog | PrivateDialogView | DialogScreenSettings | DialogViewModel | DialogHeader |
Private Dialog info | PrivateDialogInfoView | DialogInfoScreenSettings | DialogInfoViewModel | PrivateDialogInfoHeader |
Create Private Dialog | CreateDialogView | CreateDialogScreenSettings | CreateDialogViewModel | CreateDialogHeader |
Dialog Type | DialogTypeView | DialogTypeScreenSettings | DialogTypeHeaderView | |
Group Dialog | GroupDialogView | DialogScreenSettings | DialogViewModel | DialogHeader |
Group Dialog info | GroupDialogInfoView | DialogInfoScreenSettings | DialogInfoViewModel | DialogInfoHeader |
Members | RemoveMembersView | MembersScreenSettings | MembersDialogViewModel | MembersHeader |
Add members | AddMembersDialogView | AddMembersScreenSettings | AddMembersDialogViewModel | AddMembersHeader |
New Dialog | NewDialog | DialogNameScreenSettings | NewDialogViewModel | DialogNameHeader |
Create Group Dialog | CreateDialogView | CreateDialogScreenSettings | CreateDialogViewModel | CreateDialogHeader |
DialogsListView
component presents a visually appealing list of dialogs in the application.DialogsListView
component in your SwiftUI view, follow these steps:
Create an instance of DialogsViewModel
with the appropriate DialogsRepository
instance.
Define the content views for the list view and the detail view for individual dialogs.
Customize the appearance and behavior of the DialogsListView
using the available configuration options.
Embed the DialogsListView
struct in your SwiftUI view hierarchy.
Here’s an example of how to use the DialogsViewModel
feature:
The dialogs list shows the complete list of group and private dialogs of which the current user is a member.
After following the steps described in the Get start section, you can display and manage the list of dialogs.
sendMessage(\_ text: String)
Sending various types of messages.handleOnSelect(attachment: AttachmentAsset)
Preparing and Sending Messages with Attachments.sendTyping()
Sending signals while the User is composing a message. The user actively interacts with the message input interface specific to this chat session (for example, by entering text in the input area of the chat window).sendStopTyping(
) Sending signals when the User has been writing but has now stopped. The user wrote but did not interact with the message input interface for a short period of time (for example, 30 seconds).handleOnAppear(\_ message: MessageItem)
Processing a message that appears from a dialog participant.startRecording()
Start recording a voice message.stopRecording()
Stop recording a voice message.deleteRecording()
Delete a voice message.playAudio(\_ audioData: Data, action: MessageAttachmentAction)
Play audio files, including voice messages.stopPlayng()
Stops playback of the audio file.unsubscribe()
Unsubscribe from receiving signals from publishers.MessageRowView
types, each representing a different kind of message, such as simple text messages, file messages, and multimedia content such as photos and videos. This screen also contains a field for entering the text of the message, recording a voice message and accessing the Photo Gallery and Files.
DialogViewModel
class as the view model, which conforms to the DialogViewModelProtocol
. The view model handles the presentation logic and messaging and managing chat history data. It provides published properties for dialog-related information and chat interaction methods such as sending messages and interacting with features such as the Typing indicator.
DialogInfoViewModel
class as a view model that conforms to the DialogInfoProtocol
. The view model handles the presentation logic and data management for the chat information. It provides published properties for dialog-related information and chat interaction methods, such as deleting a chat.
modeldDialog: Dialog
object representing the private chat you will set up for the desired users on this screen to complete the setup of the new dialog and create it.CreateDialogViewModel
by passing a modeldDialog: Dialog
object as a parameter.handleOnSelect(\_ item: UserItem)
method and you will notice that the selection is confirmed with a checkbox.handleOnSelect(\_ item: UserItem)
method and the check box will return to its default state.createDialog()
method by clicking on the “Create” button.CreateDialogViewModel
is the view model responsible for managing the screen of the private creation dialog. It handles user interaction, search functionality, and updates the displayed list of users. The view model also manages asynchronous tasks with Task\<Void, Never>
and AnyCancellable
in Combine
. It provides efficient and secure handling of UI updates and background operations.
CreateDialogViewModel
is equipped with a set of methods, including sync() to synchronize dialog members, handleOnSelect(\_ item: UserItem)
to set user to a private dialog, and createDialog() to create a private chat.
<Void, Never>
and Combine’s AnyCancellable. It ensures efficient and safe handling of UI updates and background operations.
The AddMembersDialogViewModel is equipped with a set of methods, including sync() to synchronize dialog members, displayDialogMembers() to filter users based on the search query, and addSelectedUser() to add a selected user to the group chat.
<Void, Never>
and AnyCancellable in Combine. It provides efficient and secure handling of UI updates and background operations.
The NewDialogViewModel is equipped with a set of methods, including handleOnSelect(attachmentAsset: AttachmentAsset) to set the dialog avatar photo, removeExistingImage() to remove the dialog avatar photo, and createDialogModel() to create a group chat model.
<Void, Never>
and AnyCancellable in Combine. It provides efficient and secure handling of UI updates and background operations.
CreateDialogViewModel is equipped with a set of methods, including sync() to synchronize dialog members, handleOnSelect(_ item: UserItem) to set users to a group dialog, and createDialog() to create a group chat.