Customizing Knock UI components in React Native
How to customize the UI of our pre-built components for React Native.
NotificationFeedCellStyle
#Overview
#NotificationFeedCellStyle allows for UI customization of the rows in the NotificationFeed.
Properties
#Color of the unread circle indicator in the top left of the row.
Determines whether to show the avatar/initials view in the upper left corner of the row.
Customizes the styling of the avatar view.
Customizes the styling of primary action buttons.
Customizes the styling of secondary action buttons.
Customizes the styling of tertiary action buttons.
Formatter for the sent timestamp at the bottom of the row.
Text style for the sent timestamp.
Customizes the CSS styles of the HTML content in the notification body.
EmptyNotificationFeedStyle
#Overview
#EmptyNotificationFeedStyle allows for UI customization of the empty state view when there are no notifications in the NotificationFeed.
Properties
#The title text displayed when the feed is empty.
The subtitle text displayed when the feed is empty.
Customizes the style of the title text.
Customizes the style of the subtitle text.
Customizes the style of the icon displayed in the empty state view.
The URL or local path to the icon image displayed in the empty state view.
ActionButtonStyle
#Overview
#ActionButtonStyle allows for UI customization of the action buttons in the NotificationFeed.
Properties
#Customizes the container style of the action button.
Customizes the text style of the action button.
Customizes the icon style of the action button.
AvatarViewStyle
#Overview
#AvatarViewStyle allows for UI customization of the avatar view in the NotificationFeed.
Properties
#Customizes the overall container style of the avatar view.
Customizes the image style of the avatar view.
Customizes the text style for initials when no avatar image is available.