Skip to main content

Input Area

The input area in Global IM UIKit is created and controlled through the RCInputBar, which supports custom input buttons, extended features, and custom stickers.

The image below shows the input area from left to right: the plus extension button, the content input box (including the sticker button), and the voice recording button.

(width=250)

Modify Input Bar Buttons

The text input area of the input box cannot be modified, but you can add or remove buttons on the left and right sides of the text input area. The leftItems property of RCInputBar retrieves the default left buttons, and the rightItems property retrieves the default right buttons.

You can change the input bar buttons after the viewDidLoad method in the conversation page RCChatViewController.

- (void)viewDidLoad {
[super viewDidLoad];
/// Left button
__weak typeof(self) weakSelf = self;
NSMutableArray *tempList = self.inputBar.leftItems.mutableCopy;
{
RCBarItem *barItem = [RCBarItem itemWithTitle:@"" image:[UIImage imageNamed:@"video"] action:^(RCBarItem *item){
[weakSelf.view showHUDMessage:@"video call Clicked"];
}];
barItem.tag = 2001;
[tempList addObject:barItem];
}
self.inputBar.leftItems = tempList.copy;

/// Right button
tempList = self.inputBar.rightItems.mutableCopy;
{
RCBarItem *barItem = [RCBarItem itemWithTitle:@"" image:[UIImage imageNamed:@"voice"] action:^(RCBarItem *item){
[weakSelf.view showHUDMessage:@"voice call Clicked"];
}];
barItem.tag = 2002;
[tempList addObject:barItem];
}
self.inputBar.rightItems = tempList.copy;
}

Input Area Extension Panel

RC refers to the panel displayed when clicking the + button in the input bar as the extension panel, which can implement functions such as photo album, camera, and file selection.

alt(width=400)

The addExpandItems property of RCInputBar is the list of functions for the extension panel:

@property (nonatomic, strong) NSMutableArray<RCInputAddBarItem *> *addExpandItems;

The default menu options can be distinguished by their tags, as shown below:

FunctionTag
Photo AlbumRCInputAddBarItemGallery
CameraRCInputAddBarItemCamera
FileRCInputAddBarItemDocument

You can add, remove, or modify extension functions by manipulating addExpandItems.

- (void)viewDidLoad {
[super viewDidLoad];
RCInputAddBarItem *item = self.inputBar.addExpandItems[2];
[self.inputBar.addExpandItems removeObjectAtIndex:2];
[self.inputBar.addExpandItems insertObject:item atIndex:0];
__weak typeof(self) weakSelf = self;
[self.inputBar.addExpandItems addObject:[RCInputAddBarItem itemWithTitle:@"Position" image:[UIImage imageNamed:@"Position"] action:^(RCBarItem *item){
[weakSelf.view showHUDMessage:@"Position Clicked"];
}]];
}

Sticker Panel

Global IM UIKit provides only the default sticker button (as shown below) and the sticker display panel. Sticker resources need to be provided by the application to Global IM UIKit.

(width=250)

For details on how to add custom stickers, see Sticker Message.