Message receipts

Message receipts is a feature which allows users to know the status of the sent messages as well as the delivered and read time for the messages. The chat app users are well informed about the status of the sent messages.

Single Chat Message Receipt#

image_preview

Group Chat Message Receipt#

image_preview

The following are the Single and Group chat message receipt AppBar style and attributes for customizations.#

<style name="Custom" parent="MirrorFly">
    <item name="mf_appbar_style">@style/CustomAppBar</item>
</style>

<style name="CustomAppBar" parent="Widget.MirrorFly.AppBar">
    <item name="android:background">@color/primary_300</item>
    <item name="mf_appbar_title_appearance">@style/MirrorFlyH2OnDark01</item>
    <item name="mf_appbar_description_appearance">@style/MirrorFlyCaption2OnDark02</item>
    <item name="mf_appbar_divider_color">@color/primary_500</item>

    <item name="mf_appbar_left_button_text_appearance">@style/MirrorFlyButtonOnDark01</item>
    <item name="mf_appbar_left_button_text_color">@color/selector_on_primary</item>
    <item name="mf_appbar_left_button_tint">@color/ondark_01</item>
    <item name="mf_appbar_left_button_background">@drawable/mf_button_uncontained_background_custom</item>
    <item name="mf_appbar_right_button_text_appearance">@style/MirrorFlyButtonOnDark01</item>
    <item name="mf_appbar_right_button_text_color">@color/selector_on_primary</item>
    <item name="mf_appbar_right_button_tint">@color/ondark_01</item>
    <item name="mf_appbar_right_button_background">@drawable/mf_button_uncontained_background_custom</item>
  
</style>

The following are the `Single Chat` message receipt MessageInfo style and attributes for customizations.#

<style name="Custom" parent="MirrorFly">
    <item name="mf_message_info_style">@style/CustomMessageInfo</item>
</style>

<style name="CustomMessageInfo" parent="Widget.MirrorFly.MessageInfo">
    <item name="android:background">@drawable/selector_rectangle_light</item>
    <item name="mf_message_info_delivered">@style/MirrorFlySubtitle1OnLight01</item>
    <item name="mf_message_info_read">@style/MirrorFlySubtitle1OnLight01</item>
  
</style>

MessageInfo#

List of attributes of Widget.MirrorFly.MessageInfo#

Attribute	Resource type	Description
android:background	drawable/color	The user item background.
mf_message_info_delivered	text appearance	Size, color, font, and style of the delivered receipt.
mf_message_info_read	text appearance	Size, color, font, and style of the read receipt.

Note : To apply the declared custom styles, pass the R.style.Custom to the MessageInfoFragment.Builder as follows:

MessageInfoFragment.Builder(messageId,R.style.Custom)
                .setUseHeader(true)
                .setHeaderTitle("Custom Message Info")
                .setUseHeaderLeftButton(true)              
                .build()

GroupMessageInfoHeader#

The following are the `Group Chat` message receipt GroupMessageInfoHeader style and attributes for customizations.#

<style name="Custom" parent="MirrorFly">
    <item name="mf_group_message_info_header_style">@style/CustomGroupMessageInfoHeade</item>
</style>

<style name="CustomGroupMessageInfoHeade" parent="Widget.MirrorFly.GroupMessageInfoHeader">
    <item name="android:background">@drawable/selector_rectangle_light</item>
    <item name="mf_message_info_delivered">@style/MirrorFlySubtitle1OnLight01</item>
    <item name="mf_message_info_read">@style/MirrorFlySubtitle1OnLight01</item>
  
</style>

List of attributes of Widget.MirrorFly.GroupMessageInfoHeader#

Attribute	Resource type	Description
android:background	drawable/color	The user item background.
mf_message_info_delivered	text appearance	Size, color, font, and style of the delivered receipt.
mf_message_info_read	text appearance	Size, color, font, and style of the read receipt.

GroupMessageInfoChild#

The following are the message receipt GroupMessageInfoChild style and attributes for customizations.#

<style name="Custom" parent="MirrorFly">
    <item name="mf_group_message_info_child_style">@style/CustomGroupMessageInfoChild</item>
</style>

<style name="CustomGroupMessageInfoChild" parent="Widget.MirrorFly.GroupMessageInfoChild">
    <item name="android:background">@drawable/selector_rectangle_light</item>
    <item name="mf_message_info_delivered">@style/MirrorFlySubtitle1OnLight01</item>
    <item name="mf_message_info_read">@style/MirrorFlySubtitle1OnLight01</item>
</style>

List of attributes of Widget.MirrorFly.GroupMessageInfoChild#

Attribute	Resource type	Description
android:background	drawable/color	The user item background.
mf_message_info_delivered	text appearance	Size, color, font, and style of the delivered receipt.
mf_message_info_read	text appearance	Size, color, font, and style of the read receipt.

Note : To apply the declared custom styles, pass the R.style.Custom to the GroupMessageInfoFragment.Builder as follows:

GroupMessageInfoFragment.Builder(messageId,R.style.Custom)
                .setUseHeader(true)
                .setHeaderTitle("Custom Message Info")
                .setUseHeaderLeftButton(true)              
                .build()