In-App UI
Swift (iOS)
UI components
Customization

Customizing Knock UI components in iOS

How to customize Knock's iOS UI components.

InAppFeedTheme

#

Overview

#

InAppFeedTheme allows for UI customization of the KnockInAppFeedView.

Properties

#
rowThemeFeedNotificationRowTheme

Defines the UI customization of the row items.

titleStringString?

Sets the title of the view. If set to nil, then the title view will be hidden entirely. This is useful if you want to have a completely custom title view.

titleFontFont?

Sets the font of the title view.

titleColorColor?

Sets the color of the title view.

upperBackgroundColorColor?

Sets the background color of the top portion of the view (title view, filter view, and top action buttons view).

lowerBackgroundColorColor?

Sets the background color of the bottom portion of the view (the list).

FeedNotificationRowTheme

#

Overview

#

FeedNotificationRowTheme allows for UI customization of the row items in the KnockInAppFeedView.

Properties

#
showAvatarViewBool

Show or hide the avatar/initials view in the upper left corner of the row.

avatarViewThemeAvatarViewTheme

Customize styling of avatarview.

notificationContentCSSString?

Customize the css of the markdown html of the notification body.

backgroundColorColor

Background color of the FeedNotificationRow.

markAsReadSwipeConfigSwipeButtonConfig?

This is the config to set the mark as read/unread swipe actions. Set to null to remove the action entirely.

archiveSwipeConfigSwipeButtonConfig?

This is the config to set the archive/unarchive swipe actions. Set to null to remove the action entirely.

unreadNotificationCircleColorColor

Color of the unread circle indicator in the top left of the row.

sentAtDateFormatterDateFormatter

DateFormatter for the sent timestamp at the bottom of the row.

sentAtDateFontFont

Font for sent timestamp.

sentAtDateTextColorColor

Color for sent timestamp.

primaryActionButtonConfigActionButtonConfig

Styling for primary action buttons.

secondaryActionButtonConfigActionButtonConfig

Styling for secondary action buttons.

tertiaryActionButtonConfigActionButtonConfig

Styling for tertiary action buttons.

AvatarViewTheme

#

Overview

#

AvatarViewTheme allows for UI customization of the user avatar view in the row item.

Properties

#
avatarViewBackgroundColorColor

Background color of the view. This is more apparent when the view is showing initials instead of an image.

avatarViewInitialsFontFont

Font for the initials view.

avatarViewInitialsColorColor

Text color for the initials view.

avatarViewSizeCGFloat

Overall size of the avatar view.