pod 'ChatroomUIKit'

ChatroomUIKit  
├─ Service                           // Basic service components.
│  ├─ Protocol                       // Business protocol component.    
│  │  ├─ GiftService                 // Gift sending and receiving channel.
│  │  ├─ UserService                 // Component for user login and user attribute update.
│  │  └─ ChatroomService             // Component for implementing the protocol for chat room management, including joining and leaving the chat room and sending and receiving messages.
│  ├─ Implement                      // Protocol implementation component. 
│  └─ Client                         // ChatroomUIKit initialization class.
│
└─ UI                                // Basic UI components without business.
   ├─ Resource                       // Image or localize file.
   ├─ Component                      // UI module containing specific business. Some functional UI components in chat room UIKit.
   │  ├─ Room                        // Container of all chat room subviews.
   │  ├─ Chat                        // The barrage component and bottom functional area in the chat room.  
   │  ├─ Gift                        // Components such as the gift barrage area and gift container in the chat room.
   │  └─ Input                       // Input components in chat rooms such as emoticons. 
   └─ Core
      ├─ UIKit                       // Some common UIKit components and custom components. 
      ├─ Theme                       // Theme-related components, including colors, fonts, skinning protocols and their components. 
      └─ Extension                   // Some convenient system class extensions.  

python3 -m http.server 8080

import UIKit
import ChatroomUIKit
    
@UIApplicationMain
class AppDelegate: UIResponder, UIApplicationDelegate {

    var window: UIWindow?


    func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
        // You can initialize the ChatroomUIKit when the app loads or before you use it. 
        // You need to pass in the App Key. 
        // To get the App Key, visit https://docs.agora.io/en/agora-chat/get-started/enable?platform=android#get-chat-project-information.  
        ChatroomUIKitClient.shared.setup(with: "Appkey")
        return true
    }
}

// Log in to the ChatroomUIKit with the user information of the current user object that conforms to the `UserInfoProtocol` protocol.
// The token needs to be obtained from your app server. You can also log in with a temporary token generated on the Agora Console.
// To generate a user and a temporary user token on the Agora Console, see https://docs.agora.io/en/agora-chat/get-started/enable?platform=ios#manage-users-and-generate-tokens.
ChatroomUIKitClient.shared.login(with userId: "user id", token: "token", completion: <#T##(ChatError?) -> Void#>)

// 1. Get a chat room list and join a chat room. Alternatively, create a chat room on the Agora Console.
// Choose ProjectManager > Operation Manager > Chat Room and click Create Chat Room and set parameters in the displayed dialog box to create a chat room. Get the chat room ID to pass it in to the following `launchRoomView` method.
// 2. Create a chat room view with `ChatroomView` by passing in parameters such as layout parameters and the array of extension button model protocols of the bottom toolbar.
// It is recommended that the width of ChatroomView should be initialized as the width of the screen and the height should be no less than the height of the screen minus the height of the navigation.
let roomView = ChatroomUIKitClient.shared.launchRoomViewWithOptions(roomId: self.room?.chatroomId ?? "", frame: CGRect(x: 0, y: self.playView.frame.maxY, width: self.view.frame.width, height: 336+BottomBarHeight), ownerId: "Chatroom's owner user id")        
// 3. Add to the destination frame. 
// 4. Add users to the chat room on the Console.
// Choose ProjectManager > Operation Manager > Chat Room. Select View Chat Room Members in the Action column of a chat room and add users to the chat room in the displayed dialog box.  

//1. Get a chat room list and join a chat room. Alternatively, create a chat room on the Agora Console.
// 2. Create a chat room view with `ChatroomView` by passing in parameters such as layout parameters and the array of extension button model protocols of the bottom toolbar.
    let options  = ChatroomUIKitInitialOptions()
    options.bottomDataSource = self.bottomBarDatas()
    options.hasGiftsBarrage = true
    options.hiddenChatRaise = false
    ChatroomUIKitClient.shared.launchRoomViewWithOptions(roomId: self.room?.chatroomId ?? "", frame: CGRect(x: 0, y: self.playView.frame.maxY, width: self.view.frame.width, height: 336+BottomBarHeight), ownerId: self.room?.owner ?? "",options: self.option_UI)        
//3. Add to the destination frame. 

ChatroomUIKitClient.shared.registerRoomEventsListener(listener: self)

// You can change the overall cell layout style of the barrage area by setting the properties.
Appearance.barrageCellStyle = .all
// Create the ChatroomView by passing in parameters like layout parameters and the bottom toolbar extension button model protocol array.
let roomView = ChatroomUIKitClient.shared.launchRoomViewWithOptions(roomId: self.room?.chatroomId ?? "", frame: CGRect(x: 0, y: self.playView.frame.maxY, width: self.view.frame.width, height: 336+BottomBarHeight), ownerId: self.room?.owner ?? "")
self.view.addSubView(roomView)

class CustomGiftBarragesViewCell: GiftBarrageCell {
    lazy var redDot: UIView = {
        UIView().backgroundColor(.red).cornerRadius(.large)
    }()
    
    override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {
        super.init(style: style, reuseIdentifier: reuseIdentifier)
        self.addSubview(redDot)
    }
    
    override func refresh(item: GiftEntityProtocol) {
        super.refresh(item: item)
        self.redDot.isHidden = item.selected
    }
}
//Register the custom class that inherits the original class in ChatroomUIKit to replace the original one.
//Call this method before creating a ChatroomView or using other UI components.
ComponentsRegister.shared.GiftBarragesViewCell = CustomGiftBarragesViewCell.self

Theme.switchTheme(style: .dark)` or `Theme.switchTheme(style: .light)

/**
How to customize a theme?

To customize a theme, you need to define the hue values of the following five theme colors by reference to the theme color of the design document.

All colors in ChatroomUIKit are defined with the HSLA color model that is a way of representing colors using hue, saturation, lightness, and alpha. 

H (Hue): Hue, the basic attribute of color, is a degree on the color wheel from 0 to 360. 0 is red, 120 is green, and 240 is blue.

S (Saturation): Saturation is the intensity and purity of a color. The higher the saturation is, the brighter the color is; the lower the saturation is, the closer the color gets to gray. Saturation is represented by a percentage value, ranging from 0% to 100%. 0% means a shade of gray, and 100% is the full color.

L (Lightness): Lightness is the brightness or darkness of a color. The higher the brightness is, the brighter the color is; the lower the brightness is, the darker the color is. Lightness is represented by a percentage value, ranging from 0% to 100%. 0% indicates a black color and 100% will result in a white color.

A (Alpha): Alpha is the transparency of a color. The value 1 means fully opaque and 0 is fully transparent.

By adjusting the values of individual components of the HSLA model, you can achieve precise color control.
 */
Appearance.primaryHue = 191/360.0
Appearance.secondaryHue = 210/360.0
Appearance.errorHue = 189/360.0
Appearance.neutralHue = 191/360.0
Appearance.neutralSpecialHue = 199/360.0
Theme.switchTheme(style: .custom)