-
Notifications
You must be signed in to change notification settings - Fork 1
Assets
Using the API delegate method ninchat(session:overrideImageAssetForKey:)
you may supply your own Image assets as UIImage
objects. See the table below for explanations on the supported asset keys.
Note that all the buttons may not be available in the UI. All the assets should be transparent where there is no color.
Asset key | Related UI control(s) | Notes |
---|---|---|
ninchatIconLoader |
Progress indicator icon in queue view. | |
ninchatIconChatWritingIndicator |
User is typing.. Indicator icon in chat bubble | Should be animated. |
ninchatChatBackground |
Chat view's repeating texture. | Should be repeatable (tiling). |
ninchatChatAvatarLeft |
Placeholder avatar icon for others' messages. | |
ninchatChatAvatarRight |
Placeholder avatar icon for my messages. | |
ninchatChatPlayVideo |
Play icon for videos | |
ninchatIconTextareaCamera |
Start video call button | |
ninchatIconTextareaAttachment |
Add attachment button | |
ninchatIconDownload |
Download button icon | |
ninchatIconVideoToggleFull |
Expand video to fullscreen | |
ninchatIconVideoToggleNormal |
Shrink video to fit a window | |
ninchatIconVideoSoundOn |
Sound is enabled | |
ninchatIconVideoSoundOff |
Sound is muted | |
ninchatIconVideoMicrophoneOn |
Microphone is enabled | |
ninchatIconVideoMicrophoneOff |
Microphone is muted | |
ninchatIconVideoCameraOn |
Camera is on | |
ninchatIconVideoCameraOff |
Camera is off | |
ninchatIconVideoHangup |
End the video call | |
ninchatIconRatingPositive |
Ratings view positive icon | |
ninchatIconRatingNeutral |
Ratings view neutral icon | |
ninchatIconRatingNegative |
Ratings view negative icon | |
ninchatQuestionnaireBackground |
Questionnaire view's repeating texture. | Should be repeatable (tiling). |
ninchatIconMetadata |
Metadata messages' icon |
Using the API delegate method ninchat(session:overrideColorAssetForKey:)
you may supply your own color assets as UIColor
objects. See the table below for explanations on the supported asset keys.
Asset key | Related UI control(s) |
---|---|
ninchatColorButtonPrimaryText |
Text on 'primary' buttons |
ninchatColorButtonSecondaryText |
Text on 'secondary' buttons |
ninchatColorInfoText |
Chat view's meta information (eg. 'Chat started') |
ninchatColorChatName |
User name above chat bubbles |
ninchatColorChatTimestamp |
Timestamp above chat bubbles |
ninchatColorChatBubbleLeftText |
Text in others' chat messages |
ninchatColorChatBubbleRightText |
Text in my chat messages |
ninchatColorChatBubbleLeftTint |
Background color for left side chat bubbles |
ninchatColorChatBubbleRightTint |
Background color for right side chat bubbles |
ninchatColorTextareaText |
Chat input text |
ninchatColorTextareaSubmitText |
Text of the submit button title |
ninchatColorTextareaPlaceholder |
Chat input placeholder |
ninchatColorChatBubbleLeftLink |
Link color in others' messages |
ninchatColorChatBubbleRightLink |
Link color in my messages |
ninchatColorModalTitleText |
Text in 'modal dialogs' |
ninchatColorTextTop |
Text in top parts of some views |
ninchatColorTextBottom |
Text in bottom parts of some views |
ninchatColorLink |
Link color (except in chat bubbles) |
ninchatColorRatingPositiveText |
Text of the positive rating button |
ninchatColorRatingNeutralText |
Text of the neutral rating button |
ninchatColorRatingNegativeText |
Text of the negative rating button |
ninchatColorTitlebarCloseText |
Text of the close button in the titlebar |
ninchatColorCloseText |
Text of the close button when the agent closes the chat |
ninchatColorCloseChatText |
Text of the close button in other places, e.g. queue page |
ninchatColorChatBubbleComposeTint |
Background color for Compose Messages' bubbles |
Starting version 0.4.0, the SDK introduces ninchat(session:overrideLayer)
delegate as a more sophisticated approach for overriding UIKit elements. By benefiting from CALayer
, the application can apply any UI changes including border width and radius, background colors and gradients, and many other options. The below is a list of supported overriding options, which would be extended in a near future.
Asset Key | Related UIControl(s) |
---|---|
ninchatTitlebarCloseButton |
Chat Close Button in the titlebar |
ninchatChatCloseButton |
Chat Close Button when the agent closes the chat |
ninchatCloseButton |
Chat Close Button in other places, e.g. queue page |
ninchatTextareaSubmitButton |
Chat Text Area Send Button |
ninchatPrimaryButton |
All Primary Buttons |
ninchatSecondaryButton |
All Secondary Buttons |
ninchatTitlebarCloseEmptyButton |
Chat Close Button With No Title in the titlebar |
ninchatChatCloseEmptyButton |
Chat Close Button when the agent closes the chat With No Title |
ninchatCloseEmptyButton |
Chat Close Button With No Title in other places, e.g. queue page |
ninchatModalTop |
Top Part In Some Views |
ninchatModalBottom |
Bottom Part In Some Views |
ninchatBackgroundTop |
Background Of Top Part In Some Views |
ninchatBackgroundBottom |
Background Of Bottom Part In Some Views |
ninchatQuestionnaireRadioSelected |
Questionnaire 'Radio' When Selected |
ninchatQuestionnaireRadioUnselected |
Questionnaire 'Radio' When Unselected |
ninchatQuestionnaireNavigationNext |
Questionnaire 'Next' Button |
ninchatQuestionnaireNavigationBack |
Questionnaire 'Back' Button |
ninchatMetadataContainer |
Metadata messages |
ninchatComposeSelectedButton |
Button in Compose Messages when is selected |
ninchatComposeUnselectedButton |
Button in Compose Messages when is unselected |
ninchatComposeSubmitSelectedButton |
Submit button in Compsoe Messages when is selected |
ninchatComposeSubmitButton |
Submit button in Compsoe Messages when is unselected |
ninchatColorTextareaTextInput |
TextArea input |
ninchatQuestionnaireCheckbox |
Checkbox's shape in questionnaires |
Starting version 0.3.0, the SDK supports questionnaire feature before the chat starts and after the chat is finished. Using the API delegate method ninchat(session:overrideQuestionnaireColorAssetKey)
you may supply your own color assets as UIColor
objects. See the table below for explanations on the supported asset keys.
Asset key | Related UI control(s) |
---|---|
ninchatQuestionnaireColorTitleText |
Text on Title items |
ninchatQuestionnaireColorTextInput |
Text on Input items |
ninchatColorTextareaSelectedText |
Background color of the selected text inside a chat input |
ninchatQuestionnaireColorRadioSelectedText |
Text on 'primary' Radio buttons |
ninchatQuestionnaireColorRadioUnselectedText |
Text on 'secondary' Radio buttons |
ninchatQuestionnaireColorCheckboxSelectedText |
Text on 'primary' Checkbox items |
ninchatQuestionnaireColorCheckboxUnselectedText |
Text on 'secondary' Checkbox items |
ninchatQuestionnaireCheckboxSelectedIndicator |
Tint and border on 'primary' Checkbox items |
ninchatQuestionnaireCheckboxUnselectedIndicator |
Tint and border on 'secondary' Checkbox items |
ninchatQuestionnaireColorSelectSelectedText |
Text, indicator, and border color for 'selected' state on Select items |
ninchatQuestionnaireColorSelectUnselectText |
Text, indicator, and border color for 'normal' state on Select items |
ninchatQuestionnaireSelectSelected |
Background on 'selected' state on Select items |
ninchatQuestionnaireSelectUnselected |
Background on 'unselected' state on Select items |
ninchatQuestionnaireColorNavigationNextText |
Text and border on Next navigation button |
ninchatQuestionnaireColorNavigationBackText |
Text and border on Back navigation button |
ninchatQuestionnaireColorTextInputBorder |
Border color for Text Input items |
ninchatQuestionnaireColorTextInputErrorBorder |
Border color for Text Input items when the input is not valid |
ninchatQuestionnaireColorSelectBorder |
Border color for Select items |
ninchatQuestionnaireColorBubble |
Background color for conversation-style questionnaire bubbles |
Starting version 0.5.1, the SDK has removed old keys for overriding assets. If you have not yet updated your application, you can clone the old version of on branch wiki-v1
and find suitable alternatives.