Customization
Channel Button
1. Moving Channel Button
You have the option to adjust the position of the Channel button via the ChannelButtonOption
.
After making changes to this option, apply it to the property value of BootConfig
. For example:
let config = BootConfig()
config.channelButtonOption = ChannelButtonOption(
position: .left,
xMargin: 100,
yMargin: 200
)
ChannelIO.boot(with: config) {
...
}
BootConfig *config = [BootConfig alloc] init];
ChannelButtonOption* option = [ChannelButtonOption alloc] initWithPosition: ChannelButtonPositionLeft xMargin:20 yMargin: 20];
[config setChannelButtonOption: option];
2. Custom Channel Button
If you wish to customize the appearance of the Channel button, apart from the few pre-set options, you will need to create your own button.
- Make sure to hide the default Channel button by calling
ChannelIO.hideChannelButton
. - Once you've created your button and positioned it as desired, link the
ChannelIO.showMessenger
to the button's touch event.
3. Display the number of unread messages
We recommend using onBadgeChanged
to display the number of unread messages. If you choose to customize the Channel button, the count of unread messages will not be visible.
To implement the onBadgeChanged
, ensure that theChannelPluginDelegate
is adopted. For instance:
class MyAwesomeApp: UIViewController {
func viewDidLoad() {
super.viewDidLoad()
ChannelIO.delegate = self
}
}
extension MyAwesomeApp : ChannelPluginDelegate {
func onBadgeChanged(unread: Int, alert: Int) {
//do something with count
}
}
//in MyAwesomeApp.h
@interface MyAwesomeApp : UIViewController<ChannelPluginDelegate>
//your properties..
@end
//in MyAwesomeApp.m
@implementation MyAwesomeApp
- (void)viewDidLoad {
[super viewDidLoad];
ChannelIO.delegate = self;
}
- (void)onBadgeChangedWithCount:(NSInteger)count {
//do something with count
}
Customizing in-app popup
By default, the SDK delivers the following in-app pop-up notifications to your app, which is applicable when the user uses the app online.
1. In-App Pop-up Information
To receive in-app push notifications, you need to adopt theChannelPluginDelegate
and implement the onPopupDataReceived
method. Here's an example:
class MyAwesomeApp: UIViewController {
func viewDidLoad() {
super.viewDidLoad()
ChannelIO.delegate = self
}
}
extension MyAwesomeApp: ChannelPluginDelegate {
func onPopupDataReceived(event: PopupData) {
//configure your view with push event data
//and display
}
}
//in MyAwesomeApp.h
@interface MyAwesomeApp : UIViewController<ChannelPluginDelegate>
//your properties..
@end
//in MyAwesomeApp.m
@implementation MyAwesomeApp
- (void)viewDidLoad {
[super viewDidLoad];
ChannelIO.delegate = self;
}
- (void)onPopupDataReceivedWithEvent:(PopupData *)event {
//configure your view with push event data
//and display
}
2. Customizing the Appearance of In-App Popup Notifications
To customize the appearance of the In-App Push notifications, you must create and utilize your own in-app push notification screen.
- Make sure the default in-app push view remains hidden by setting the
hidePopup
option ofBootConfig
totrue
. - Perform a new
Boot
using the aboveBootConfig
. - Utilize the
onPoupupDataReceived
method implemented in step 1 to fill in your customized in-app push notification view.
Event tracking
1. Custom Event Tracking
Utilize the track
method to track a specific action of the user.
Below is an description of how to log an event when a user utilizing the SDK approaches a specific ViewController, MyAwesomeAppViewController
.
class MyAwesomeAppViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
ChannelIO.track(
eventName:"awesome_visited",
eventProperty: [
"visitedAt": "1521232131",
"hasClickedButtonA": true,
"otherMeta": "etc",
])
}
}
//in MyAwesomeApp.h
@interface MyAwesomeApp : UIViewController
//your properties..
@end
//in MyAwesomeApp.m
@implementation MyAwesomeApp
- (void)viewDidLoad {
[super viewDidLoad];
[ChannelIO trackWithEventName:@"awesome_visited" eventProperty:{
@"visitedAt": @"",
@"hasClickedButtonA": @(YES),
@"otherMeta": @"etc"
}];
}
Updated 10 months ago