Message Bubble

UIKit allows all types of message bubble to be replaced.

Text Message Bubble

Image Massage Bubble

Audio Message Bubble

Usage

To customize message bubble, implement AmityMessageListAdapter.CustomViewHolder and pass a custom ViewHolder for the corresponding message type.

class MainActivity : AppCompatActivity(), AmityMessageListAdapter.CustomViewHolder {

   override fun onCreate(savedInstanceState: Bundle?) {
       super.onCreate(savedInstanceState)
       setContentView(R.layout.activity_main)
       
        /**
         * Implement [AmityMessageListAdapter.CustomViewHolder] if customization is required for messageViews
         * set the customView listener using [AmityChatRoomFragment] instance
         */
       val chatRoomFragment = AmityChatRoomFragment
                                .newInstance("channelId")
                                .enableChatToolbar(boolean)
                                .customViewHolder(this)
                                .build(this)
        
        val transaction = supportFragmentManager.beginTransaction()
        transaction.replace(R.id.fragmentContainer, messageListFragment)
        transaction.addToBackStack(null)
        transaction.commit()
   }
}

Override method getViewHolder() to pass a custom ViewHolder

override fun getViewHolder(
        inflater: LayoutInflater,
        parent: ViewGroup,
        viewType: Int
    ): AmityChatMessageBaseViewHolder? {
        return when(viewType) {
            MessageType.MESSAGE_ID_TEXT_RECEIVER -> TextReceiverViewHolder(
                inflater.inflate(R.layout.custom_item_text_receiver, parent, false), EkoChatMessageBaseViewModel())
            MessageType.MESSAGE_ID_TEXT_SENDER -> TextSenderViewHolder(
                inflater.inflate(R.layout.custom_item_text_sender, parent, false), EkoChatMessageBaseViewModel()
            )
            //pass null for all the types where no customisation is required
            //Default UIKIT Ui will be rendered for all those types
            else -> null
        }
    }