Some test text!

Realtime collaboration customization


Customize the annotation reply UI
Custom theme colors
UI color attributes
Custom layout attributes
Use a custom viewer fragment

linkCustomize the annotation reply UI

linkCustom theme colors

All UI components in the real-time annotation reply interface can be customized using Android styles defined in res/styles.xml. You can extend ReplyBaseTheme.DayNight and override the inherited attributes to change the look of your reply UI. A description of each color attribute used in ReplyBaseTheme.DayNight is summarized below.

    <!-- Custom theme used by the reply UI components -->
    <style name="MyCustomReplyTheme" parent="ReplyBaseTheme.DayNight">
        <item name="replyColorBackgroundPrimary">#202D3D</item>
        <item name="replyColorBackgroundSecondary">#151e29</item>
        <item name="replyIconColor">#9dd8ff</item>
        <item name="replyDividerColor">#151e29</item>
        <item name="replyEditorSendButtonColor">#9dd8ff</item>
        <item name="replyEditorCancelButtonColor">#ff5722</item>
        <item name="android:textColorPrimary">#FFFFFF</item>
        <item name="android:textColorSecondary">#C9C9C9</item>

then you can use this theme by specifying it in your activity's theme using the replyTheme attribute:

    <!-- Style used by the activity containing the collaboration viewer Fragment-->
    <style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar.Bridge">
        <!-- Specify your custom reply theme with the replyTheme attribute -->
        <item name="replyTheme">@style/MyCustomReplyTheme</item>

This theme will look something like this:

Annotation reply UI with a custom theme.

linkUI color attributes

Below is a list of all available color and size attributes used by the annotation reply UI.

replyColorBackgroundPrimaryPrimary background color, used by most of the reply UIColor
replyColorBackgroundSecondarySecondary background color, used by the header and edit message labelColor
replyIconColorColor of icon image buttonsColor
replyDividerColorColor of horizontal dividersColor
replyEditorSendButtonColorColor of the send message text buttonColor
replyEditorCancelButtonColorColor of the cancel editing message text buttonColor
android:textColorPrimaryMain text color used in the text editor and message contentColor
android:textColorSecondaryText color used in subheaders, annotation preview content, and caption textColor
replySmallTextSizeText size of the reply messagesDimension
replyMediumTextSizeText size of the text editorDimension
replyLargeTextSizeText size of the headerDimension

linkCustom layout attributes

Each view in the reply UI can be further customized by individually specifying its style. Default styles are used by each view, and you can extend and override them in your reply theme.

Here is a list of default styles used by each view in the reply interface.

replyHeaderContainerStyleStyle used by the reply header containerStyle reference
replyCloseButtonStyleStyle used by the reply header close buttonStyle reference
replyListButtonStyleStyle used by the reply header list buttonStyle reference
replyTitleStyleStyle ued by the reply header titleStyle reference
replyMessagesContainerStyleStyle used by the reply message list containerStyle reference
replyMessageUsernameStyleStyle used by each reply message's usernameStyle reference
replyMessageDateStyleStyle used by each reply message's date stampStyle reference
replyMessageCommentStyleStyle used by each replymessage's commentStyle reference
replyMessageActionIconStyleStyle used by each reply message's action button, only shown if permission is available for current userStyle reference
replyPreviewTextStyleStyle used by the annotation preview text, only shown if annotation content is availableStyle reference
replyPreviewIconStyleStyle used by the annotation preview iconStyle reference
replyEditorContainerStyleStyle used by the text editor containerStyle reference
replyEditorSendButtonStyleStyle used by the text editor send buttonStyle reference
replyEditorEditTextStyleStyle used by the text editor's EditText viewStyle reference
replyEditorCancelButtonStyleStyle used by the text editor cancel button, shown when editing user commentsStyle reference
replyEditorEditHeaderTextStyleStyle used by the text editor header, shown when editing user commentsStyle reference

linkUse a custom viewer fragment

If you would like to customize the viewer fragment, you can extend CollabViewerTabHostFragment or CollabViewerTabFragment and pass in your custom classes to CollabViewerBuilder.

Get the answers you need: Support


Customize the annotation reply UI
Custom theme colors
UI color attributes
Custom layout attributes
Use a custom viewer fragment